Move value from one form element to another, hidden element viaJavaScript

[OccasionalFlyer]

I am working on changing some HTML. I need to find how the value of a
hidden field is being set. The value of the hidden field will be set
based upon a user selection. This HTML has a hidden field. The value
of the hidden field comes from a value that is not displayed but is
associated with a field in a select list that is displayed (after
being populated on the fly). The author of this 4000+ line HTML file,
wrote JavaScript that is well beyond my "a little past beginner"
JavaScript knowledge.

What I need is to figure out where the code is that moves a value
to this hidden field, because I need to do the same thing elsewhere.
However, after looking at a lot of this file, I am at a loss as to how
this magic is done. I don't know what to search for, and don't know
if at some point some function is called and the actual name of the
hidden field isn't used there or what. I searched for the hidden
field elsewhere in the file but I did not find anything like
hidden_field_name = selected_item. Can someone please suggest a way
to figure out how this element gets updates? It does not have an
onChange() event on the form element. Thanks.

Ken

 

[OccasionalFlyer]

One additional note: there is no onsubmit() function in the page
anywhere that I can but the author of the page did use JQuery, so I
don't know what effect that might have.

 

[RobG]

One additional note:  there is no onsubmit() function in the page
anywhere that I can but the author of the page did use JQuery, so I
don't know what effect that might have.

Put the page up somewhere on the web and post in a jQuery group. It
may use some form of document ready function to attach listeners or
event delegation based on a CSS selector for one or more elements.
Just guessing, of course.

Use Firebug to find out - inspect the elements that fire events, go up
the document tree looking for something with a listener.

 

[SAM]

Le 7/27/09 10:07 PM, OccasionalFlyer a écrit :

I am working on changing some HTML. I need to find how the value of a
hidden field is being set. The value of the hidden field will be set
based upon a user selection. This HTML has a hidden field. The value
of the hidden field comes from a value that is not displayed but is
associated with a field in a select list that is displayed (after
being populated on the fly). The author of this 4000+ line HTML file,
wrote JavaScript that is well beyond my "a little past beginner"
JavaScript knowledge.

usually in a "normal" html file
a hidden field cand be completed by a select this way :

<select onchange="var k = this.selectedIndex;
result.value=this.options[k].value;">
<option value="one">01
<option value="two">02
<option value="three">03
</select>

What I need is to figure out where the code is that moves a value
to this hidden field, because I need to do the same thing elsewhere.
However, after looking at a lot of this file, I am at a loss as to how
this magic is done. I don't know what to search for, and don't know
if at some point some function is called and the actual name of the
hidden field isn't used there or what. I searched for the hidden
field elsewhere in the file but I did not find anything like
hidden_field_name = selected_item. Can someone please suggest a way
to figure out how this element gets updates? It does not have an
onChange() event on the form element. Thanks.

Maybe an onClick ?

In the script you see nothing looking like 'addEvent or 'attachEvent' or
'listener' ?

 

[David Mark]

Le 7/27/09 10:07 PM, OccasionalFlyer a écrit :

I am working on changing some HTML.  I need to find how the value of a
hidden field is being set.  The value of the hidden field will be set
based upon a user selection. This HTML has a hidden field.  The value
of the hidden field comes from a value that is not displayed but is
associated with a field in a select list that is displayed (after
being populated on the fly).  The author of this 4000+ line HTML file,
wrote JavaScript that is well beyond my "a little past beginner"
JavaScript knowledge.

usually in a "normal" html file
a hidden field cand be completed by a select this way :

<select onchange="var k = this.selectedIndex;
result.value=this.options[k].value;">
   <option value="one">01
   <option value="two">02
   <option value="three">03
</select>

   What I need is to figure out where the code is that moves a value
to this hidden field, because I need to do the same thing elsewhere.
However, after looking at a lot of this file, I am at a loss as to how
this magic is done.  I don't know what to search for, and don't know
if at some point some function is called and the actual name of the
hidden field isn't used there or what.  I searched for the hidden
field elsewhere in the file but I did not find anything like
hidden_field_name = selected_item.  Can someone please suggest a way
to figure out how this element gets updates?  It does not have an
onChange() event on the form element.  Thanks.

Maybe an onClick ?

In the script you see nothing looking like 'addEvent or 'attachEvent' or
'listener' ?

Not likely as the OP indicated that jQuery was used. It will be
difficult if not impossible for a beginner to untangle the mess of the
previous developer(s). The "simple and concise" line is just a
marketing ploy. Similar predicaments are reported almost hourly in
the jQuery forums.

 

[SAM]

Le 7/28/09 8:08 AM, David Mark a écrit :

Not likely as the OP indicated that jQuery was used. It will be
difficult if not impossible for a beginner to untangle the mess of the
previous developer(s). The "simple and concise" line is just a
marketing ploy. Similar predicaments are reported almost hourly in
the jQuery forums.

Who knows ?
Perhaps that maybe ...
by chance ... fortuitously ... accidentaly ... for this time ...
a little bit of code could be not too much botched by jQuery's functions
?

 

[Garrett Smith]

I am working on changing some HTML. I need to find how the value of a
hidden field is being set. The value of the hidden field will be set
based upon a user selection. This HTML has a hidden field. The value
of the hidden field comes from a value that is not displayed but is
associated with a field in a select list that is displayed (after
being populated on the fly). The author of this 4000+ line HTML file,
wrote JavaScript that is well beyond my "a little past beginner"
JavaScript knowledge.

Ask the author. If he is not there, ask his (former) manager or whoever.

I hope they did not hire a guru/wizard to magically solve their problems
using jquery. Ignorance and laziness (mental laziness) can be
frustrating to an ambitious craftsman.

What I need is to figure out where the code is that moves a value
to this hidden field, because I need to do the same thing elsewhere.
However, after looking at a lot of this file, I am at a loss as to how
this magic is done.

Try removing the hidden input. Code that attempts to set its value will
result in an error being thrown. If and when that happens, just examine
the error stack. If Firefox swallows the error (sometimes), try Opera.

I don't know what to search for, and don't know

if at some point some function is called and the actual name of the
hidden field isn't used there or what.

Yes, CSS Selectors can make the code fragile and hard to debug (been
discussed to death here).

But don't expect that it is the case for your problem; you may be able
to find the name/id in a js file if you try and search harder.

Using your IDE, search for the hidden fields name/id in js files.

Some versions of Firebug will search ALL js files. Although I dislike
that feature being on by default, it would be handy in your case here.

1) Open Firebug,
2) Select Script tab,
3) Firebug search box, type input name/id,
4) hit enter until you find the offending line of script.

You could also search for the function that changes the hidden's value.
* Search for the onchange as "onchange" or "change".
* search for the SELECTs name or id.

[...]


I searched for the hidden

field elsewhere in the file but I did not find anything like
hidden_field_name = selected_item. Can someone please suggest a way
to figure out how this element gets updates? It does not have an
onChange() event on the form element. Thanks.

If the onchange was added using addEventListener, then it won't be found by:

console.log(select.onchange);

- but since you don't know, try it. It takes only a second and you might
get lucky.

Ken

The use of CSS Selectors' APIs can easily lead to code that makes
assertions of things that should be arbitrary and meaningless. This can
make the script hard to debug, more fragile (because seemingly bening,
arbitrary changes to the HTML can break it). It can make the HTML
brittle in unintuitive ways, for the very same reason.

Garrett