By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,932 Members | 1,511 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,932 IT Pros & Developers. It's quick & easy.

Submit onchange doesn't work

P: 8
I really can't see what's wrong in my code... the submit() onChange doesn't work..

I've tried..

Expand|Select|Wrap|Line Numbers
  1. <select name="ddlTestCenter" id="ddlTestCenter" style="width:180px" onChange="this.form.submit();">
it doesn't work...

Expand|Select|Wrap|Line Numbers
  1. <input type="hidden" name="hiddenopt" value="secret"> <select name="list" onChange="document.forms['try'].submit();">
this one work on my test page.. but it didn't work when i embed it on my project..

here is the complete code of my webApp.. I'll truly appreciate and be grateful of whatever help you'll be able to give.. thanks in advance...

<%@ page import="java.sql.*" %>
<%@ page import="java.io.*" %>
<%@ page import ="java.util.*" %>
<%@ page import="java.text.*" %>
<%@page import ="java.lang.*" %>


[HTML]<html>
<head>

<LINK href="Admin/css/format.css" type="text/css" rel="stylesheet">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>WBITE Index</title>
<table width="100%" bgcolor="#FFFFFF">
<tr> <td height="10"></td></tr>
<tr>
<td width="159" height="45" align="right">
<img src="Admin/Images/logor.gif" width="159" height="45" /></td>
<td width="100%" valign="bottom" align="left">
<img align="bottom" src="Admin/Images/header.gif" alt="header" />
</td>
</tr>
<tr>
<td colspan="2" align="center" width="100%" background="Admin/Images/lineB.gif" height="23" valign="top">
</td>
</tr>


</table>
<script language="Javascript" type="text/javascript">
function matchPassword(password,otherpassword)
{
document.getElementById("password_match_status").s tyle.display="";
if (password == otherpassword)
{
document.getElementById("password_match_status").s tyle.display="<img src="../Images/ImageButtons/approve_ovr.gif"> Passwords Match";
}

else {
document.getElementById("password_match_status").s tyle.display = "<img src="../Images/ImageButtons/disapprove_ovr.gif"> Passwords Do Not Match";
}
}


function reloadForm(){
document.regExaminee.action = "regExaminee.jsp";
document.regExaminee.submit();
}


function populate(){

ddlTestCenter = document.getElementById("regExaminee");
ddlTestCenter = "ddlExamSchedule.do";
ddlTestCenter.submit();

}

</script>
</head>

<body>

<!--header-->
<table width="100%">
<!--DWLayoutTable-->
<tr>
<td width="400" rowspan="4" align="center" valign="top">
<table width="400" cellpadding="3" cellspacing="0" bgcolor="#FEE9CB">


<input type="hidden" name="_submitted" value="1">
<input type="hidden" name="next" value="/">
<input type="hidden" name="tzoffset" value="">
<tr>
<td colspan="5" valign="top" bgcolor="#FBEFEF" align="center" width="400">
<table width="400" bgcolor="#FEE9CB" border="2">
<!--DWLayoutTable-->
<tr>
<td height="20" colspan="5" align="left" style="color:#FFFFFF; font-weight:bold; background-color:#641A00">Register Examinee </td>
</tr>
<tr>
<td align="center" valign="top" width="400" >


<form name="regExaminee" method="post" action="regExaminee.jsp" >

<!--Start of Registration Form-->
<%
String testCenter = request.getParameter("ddlTestCenter");
String driver = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://192.168.0.9:3306/WBITE?user=root";
Connection con = null;
ResultSet rs = null;
ResultSet rs2 = null;
Statement stmt = null;
con = DriverManager.getConnection(url);
stmt = con.createStatement();
%>
<table cellpadding="3" bgcolor="#FEF9E9" width="400">
<tr>
<td style="text-align:right!important;width:130px">Test Center:</td>
<td>
<input type="hidden" name="hiddenopt" value="secret">

<select name="ddlTestCenter" id="ddlTestCenter" style="width:180px" onChange="this.form.submit();">

<option value="javascript:void(0)">- Test Center -</option>
<%

