recognize form content from Ajax.Updater after Event.observe(window, 'load', init, false);

174 views
Skip to first unread message

craigthewebguy

unread,
Aug 5, 2008, 4:44:24 PM8/5/08
to Prototype & script.aculo.us
After doing more research and scratchin' my head I now hopefully have
a better explanation of my challange. The "can't view source" was a
symptom. In the end I'm trying to use prototype to submit the
contents of a form and some hidden fields. The form and the hidden
fields are dynamic content generated by Ajax.Updater after the
intitial page load.

Since the form and hidden fields generated by Ajax.Updater were not
present when the initial page loaded, they aren't being recognized by
Event.observe(window, 'load', init, false); . When I try to submit my
dynamically generated form, the form and hidden fields aren't seen by
prototype because they were not there when the page originially
loaded.

Is there another way I should do Event.observe(window, 'load', init,
false); ? Or mabe I have to eval the dynamically generated form and
hidden fields? If so how?

Thanks and sorry for not being a bit more clear.


Craig

Diodeus

unread,
Aug 5, 2008, 5:00:52 PM8/5/08
to Prototype & script.aculo.us
<FORM> tags must be added through the DOM, not though updating HTML
elements. So you can either have the form on the page at load time,
then add the fields and contents to the form in your Ajax call, or you
can use the new Element constructor to do it in code.

Here's a trick to viewing your source after it has been modified by
code: After your page if rendered, click on the page, do CTRL-A, copy
and paste it into something that understands HTML. I paste in into
Dreamweaver in design mode. Works well.

Justin Perkins

unread,
Aug 5, 2008, 5:17:27 PM8/5/08
to prototype-s...@googlegroups.com
> Here's a trick to viewing your source after it has been modified by
> code: After your page if rendered, click on the page, do CTRL-A, copy
> and paste it into something that understands HTML. I paste in into
> Dreamweaver in design mode. Works well.

Also Firefox has a "View Selected Source" option when text on the
screen is highlighted and you right-click on the page. Using Firebug
inspector also reveals generated source.

-justin

craigthewebguy

unread,
Aug 5, 2008, 5:43:59 PM8/5/08
to Prototype & script.aculo.us
Thanks Diodeus,

My form tags are present upon the initial page load. There is my html
on initial load ...

<form id="messageForm5" name="messageForm5">
<table width="389" border="0">
<tr>

<td id="news_message">

'this is where my dynamic text area and hidden fields appear after a
call to Ajax.Updater in my function showMessage()'

</td>

<td valign="top"><img src="images/edit.jpg" width="40"
height="13" onClick="showMessage('<? echo $cookie[0] ?>','<? echo
date("F|d|Y") ?>','Y')"><br>
<br> <img src="images/save.jpg" width="40"
height="13" onClick="storeMessage5()" ></td>
</tr>
</table>
</form>

I think that because I'm using Event.observe(window, 'load', init,
false); .on the initial page load. prototype isn't recognizing my
dynamically generated fields inside my form. Should do
Event.observe(window, 'load', init, false); different or maybe eval
my dynamic data? How can i submit these dynamically generated fields
using Prototype?

Thanks for the help ...

Craig
> > Craig- Hide quoted text -
>
> - Show quoted text -

T.J. Crowder

unread,
Aug 6, 2008, 6:20:03 AM8/6/08
to Prototype & script.aculo.us
Hi Craig,

> My form tags are present upon the initial page load.

...but the form elements (inputs, textareas, etc.) are not. Those are
the ones that he's saying you need to add via DOM methods rather than
by using update/innerHTML.

> ...prototype isn't recognizing my
> dynamically generated fields inside my form...

It's not Prototype, it's the DOM. Prototype just uses the DOM.

Hope this helps,
--
T.J. Crowder
tj / crowder software / com

Matt Petrovic

unread,
Aug 6, 2008, 9:32:45 AM8/6/08
to Prototype & script.aculo.us
what does init do?
can you access these elements with $()?
Can we see your javascript?

luftikus143

unread,
Sep 15, 2008, 8:28:05 AM9/15/08
to Prototype & script.aculo.us
> or you can use the new Element constructor to do it in code.

Hi there,

how would I do this? Having the same or similar problem. I am adding a
new form to the page. In Safari/Opera on Mac, it works great. With IE
on Win as well. But not with FF...

Thanks for any hints!
Reply all
Reply to author
Forward
0 new messages