Second text field, best way to do it?

#1

Hi everyone,

What would be the best way to add a second text field, in edit mode only, preferably that I can see in the preview pane?

Use case: File for producing Spanish resources as exported htmls from node.js, but with a second text field below the default text field, for me to add any additional notes in English, only viewable in edit mode.

1 Like
Using textareas instead of inputs for fields?
#2

Hi Dave

Did you try modifying the edit template to include the field?

I’ve done something related… but I have several “extra” editors that bring up related tiddlers (not fields). Probably overkill for what you’re aiming for.

#3

Dunno about the best way but this is probably the standard way:

title: mytemplate
tags: $:/tags/EditViewTemplate
list-after: $:/core/ui/EditTemplate/body
text: <$edit-text field=ingles tag=textarea class="myclass"/>

…and a stylesheet:

title: mystylesheet
tags: $:/tags/Stylesheet
type: text/css
text: .myclass {width:100%;}
2 Likes
#4

Thanks twMat, that was perfect! Just what I needed!

#5

@DaveGifford also just add to @twMat’s suggestion the creation of a tiddler to hide the visibility of the field in standard field editor because to edit it with that it will destroy the text area;

eg $:/config/EditTemplateFields/Visibility/ingles containing hide

Do test on single and node implementations to test your tiddlers survive a save and reload (someone raise this issue in the past), but I don’t think it is present now.

For other passing the tag should be $:/tags/EditTemplate (@twMat typo)

I made a package demonstrating this and including the hide field. You can hide the button and just add, but not edit the “note” field using the normal field editor.

tiddler-note-field.json (1.4 KB)

Other improvements would be to

  • add the editor toolbar to it as well, just ask if your want that.
  • Also provide a viewTemplate, perhaps behind a details widget.
1 Like
#6

Thanks Tony, I will play around with this. I did notice the typo, but added it for fun and for some reason it did work as …ViewTemplate. Anyway, yes I chnged it to edittemplate before responding here yesterday.

I noticed on twMats solution that it was making the fields area act weird (with every keystroke in a new field, the tiddler slid down to hide the type and fields area), so I listed it after fields and it worked better.

I am not sure what you are talking about destroying the text field. I m using twMats solution and added text to both fields, saved, the normal text field displayed correctly in view mode, and I edited it again and everything in both fields is intact.

#7

@TW_Tones

With a couple changes I got it to work my way (slider, and taller field):

Changed your stylesheet to .tiddler-note-field-class {width:98%;minHeight:24em;font-size:13pt;}

Changed your edittemplate to make it a slider

<details><summary>[[Note:|$:/PSaT/tiddler-note-field]]</summary><$list filter="[all[current]has:field[note]]" variable=~>
   <$edit-text field=note tag=textarea rows="15"class="tiddler-note-field-class"/>
</$list>
<$list filter="[all[current]!has:field[note]]" variable=~>
   <$button tooltip="Click to add Note field on this tiddler" set="!!note" setTo="">Note {{$:/core/images/new-button}}</$button>
</$list></details>

Thanks Tony! I wouldn’t need it with a viewtemplate, but the editortoolbar would bre really helpful.

1 Like
#8

It appears this was not as straightforward as I thought, but I am looking at it now.

#9

@TW_Tones If it is going to be a bother, don’t do it on my behalf.

#10

No at all, also wanted it for myself.

I have “improved it” but perhaps borrow the features you want.

New features;

  • Editor toolbutton
    • Using preview breaks the mechanism
  • Details widget use default closed
  • Border and css to make it distinct
  • Copy note to clipboard
  • Delete note field
  • Tag displayed to reorder editor

tiddler-note-field.json (3.8 KB)

Any other ideas to improve let me know.

If you do break the preview delete $:/core/ui/EditorToolbar/preview to revert to the shadow tiddler.

#11

Some time ago I did create an experimental “field-editor” plugin. See: [Intro] Field Editor Plugin

It creates a “side by side” view. So not 100% what you requested, but similar.

#12

Wow! Yes this is great Tones. Thanks! And thanks, Mario for a different alternative. Blessings to all.

#13

I do feel a more generic plug and play solution for additional text fields along with field definitions and field types is the next step in empowering the design of tiddlywikis.

1 Like