try {
rs = stmt.executeQuery("CALL `WBITE`.`uspSelectTestCenter`()");
while (rs.next()) {
if(testCenter == rs.getString(1)){
%>
<option name="ddlTestCenterOption" id="ddlTestCenterOption" value="<%=rs.getString(1)%>" selected="selected"> <%=rs.getString(1)+" ("+ rs.getString(2) +")"%></option>
<%
}

else
{
%>
<option name="ddlTestCenterOption" id="ddlTestCenterOption" value="<%=rs.getString(1)%>"> <%=rs.getString(1)+" ("+ rs.getString(2) +")"%></option>
<%
}
}
} catch (Exception e) {
System.out.println(e);
}
%>
</select>
</td>
</tr>
<tr>
<td style="text-align:right!important;width:130px">Exam Schedule:</td>
<td>
<select name="ddlExamSchedule" id="ddlExamSchedule" style="width:180px"" >
<option value="">- Exam Schedule -</option>
<%
if (testCenter!=null)
{
try {
rs2 = stmt.executeQuery("SELECT * FROM WBITE.examSchedule e where TestCenterName='"+testCenter+"';");
while (rs2.next()) {
%>
<option name="ddlExamSchedule" id="ddlExamSchedule" value="<%=rs.getString(5)%>"> <%=rs.getString(2)+" ("+ rs.getString(3)+"-"+rs.getString(4)+")"%></option>
<%}
} catch (Exception e) {
System.out.println(e);
}
} %>
</select>
</td>
</tr>
<tr>
<td style="text-align:right!important;width:150px">Username:</td>
<td>
<input type="text" name="txtUserName" id="reg_username" value="" maxlength="100" style="width:180px">
</td>
</tr>
<tr>
<td style="text-align:right !important;">Password:</td>
<td>
<input type="password" name="txtPassword" id="txtPassword" value="" maxlength="17" style="width:180px"></td>
</tr>
<tr>
<td style="text-align:right !important;">Re-enter password: </td>
<td width="227" >
<input style="width:180px" type="password" name="txtPassword2" id="txtPassword2" maxlength="17" onKeyUp="match(this.value,txtPassword.value) " >
</td>
</tr>

<tr id="rowPassword" style="display:none">
<td> </td>
<td><span id="password_match_status"><img src="../Images/ImageButtons/disapprove_ovr.gif" alt="Does Not Match" width="35" height="25"> Passwords Do Not Match</span></td>
</tr>

<tr>
<td style="text-align:right !important;">First Name:</td>

<td><input style="width:180px" name="txtFirstName" maxlength="15" value="" type="text" onFocus="document.getElementById("rowPassword").st yle.display=''"></td>
</tr>
<tr>
<td style="text-align:right !important;">Last Name:</td>
<td><input type="text" name="txtContactNum" id="txtContactNum" value="" maxlength="100" style="width:180px" > </td>
</tr>
<tr>
<td style="text-align:right!important;width:130px">Contact Number:</td>
<td>
<input type="text" name="txtContactNum" id="txtContactNum" value="" maxlength="100" style="width:180px" > </td>
</tr>
<tr>
<td style="text-align:right!important;width:130px">Email Address:</td>
<td>
<input type="text" name="txtEmailAdd" id="txtEmailAdd" value="" maxlength="100" style="width:180px" > </td>
</tr>


<tr>
<td style="text-align:right !important;">Gender:</td>
<td valign="middle">
<input name="rdioGender" type="radio" value="Male" checked>Male
<input name="rdioGender" type="radio" value="Female">Female

</td>
</tr>

<tr><td height="17"></td></tr>
<tr>
<td></td>
<td colspan="2">

<input type="submit" name="submit" value="Register Examinee">

</td>
</tr>
</table> <!--END of Registration Form-->

</form>


</td>

</tr>
<!--HOLDS the LARGEST ROW contains both forms-->
</table>
</td>
</tr>
</table>

<!--DIV: Boxcontent -->

</td>

</tr>
<tr>
<td height="5"></td>
</tr>
</table>

</body>
</html>[/HTML]
Aug 25 '08 #1
Share this Question
Share on Google+
15 Replies


RamananKalirajan
100+
P: 607
[HTML]function populate(){

ddlTestCenter = document.getElementById("regExaminee");
ddlTestCenter = "ddlExamSchedule.do";
ddlTestCenter.submit();

} [/HTML]

please replace the code with

[HTML]function populate(){

ddlTestCenter = document.getElementById("regExaminee");
ddlTestCenter.action = "ddlExamSchedule.do";
ddlTestCenter.submit();

} [/HTML]

this. Hope this will work. try it and post back ur result

Regards
Ramanan Kalirajan
Aug 25 '08 #2

P: 8
thanks but it still didn't work..

