Capture info from a form, format and insert into a tiddler?

43 visningar
Hoppa till det första olästa meddelandet

Mark S.

oläst,
8 feb. 2009 13:18:252009-02-08
till TiddlyWiki
I'm looking for a way to ease data entry into a table kept in one
tiddler.

First, yes I know about FormTiddler. But that tiddler/macro stores
data in its own <data> field elements.

What I would like is a tiddler macro that might work like this: You
set up a form in a tiddler. The last field in the tiddler is a macro
that generates a submit button and looks something like:

<<captureForm format:"formated string %1 %2"
tiddler:TiddlerWhereStringInserts [top|bottom]>>

When you submit, the data from the form would be collected, formatted
(printf style), and inserted into the top or bottom of the specified
tiddler.

Does something like this already exist? This would allow you to
quickly put new entries into tables, which are somewhat tedious to do
by hand.

Thanks!
Mark

Eric Shulman

oläst,
8 feb. 2009 15:19:422009-02-08
till TiddlyWiki
> What I would like is a tiddler macro that might work like this: You
> set up a form in a tiddler.
>...
> When you submit, the data from the form would be collected, formatted
> (printf style), and inserted into the top or bottom of the specified
> tiddler.

This should help:

http://www.tiddlytools.com/faq.html#FAQ_CreateTiddlersFromForms

enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios

Måns

oläst,
8 feb. 2009 17:25:322009-02-08
till TiddlyWiki
Hi Mark and Eric

I've been trying to change the code in CreateTiddlersFromForms to
produce a sortable table for my specific needs.
I know that I'm far out of my league trying to change html-code - as I
am a total newbie in writing html.

As You can see in my thread:"Getting macros into a form or a
predefined tiddler" I've been trying to solve the same issue in
several differnt ways..

What I want it to produce is something like this (in tw-format):
Title=Date
text: !!Fredagssangtimen
<<toggletag Sang>> <<toggletag SangArkiv>>
|sortable|k
|Nr|Titel|Mappe|Side|Ny|Piano|h
|1|field1list from a tiddler|field2<<checkbox>>|field3(Side)|
field4<<checkbox>>|field5list from a tiddler|
|2||||||
|3||||||
|4||||||
|5||||||
|6||||||
|7||||||
|8||||||
|9||||||
|10||||||
|11||||||
|12||||||
|13||||||
|14||||||
textfield:Comments:

I've tried to change some values - but it's "in the dark"....

Here whats I've been doing with CreateTiddlersFromForms (it doesn't
work at all - and is not any way near what I'm trying to accomplish):
Maybe You can see where I'm doing something wrong...

