Jquery forms [JavaScript]

Prev: Crockford is going to speak again today
Next: Want / Need Genuine Google Adsense Account for Rs.300/-

From: monkeys paw on 31 Mar 2010 14:33

I'm struggling to change the value of a hidden
field based on an "click" event. Here's what i
got, you guys know how to do this correctly?

The toggle function should swap images, which
it does correctly. However, there is a hidden
field named print_summary. I want the "value"
of the hidden field to toggle as the images
do, between on and off. I've tried a few things,
here is the latest. If you know how to do
this i'm all ears fellas...

..
<html>
<head>
<title>State Net | Budget Item Schedule</title>
<SCRIPT LANGUAGE='JavaScript1.2' type='text/javascript'
SRC='/js/jquery-1.3.2.min.js'></SCRIPT>
<script type="text/javascript">
$(document).ready(function(){
$("#summ_on").hide(0);
$("#summ_button").toggle(function(){
$("#summ_on").show('slow');
$("#summ_off").hide('slow');
$("#summ_value").value = "ON"
$("input").filter("summ_value").value = "ON"
alert($("input").filter("summ_value").text)
}, function() {
$("#summ_on").hide('slow');
$("#summ_off").show('slow');
$("input").filter("summ_value").value = "OFF"
alert($("input").filter("summ_value").text)
});
});
</script>
</head>

<body bgcolor="white" align="left">

<form>
<table width="90%" border="1">

<tr>
<td align="left" width=30><img src="/graphics/six.gif" alt="1"
border=0/></td>
<td>

<table width="100%" border="1">
<tr>
<td>
<div>Print CLIENT SUMMARY</div>
<div id="summ_button" width="200" height="200">
<img id="summ_on" src="/graphics/iphone-alarm-on.png"/>
<img id="summ_off" src="/graphics/iphone-alarm-off.png"/>
<input id="summ_value" type="hidden" name="print_summary"
value="OFF">
</div>
</td>
</tr>
</table> 
</td>
</tr>

<tr>
<td colspan="2">
<INPUT type=submit value="Run Report"> <INPUT type=reset
value="Clear Form"></center>
</td>
</tr>
</table>

</form>

</body>
</html>

From: johnwlockwood on 31 Mar 2010 15:09

On Mar 31, 1:33 pm, monkeys paw <mon...(a)joemoney.net> wrote:
> <script type="text/javascript">
> $(document).ready(function(){
> $("#summ_on").hide(0);
> $("#summ_button").toggle(function(){
> $("#summ_on").show('slow');
> $("#summ_off").hide('slow');
> $("#summ_value").value = "ON"
> $("input").filter("summ_value").value = "ON"

$("input #summ_value").val("ON");

> alert($("input").filter("summ_value").text)

alert($("input #summ_value").val());

> }, function() {
> $("#summ_on").hide('slow');
> $("#summ_off").show('slow');
> $("input").filter("summ_value").value = "OFF"

$("input #summ_value").val("OFF");

> alert($("input").filter("summ_value").text)

alert($("input #summ_value").val());

> });
> });
> </script>
> </head>

From: johnwlockwood on 31 Mar 2010 15:14

and be sure to remove the lines in your script that try to set and get
the summ_value. Also notice the missing semi-colons at the end of some
those lines.

-John

From: S.T. on 31 Mar 2010 15:23

On 3/31/2010 11:33 AM, monkeys paw wrote:
> I'm struggling to change the value of a hidden
> field based on an "click" event. Here's what i
> got, you guys know how to do this correctly?
>
> The toggle function should swap images, which
> it does correctly. However, there is a hidden
> field named print_summary. I want the "value"
> of the hidden field to toggle as the images
> do, between on and off. I've tried a few things,
> here is the latest. If you know how to do
> this i'm all ears fellas...

Take a look at jQuery val() method for changing/reading form controls.
http://api.jquery.com/val/ Also, be ready for one or two crazed people
to rant endlessly about jQuery's val() method.

See: http://jsfiddle.net/HrGRe/ for a possible solution

(Combined the hide/shows to a toggle(), dropped the alerts() in favor of
placing value as the contents of a new div and used two random images
instead of your local images for demo purposes.)

From: David Mark on 31 Mar 2010 16:57

S.T. wrote:
> On 3/31/2010 11:33 AM, monkeys paw wrote:
>> I'm struggling to change the value of a hidden
>> field based on an "click" event. Here's what i
>> got, you guys know how to do this correctly?
>>
>> The toggle function should swap images, which
>> it does correctly. However, there is a hidden
>> field named print_summary. I want the "value"
>> of the hidden field to toggle as the images
>> do, between on and off. I've tried a few things,
>> here is the latest. If you know how to do
>> this i'm all ears fellas...
>
> Take a look at jQuery val() method for changing/reading form controls.
> http://api.jquery.com/val/ Also, be ready for one or two crazed people
> to rant endlessly about jQuery's val() method.

I don't think it takes an endless "rant" to get across what Richard has
already said: it is *insane* to just jQuery to read and write form
control values. If you can't understand why, you should stop giving out
advice on such.

[snip possible solution]

And examples. :)

| Next | Last
Pages: 1 2 3
Prev: Crockford is going to speak again today
Next: Want / Need Genuine Google Adsense Account for Rs.300/-