Do I still need a helper of some class.. cause i kinda receive an error that there is a missing file in cgi-bin...

what could it be? am not using any tool in web app cause my pc is rather slow.. 512mb only, am using notepad++.. it would have been much easier if i'm using eclipse or netbeans cause it has some helper...

please.. anyone.. I was able to see the page.. but when i'll select an option, it won't reload the page or submit it when onChange on select option...

i hope someone will be able to help me on this...thanks..
Aug 25 '08 #3

RamananKalirajan
100+
P: 607
thanks but it still didn't work..

Do I still need a helper of some class.. cause i kinda receive an error that there is a missing file in cgi-bin...

what could it be? am not using any tool in web app cause my pc is rather slow.. 512mb only, am using notepad++.. it would have been much easier if i'm using eclipse or netbeans cause it has some helper...

please.. anyone.. I was able to see the page.. but when i'll select an option, it won't reload the page or submit it when onChange on select option...

i hope someone will be able to help me on this...thanks..
Hi for that function u have never made a call. Please explain me ur requirement dont confuse with ur codes. Just post onchange of the select the control should transfer to which page. On which component you want to make submit. please explain that clearly. I will surely help u out.

Regards
Ramanan Kalirajan
Aug 25 '08 #4

Ferris
100+
P: 101
try this:

<select name="list" onChange="document.getElementsByName['regExaminee'][0].submit();">
Aug 25 '08 #5

acoder
Expert Mod 15k+
P: 16,027
colyn7, welcome to Bytes! Please remember to follow the posting guidelines when posting in the forum. Code tags are important as are good thread titles. I've added the missing code tags and changed the thread title for you. Please use a good one in future. Thanks!
Aug 25 '08 #6

P: 8
colyn7, welcome to Bytes! Please remember to follow the posting guidelines when posting in the forum. Code tags are important as are good thread titles. I've added the missing code tags and changed the thread title for you. Please use a good one in future. Thanks!
thanks a lot.. am still a newbie here.. Thanks...
Aug 25 '08 #7

RamananKalirajan
100+
P: 607
thanks a lot.. am still a newbie here.. Thanks...
Wether u got ur code working

Regards
Ramanan Kalirajan
Aug 25 '08 #8

P: 8
hmm.. thank you very much for the suggestion..

regarding the functions.. those are the functions i've tried calling onChange at select options.. but it didn't seem to work out..

On our project, the second option is dependent on the first selection..

that's why I have to submit the first selection for the second selection to appear...

But I can't submit it so far.. the page should reload when submitted, right? It didn't..

I think something's wrong on my following codes... that has nothing to do with the onChange.. because I've tried replacing my codes with this..

Expand|Select|Wrap|Line Numbers
  1. <Form Name="try"> <input type="hidden" name="hiddenopt" value="secret"> <select name="list" onChange="document.forms['try'].submit();"> <option value="1">First option</option> <option value="2">Second option</option> <option value="3">Third option</option> </select></form>
it seems to work out.. so i think the problem is not on the function but on the codes somewhere.. all my options comes from our database.. that's why its so hard on me.. But, I also tried removing the JSP codes from it and replace the options this
Expand|Select|Wrap|Line Numbers
  1. <select name="list" onChange="document.forms['try'].submit();"> <option value="1">First option</option> <option value="2">Second option</option> <option value="3">Third option</option> </select>
even though I've replaced it (the select options only not the whole form), it didn't work out...

I mean.. When I replaced the whole form, it worked out.. but when i replaced the select options only, it didn't.. Both removing the JSP codes.. what could be the problem on my codes?
Aug 25 '08 #9

acoder
Expert Mod 15k+
P: 16,027
On our project, the second option is dependent on the first selection..

that's why I have to submit the first selection for the second selection to appear...
That's not strictly true because you could use Ajax or load all the options and call a JavaScript function to change the options onchange, but what you're trying should also work.

I notice in your first post that some of the hidden fields are outside the form. What you've posted in the last post didn't work because the form isn't named "try".
Aug 25 '08 #10

P: 8
thanks for the help.. the submit() seems to work but there seems to be an error still..

