why does my simple javascript trigger form submit action in NN7.1?

Corvette90 · Oct 9, 2003

OK, i have a very simple javascript function that works fine in IE but triggers form.submit in NN7.1
Can anyone explain why?

Code:

<html>
<head>
<title> New Document </title>
</head>
<script language=&quot;JavaScript&quot;>
<!--
function addField(){
  for(var i=0; i < document.getElementById(&quot;fields&quot;).length; i++){
    if(document.getElementById(&quot;fields&quot;)[i].selected)
      document.getElementById(&quot;display_fields&quot;).options.add(new Option(document.getElementById(&quot;fields&quot;)[i].text, document.getElementById(&quot;fields&quot;)[i].value));
  }
}
function removeField(){
  for(var i=(document.getElementById(&quot;display_fields&quot;).length-1); i >= 0; i--){
    if(document.getElementById(&quot;display_fields&quot;)[i].selected)
      document.getElementById(&quot;display_fields&quot;).options[i] = null;
  }
}
//-->
</script>

<body>
  <form action=&quot;registrant_list.jsp&quot; id=&quot;create_report_form&quot; method=&quot;post&quot;>
    <table>
      <tr>
        <td>
          <select id=&quot;fields&quot; multiple=&quot;true&quot; size=&quot;16&quot;>
            <option value=&quot;address.address1&quot;>Address1</option>
            <option value=&quot;address.address2&quot;>Address2</option>
            <option value=&quot;address.address3&quot;>Address3</option>
            <option value=&quot;address.city&quot;>City</option>
            <option value=&quot;address.state&quot;>State</option>
            <option value=&quot;address.zip&quot;>Zip Code</option>
            <option value=&quot;address.province&quot;>Province</option>
            <option value=&quot;address.country&quot;>Country</option>
            <option value=&quot;address.phone&quot;>Phone</option>
            <option value=&quot;address.fax&quot;>Fax</option>
            <option value=&quot;session.time_part&quot;>Session Time</option>
            <option value=&quot;reg_type.display_name&quot;>Registraion Type</option>
            <option value=&quot;cust_order.paid_in_full&quot;>Paid in Full</option>
            <option value=&quot;&quot;>Extra Computer Connections</option>
            <option value=&quot;&quot;>Extra Phone Connections</option>
            <option value=&quot;&quot;>Order Date</option>
          </select>
        </td>
        <td align=&quot;center&quot;>
          <button onclick=&quot;addField()&quot;>  >>  </button>
          <br/>
          <br/>
          <br/>
          <button onclick=&quot;removeField()&quot;>  <<  </button>
        </td>
        <td>
          <select id=&quot;display_fields&quot; multiple=&quot;true&quot; size=&quot;16&quot; style=&quot;width:200px&quot;>
          </select>
        </td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td align=&quot;right&quot;><input type=&quot;submit&quot;></td>
      </tr>
    </table>
  </form>

</body>
</html>

Corvette90 · Oct 9, 2003

I found the reason, thanks.

The button element takes a type attribute with 3 possible values, submit, button and reset. The default is submit. I was not setting the type.

http://www.w3.org/TR/REC-html40/interact/forms.html#h-17.5

summitmedia · Oct 9, 2003

hi there

i no it's a daft question have you turned off the submit action for the buttons try adding this:

<html>
<head>
<title> New Document </title>
</head>
<script language="JavaScript">
<!--
function addField(){
for(var i=0; i < document.getElementById("fields&quot

.length; i++){
if(document.getElementById("fields&quot

.selected)
document.getElementById("display_fields&quot.options.add(new Option(document.getElementById("fields&quot.text, document.getElementById("fields&quot.value));
}
}
function removeField(){
for(var i=(document.getElementById("display_fields&quot.length-1); i >= 0; i--){
if(document.getElementById("display_fields&quot.selected)
document.getElementById("display_fields&quot.options = null;
}
}
//-->
</script>

<body>
<form action="registrant_list.jsp" id="create_report_form" method="post">
<table>
<tr>
<td>
<select id="fields" multiple="true" size="16">
<option value="address.address1">Address1</option>
<option value="address.address2">Address2</option>
<option value="address.address3">Address3</option>
<option value="address.city">City</option>
<option value="address.state">State</option>
<option value="address.zip">Zip Code</option>
<option value="address.province">Province</option>
<option value="address.country">Country</option>
<option value="address.phone">Phone</option>
<option value="address.fax">Fax</option>
<option value="session.time_part">Session Time</option>
<option value="reg_type.display_name">Registraion Type</option>
<option value="cust_order.paid_in_full">Paid in Full</option>
<option value="">Extra Computer Connections</option>
<option value="">Extra Phone Connections</option>
<option value="">Order Date</option>
</select>
</td>
<td align="center">
<button onclick="addField()" value="button"> >> </button>
<br/>
<br/>
<br/>
<button onclick="removeField()" value="button"> << </button>
</td>
<td>
<select id="display_fields" multiple="true" size="16" style="width:200px">
</select>
</td>
</tr>
<tr>
<td></td>
<td></td>
<td align="right"><input type="Submit" value="submit" name="submit"></td>
</tr>
</table>
</form>

</body>
</html>

you buttons as they where in the original code that you had put where submit buttons so of course they submitted the form when you clicked them. by adding the extra values to the buttons it tells the browser and the server they are dead buttons.

so try out and let me know and i'll try again.

also NN7? latest netscape i presume.

cheersdean

clarkin · Oct 9, 2003

yes, you are probably better off making those BUTTONs INPUTs:
<input type="button" onclick="addField();" value="add field">

Posting code? Wrap it with code tags: [ignore]

Code:

[/ignore][code]CodeHere

[ignore][/code][/ignore].

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

why does my simple javascript trigger form submit action in NN7.1?

Corvette90

Programmer

Corvette90

Programmer

summitmedia

Programmer

clarkin

Programmer

Similar threads

Part and Inventory Search

Sponsor