dolmen.widget.file 1.0b2

File widget for `zeam.form` and `Dolmen`

Example

We are going to develop here a small example, to demonstrate the use of dolmen.widget.file. First, we need to create a model content with a file field:

>>> import dolmen.file
>>> import grokcore.component as grok
>>> from zope.interface import Interface
>>> from zope.schema.fieldproperty import FieldProperty

>>> class ITravelMount(Interface):
...   luggage = dolmen.file.FileField(title=u'Luggages')

>>> class Mammoth(grok.Context):
...   grok.implements(ITravelMount)
...   luggage = FieldProperty(ITravelMount['luggage'])

We now have a travel mammoth on which we can add a luggage. Now, we need a form to edit the animal:

>>> from zeam.form.ztk import Form, Fields

>>> class EditMammoth(Form):
...    grok.name('edit')
...    grok.context(ITravelMount)
...    ignoreContent = False
...    fields = Fields(ITravelMount)

>>> grok.testing.grok_component('edit', EditMammoth)
True

Let's instanciate a Mammoth and try to call the form on it:

>>> from zope.component import getMultiAdapter
>>> from zope.publisher.browser import TestRequest

>>> manfred = Mammoth()
>>> request = TestRequest()

>>> form = getMultiAdapter((manfred, request), name='edit')
>>> form.updateWidgets()

>>> print form.fieldWidgets.get('form.field.luggage').render()
<div id="form-field-luggage">
    <input type="file" id="form-field-luggage-input"
           name="form.field.luggage" />
</div>

Now, let's try with a value:

>>> manfred.luggage = "A nice data"
>>> form = getMultiAdapter((manfred, request), name='edit')
>>> form.updateWidgets()
>>> print form.fieldWidgets.get('form.field.luggage').render()
<div id="form-field-luggage">
  <div>
    <input type="radio" value="keep" checked="checked"
           class="noborder" name="form.field.luggage.action"
           onclick="document.getElementById('form-field-luggage-input').disabled=true"
           id="form-field-luggage-action" />
    <label for="form-field-luggage-action">Keep existing file</label>
    <br />
    <input type="radio" value="delete" class="noborder"
           name="form.field.luggage.action"
           onclick="document.getElementById('form-field-luggage-input').disabled=true"
           id="form-field-luggage-delete" />
    <label for="form-field-luggage-delete">Delete existing file</label>
    <br />
    <input type="radio" value="replace" class="noborder"
           name="form.field.luggage.action"
           onclick="document.getElementById('form-field-luggage-input').disabled=false"
           id="form-field-luggage-replace" />
        <label for="form-field-luggage-replace">Replace with new file</label>
    </div>
  <div>
    <input type="file" id="form-field-luggage-input"
           name="form.field.luggage" />
    <script type="text/javascript">document.getElementById('form-field-luggage-input').disabled=true;</script>
  </div>
</div>

Changelog