/%
|Beskrivelse|Lav sangtimetabellen i en Html-formular|
%/
{{small{
__Lav sangtimetabellen i en Html-formular__

The following HTML demonstrates a technique for using an HTML form,
rendered in a tiddler, to input and create tiddlers with custom-
formatted content
!!!!Try it:
{{smallform{
<html><hide linebreaks><!-- see HTMLFormattingPlugin --><form
action="javascript:;"
onsubmit="
/* validate new title */
var t=this.title.value;
if (!t.length || t==this.title.defaultValue)
{ alert('A title is required'); this.title.focus(); return false; }
if (store.tiddlerExists(t) && !confirm
(config.messages.overwriteWarning.format([t])))
{ this.title.focus(); return false; }

/* get current tiddler (if any) */
var tid=store.getTiddler(t);
var who=tid?tid.modifier:config.options.txtUserName;
var when=tid?tid.modified:new Date();
var txt=tid?tid.text:'';
var tags=tid?tid.tags:[];
var fields=tid?tid.fields:{};

/* get form values and construct new tiddler text */
var fmt='|%0|%1|\n%2\n';
var newtxt=fmt.format
([this.field1.value,this.field2.value,this.field3.value,this.field4.value,this.field5.value,this.field6.value,this.field7.value,this.field8.value,this.field9.value,this.field10.value,this.field11.value,this.field12.value]);

/* insert new text at marker (or end, if no marker) */
var marker='/%MARKER%/';
if (txt.indexOf(marker)==-1) txt=txt+newtxt;
else txt=txt.replace(new RegExp(marker.escapeRegExp()),newtxt
+marker);

/* get new tags and add to existing tags (if any) */
var newtags=this.tagsfield.value.readBracketedList();
for (var i=0; i<newtags.length; i++) tags.pushUnique(newtags[i]);

/* write and show tiddler */
store.saveTiddler(t,t,txt, who, when, tags, fields);
story.displayTiddler(story.findContainingTiddler(this),t);
return false;">
Title <input name="title" value="Skriv dato" onfocus="this.select()">
Sang1 <input name="field1" value="sortable|k\n" onfocus="this.select
()">
Sang2 <input name="field2" value="Sang1 value" onfocus="this.select
()">
Sang3 <input name="field3" value="Sang2 value" onfocus="this.select
()">
Sang4 <input name="field4" value="Sang3 value" onfocus="this.select
()">
Sang5 <input name="field5" value="Sang4 value" onfocus="this.select
()">
Sang6 <input name="field6" value="Sang5 value" onfocus="this.select
()">
Sang7 <input name="field7" value="Sang6 value" onfocus="this.select
()">
Sang8 <input name="field8" value="Sang7 value" onfocus="this.select
()">
Sang9 <input name="field9" value="Sang8 value" onfocus="this.select
()">
Sang10 <input name="field10" value="Sang9 value" onfocus="this.select
()">
Sang11 <input name="field11" value="Sang10 value" onfocus="this.select
()">
Sang12 <input name="field12" value="Sang11 value" onfocus="this.select
()"><br>
<textarea name="Kommentarer" rows=5 style="width:100%;">Kommentarer
skrives her</textarea><br>
<input name="tagsfield" value="Sang" style="width:100%;"><br>
<input type="submit" value="create tiddler">
</form></html>

Mark S.

oläst,
8 feb. 2009 17:36:282009-02-08
till TiddlyWiki
Hi Eric,

Wow, did you just throw that together?

It looks very promising. I see that I should be able to put a %MARKER%
in the code to specify where the formatted text ends up. That bit
doesn't seem to be working. In case I'm using it wrong, here's what
I'm doing.

I have a tiddler, call it "Target", where I want the text to appear. I
want the new text to appear at the top of the tiddler, so I put
"%MARKER%" at the top of the target tiddler.

I run your code and another form out of another tiddler called
CreateTiddlersFromHTMLForms. I specify the contents of the fields, and
hit the submit button. It asks me if I want to overwrite. I say yes.
Then the Target tiddler appears with the new data appended. But the
data is appended at the bottom of the tiddler, not at the top where
%MARKER% appears.

Am I doing something wrong?

Thanks!
Mark

Mark S.

oläst,
8 feb. 2009 17:46:502009-02-08
till TiddlyWiki
Hello Måns,

I'm not sure if I understand your sorting issue. I think that may be a
topic for a different thread.

But for your fields, you need to change this string in the code:

var fmt='|%0|%1|\n%2\n';

to format and place your fields. As written, this will only show the
first 3 of your fields. You need to add field placement id's (e.g. %0,
%1) for each place where your want your field to show up in the
resulting text. Maybe something like:

var fmt='|%0|%1|%2|%3|%4|%5|%6|%7|%8|%9|%10|\n%11\n';

-- Mark

Eric Shulman

oläst,
8 feb. 2009 17:52:052009-02-08
till TiddlyWiki
> I have a tiddler, call it "Target", where I want the text to appear. I
> want the new text to appear at the top of the tiddler, so I put
> "%MARKER%" at the top of the target tiddler.
>...
> Then the Target tiddler appears with the new data appended. But the
> data is appended at the bottom of the tiddler, not at the top where
> %MARKER% appears.

The marker sequence includes the leading and trailing "/" characters,
like this:

/%MARKER%/

so that it forms a TiddlyWiki *comment* that can be embedded in a
tiddler without it being rendered as visible content.

enjoy,
-e

Eric Shulman

oläst,
8 feb. 2009 17:55:502009-02-08
till TiddlyWiki
> var fmt='|%0|%1|%2|%3|%4|%5|%6|%7|%8|%9|%10|\n%11\n';

You can use %0 through %9... to format more than 10 fields, you will
need to format it in separate parts, and then contcatenate the parts,
like this:

var txt1='|%0|%1|%2|%3|%4|%5|%6|%7|%8|%9|'.format([...]);
var txt2='%0|\n%1\n'.format([...]);
var newtxt=txt1+txt2;

enjoy,
-e

Mark S.

oläst,
8 feb. 2009 18:24:012009-02-08
till TiddlyWiki
Another subtlety revealed!

One thing, Måns said it wasn't working for him at all. It appears to
me that if the number of array items doesn't match the format string
exactly, that the rest of the js doesn't run at all. That would
explain his problem, since clearly the format string didn't match his
array.

I could be wrong in this interpretation, since I couldn't find any
entry in the error console. But it seemed to work that way when I was
altering the number of fields.

-- Mark

R-Italy

oläst,
10 feb. 2009 04:03:102009-02-10
till TiddlyWiki
Hi,
i've tried to use a form to insert local file link into a new tiddler.
the fact is that an input field with type "file" is not managed
correctly by FF3 (it works correctly with IE).

<input type="file" id="filebox" name="source" >

using this.source in the onclick method:
-> in FF3, i get just the file name+extension (image.jpg)
-> in IE, i get the full an correct url (file://bla/bla/bla/image.jpg)

i've tried to take inspiration from "FF3_FIXUP" used by Eric in the
AttachFilePlugin but no success. Could you please advice?
Thanks in advance
-R

Mark S.

oläst,
11 feb. 2009 12:04:452009-02-11
till TiddlyWiki
I believe this may be a bug in FireFox with CSS customization. Does it
work if you take out id="filebox" ?

It works fine for me as you posted in FF3 (3.0.6), but I don't have
anything defined for id, so maybe it goes back to its default behavior
when there is no customization.

If you do a google search for "input type file not working firefox" it
looks like there are others that have encountered this problem and may
have a workaround.

-- Mark

Mark S.

oläst,
11 feb. 2009 12:06:082009-02-11
till TiddlyWiki
Hi Eric,

This is working really great. What would I need to do to make this
code reusable (to use on more than one form) ?

Thanks!
Mark

Mark S.

oläst,
15 feb. 2009 01:05:372009-02-15
till TiddlyWiki
For what its worth, I've moved the code from the "onsubmit" into a
function that gets set up in my own name space object in a plugin. I
pass the format and field information into the function. In the html
form element it looks like this:

onsubmit="mas.submitForm(this,'| %0 |%1 | %2| %3| %4| %5|%6 |\n',

[this.fldDate.value,this.fldDest.value,this.fldMax.value,this.fldAvg.value,
this.fldDist.value, this.fldTime.value, this.fldCom.value] )"

There's probably smarter ways to do this, but it seems to be working.
I can see this being useful in all sorts of logging situations.

Thanks again,
Mark
Svara alla
Svara författaren
Vidarebefordra
0 nya meddelanden