In message <[email protected]> on
Mon, 16 Jun 2014, andrew.j.harrison84 <[email protected]>
writes
>Not intending to add additional frustration since I know you are using
>TWC but I have it in TW5 with just:<$edit field="text"
>class="tw-edit-texteditor" tiddler="$:/Ticksheet/temp"/>
In the end I gave up on both trying to use expandingtextareas and Erics
TextAreaPlugin to do what I wanted, and decided that actually I would
much prefer my tiddler not to look like a form when not being edited
anyway.
I started looking into options for edit-in-place, but I could only find
options for editing-in-place whole forms using TWtid/TWted, not just
individual fields, and I couldn't get them to work anyway.
So I decided to learn enough javascript to write my own fork of the
FormTiddlerPlugin called FormViewTiddlerPlugin. This looks for an
"Edit" tag, and only display the form elements if the tag exists. If the
Edit tag doesn't exist then the formViewTiddler adds a simple span
containing the text of the data element and hides the form element.
I then added a CheckBoxToggleTag to the end of my form to Toggle between
Edit and View modes:
<span macro='tiddler CheckboxToggleTag with: Edit'>
Toggle edit/view mode
</span>
If anyone would like a copy of FormViewTiddlerPlugin, let me know and I
will publish it somewhere.
After developing this Plugin though, and learning a lot about the
TiddlyWiki and its DOM in the process, I realised that my forms still
didn't look how I wanted.
While large text areas were now shrunk down to their minimum size,
unused sections were still visible and taking up space.
Then I realised that could probably do what I wanted with judicious use
of HideWhenPlugin and wikify within my form table.
Instead of:
<tr>
<td align="right"><b>Background:</b></td>
<td><textarea name=Background rows="1" cols="40" style="width:98%" >
</textarea></td>
</tr>
I now had:
<tr>
<td align="right">
<span macro="showWhen tiddler.tags.contains('Edit') ||
tiddler.data('Background') ">
<b>Background:</b>
</span>
</td>
<td>
<span macro="showWhen !tiddler.tags.contains('Edit') &&
tiddler.data('Background') ">
<span macro="wikify [[%0]] {{tiddler.data('Background')}}">
</span>
</span>
<span macro="showWhen tiddler.tags.contains('Edit')">
<textarea name='Background' rows="1" cols="40" >
</textarea>
</span>
</td>
</tr>
Thus:
* The title is shown when either there is valid data, or the form is in
edit mode.
* The data is only be shown if the data is valid and the form is not in
edit mode.
* Finally, the input is only shown in edit mode.
This allows me to add lots of optional fields, which are only shown in
edit mode and get hidden, along with their titles, if they are not
populated.
This still doesn't quite what I want however, since there is still a
runt table row, but overall I'm very impressed with what you can do with
TiddlyWiki plugins.
The next step is to roll this out to my full project, but I'm happy with
how well it works in my minimal test project.
Finally, many apologies for my previous multi-posting, there was some
misunderstanding on my part as to how the Google Groups Web interface
worked, so I thought it wasn't sending my replies (i.e. replying to
sender rather than the group). I have resolved not to use the web
interface any more to prevent this happening in the future.
Regards,
Mark..........
--
Mark Booth
--
You received this message because you are subscribed to the Google Groups
"TiddlyWikiDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywikidev.
For more options, visit https://groups.google.com/d/optout.
