Javascript HTML form onChange not working

**emzi** · 08-11-2014, 08:36 AM

Hi All

Hopefully this is really simple but currently its not working. I am trying to get a popup box to appear if No Longer Required is selected as an OnChange event. If I take the If statement out the alert will work but I really need the condition in there.

HTML Code:

function extracheck(form) {

  if (form.Reason1.value == "No Longer Required"){
   alert("message here"); 
   }
   }


  <form id="form2" name="form2" method="post" action="returnprocess.asp" onSubmit="return validateForm(this)">

 <select name="Reason1" class="textfieldmedium" id="Reason1" onchange="extracheck(this.form)">
                            <option selected="selected">Reason for Return</option>
                           <option>No Longer Required</option>
                            <option>Duplicated Order</option>
                            <option>Choice of Two</option>
                            <option>Incorrectly Supplied</option>
                            <option>Incorrect for Application</option>
                            <option>Incorrectly Packaged</option>
                            <option>Late Delivery</option>
                            <option>Incorrectly Picked</option>
                            <option>Never Ordered</option>
                            <option>Surcharge Unit</option>
                            <option>Damaged</option>
                            <option>Poor Fitment</option>
                            <option>Failed Emissions</option>
                            <option>Blowing Welds</option>
                            <option>Noise</option>
                            <option>Faulty</option>
                            <option>Cushion Fault</option>
                          </select>

**vwphillips** · 08-11-2014, 09:26 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<script type="text/javascript">
/*<![CDATA[*/
function extracheck(s) {

if (s.value == "No Longer Required"){
alert("message here");
}
}

/*]]>*/
</script>

</head>

<body>
<form id="form2" name="form2" method="post" action="returnprocess.asp" onSubmit="return validateForm(this)">

<select name="Reason1" class="textfieldmedium" id="Reason1" onchange="extracheck(this)">
<option selected="selected">Reason for Return</option>
<option value="No Longer Required" >No Longer Required</option>
<option>Duplicated Order</option>
<option>Choice of Two</option>
<option>Incorrectly Supplied</option>
<option>Incorrect for Application</option>
<option>Incorrectly Packaged</option>
<option>Late Delivery</option>
<option>Incorrectly Picked</option>
<option>Never Ordered</option>
<option>Surcharge Unit</option>
<option>Damaged</option>
<option>Poor Fitment</option>
<option>Failed Emissions</option>
<option>Blowing Welds</option>
<option>Noise</option>
<option>Faulty</option>
<option>Cushion Fault</option>
</select>
</form>
</body>

</html>

or

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<script type="text/javascript">
/*<![CDATA[*/
function extracheck(s) {
if (s.options[s.selectedIndex].text == "No Longer Required"){
 alert("message here");
}
}

/*]]>*/
</script>

</head>

<body>
<form id="form2" name="form2" method="post" action="returnprocess.asp" onSubmit="return validateForm(this)">

<select name="Reason1" class="textfieldmedium" id="Reason1" onchange="extracheck(this)">
<option selected="selected">Reason for Return</option>
<option >No Longer Required</option>
<option>Duplicated Order</option>
<option>Choice of Two</option>
<option>Incorrectly Supplied</option>
<option>Incorrect for Application</option>
<option>Incorrectly Packaged</option>
<option>Late Delivery</option>
<option>Incorrectly Picked</option>
<option>Never Ordered</option>
<option>Surcharge Unit</option>
<option>Damaged</option>
<option>Poor Fitment</option>
<option>Failed Emissions</option>
<option>Blowing Welds</option>
<option>Noise</option>
<option>Faulty</option>
<option>Cushion Fault</option>
</select>
</form>
</body>

</html>

**emzi** · 08-11-2014, 09:58 AM

Tried both and still not working. I get the alert if i remove the IF but just will not work with the IF.

<script type="text/javascript">
/*<![CDATA[*/
function extracheck(s) {
alert("message here");
}

/*]]>*/
</script>

Thread: Javascript HTML form onChange not working

Thread Tools

Search Thread

Javascript HTML form onChange not working

Similar Threads

Resolved Javascript validation onchange event

Problem with javascript and html form

help validating html form with javascript

Onchange is not working in Safari

Form Select Menu onChange Event for Dates

Bookmarks

Bookmarks

Posting Permissions