Funny problem with variable assignment

[tonyeveland]

1. In my HTML, I have these two forms:

<form name="form1" method="post" action="">Code
<input name="SurveyStyleDisplay" value='none selected' type="text" size="15" maxlength="30">
</form>

<form name="form2" method="post" action="">Get Code
<input type="submit" name="Submit" value="Submit" onClick=GetStyle()>
</form>



2. And I have this function

function GetStyle()
{
form1.SurveyStyleDisplay.value = 'H1ABCDEFGH'
alert(form1.SurveyStyleDisplay.value)
}


3. When "FORM2" button is clicked, the .VALUE changes to 'H1ABCDEFGH' as the ALERT shows,
and as I can see on the screen, but then when I click OK on the ALERT, the .value
goes back to what is was.


WHY?

[RadarBob]

Seems to me things are happening in this order:[list=1]
Click on the button to trigger the SUBMIT sequence
The function is executed, setting the value
the alert box displays the new value
The function completes execution, and the SUBMIT process continues...
ACTION="xxxx" tells the browser where to go, in a nice way I mean. i.e. what URL you want now.
ACTION="" tells the browser to load this same page
The page "redraws", naturally re-setting all the values to those in the "hard-coded" HTML
[/list=1]

[tonyeveland]

Is there any way?

[mordred]

If you don't want to use the functionality of a submit button, then don't use one. Change the type from type="submit" to type="button". That way you have a plain form button that should not submit your form.