here is my code:
Expand|Select|Wrap|Line Numbers
  1.          <form name="regExaminee" method="post" action="regExaminee.jsp" >                  
  2. <!--Start of Registration Form-->         
  3. <%             String testCenter = request.getParameter("ddlTestCenter");             
  4. String driver = "com.mysql.jdbc.Driver";            
  5.  String url = "jdbc:mysql://192.168.0.9:3306/WBITE?user=root";              Connection con = null;             
  6. ResultSet rs = null;             
  7. ResultSet rs2 = null;             
  8. Statement stmt = null;             
  9. con = DriverManager.getConnection(url);             
  10. stmt = con.createStatement();                    %>          
  11. <tr>             
  12. <td style="text-align:right!important;width:130px">Test Center:</td>   
  13.        <td>             
  14. <input type="hidden" name="hiddenopt" value="secret"> 
  15. <select name="ddlTestCenter" id="ddlTestCenter" style="width:180px" onChange="this.form.submit();">
  16. <option value="">- Test Center -</option>
  17. <%                        try {                     rs = stmt.executeQuery("CALL `WBITE`.`uspSelectTestCenter`()");
  18. while (rs.next()) {                          %>             
  19. <option name="ddlTestCenterOption" id="ddlTestCenterOption" value="<%=rs.getString(1)%>" selected="selected"> <%=rs.getString(1)+" ("+ rs.getString(2) +")"%></option> 
  20.  
  21. <%                      }             
  22. } catch (Exception e) {                 
  23. System.out.println(e);             }             %> 
  24. </select>
  25. </td>
  26. </tr> 
  27. <tr>
  28. <td style="text-align:right!important;width:130px">Exam Schedule:
  29. </td>
  30. <td> 
  31. <select name="ddlExamSchedule" id="ddlExamSchedule" style="width:180px"" >
  32. <option value="">- Exam Schedule -</option>
  33.  <%         if (testCenter!=null)         {               try {                     rs2 = stmt.executeQuery("SELECT * FROM WBITE.examSchedule e where TestCenterName='"+testCenter+"';");      
  34.  while (rs2.next()) {              %>
  35. <option name="ddlExamSchedule" id="ddlExamSchedule" value="<%=rs.getString(5)%>"> <%=rs.getString(2)+" ("+ rs.getString(3)+"-"+rs.getString(4)+")"%></option> 
  36.  <%}             
  37. } catch (Exception e) { 
  38.                 System.out.println(e);             }          }   %>             </select>             
  39. </td>         
  40. </tr>     
  41. </form>
and then its output is this...



and when i select an option, it becomes like this...



the layout is destroyed.. the another row seem to be in the same cell with the form...
why? what is wrong with my code.. i'll really appreciate any help...
Aug 26 '08 #11

acoder
Expert Mod 15k+
P: 16,027
Can you post the client-side version of your code, i.e. as it appears in the browser.
Aug 26 '08 #12

P: 8
i was able to solve that problem ablready.. the problem lies on the second combo box.. what could be something wrong in it.. i think it has something to do with the conditional clause...
Aug 27 '08 #13

P: 8
i was able to retrieve the data from the 1st combo box.. thru Javascript, now my problem is how to pass that variable from Javascript to JSP...

like..
Expand|Select|Wrap|Line Numbers
  1. function getFirstData(theValue)         
  2. {             
  3.   var firstComboValue = theValue; 
  4.   alert(firstComboValue);         
  5. }
how can i pass the variable firstComboValue to JSP codes?
Aug 27 '08 #14

P: 8
i've researched on this and found out its not possible... and here's a given tip from another forum..

Call your JSP that creates or executes the JavaScript script that puts a value into the JS Variable, something like this:

"page.jsp"

Expand|Select|Wrap|Line Numbers
  1. <script> ...  
  2. var toJSPVar = doSomething(parameters);   document.location.href="pageAux.jsp?jspVAR=" + toJSPVar; ...
  3. </script> 
and then create the JSP execution code in auxiliar page
"pageAux.jsp"

Expand|Select|Wrap|Line Numbers
  1. <%  
  2. String jspVarFromJS = request.getParameter("jspVAR"); ... ... 
  3. %> 
where is that pageAux.jsp go? is it okay to call it from the same page?

and the jspVAR from
Expand|Select|Wrap|Line Numbers
  1. document.location.href="pageAux.jsp?jspVAR=" + toJSPVar;
,

what does it mean?
Aug 27 '08 #15

acoder
Expert Mod 15k+
P: 16,027
It is possible to pass a JavaScript value to the server-side. Use a form and set a hidden field and submit it, or pass it in the URL as almost shown in your last post. It should be window.location.href, not document.location.href.
Aug 27 '08 #16

Post your reply

Sign in to post your reply or Sign up for a free account.