Hello , I am new to javascript, and now I found a Strange problem here in my code, I sat in front of computer for many hours trying to solve it , but I still don't know what caused the problem and how to solve it , could anyone here give me some idea?
<html>
<head>
<script language="javascript">
i=1;
function gotoChange(){
if(i==1){
document.getElementById("shopName").disabled=false;
document.getElementById("address").disabled=false;
document.getElementById("website").disabled=false;
document.getElementById("email").disabled=false;
document.getElementById("description").disabled=false;
document.getElementById("contactNo").disabled=false;
document.getElementById("contactPerson").disabled=false;
document.getElementById("change").value="confirm";
i++;
}
else if(i==2){
temp=document.getElementById("userinfo");
temp.action="EditServlet";
temp.submit();
}
}
function gotoupdate(){
if(c_num == 0){
alert("you should choose at least one");
return false;
}
else{
document.bookmarks.action="update.jsp";
document.bookmarks.submit();
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Shop Information</title>
</head>
<body>
<center>
<h3>Welcome <font color="red" size="15"> ${shop.shopName}</font> </h3>
<br>
<form id="userinfo" method="post">
<table border="0">
<thead>
<tr>
<caption> Your Shop Information is: </caption>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td> Shop ID : </td>
<td> ${shop.shopId}</td>
</tr>
<tr>
<td> Shop Name : </td>
<td> <input type="text" disabled="true" id="shopName" value="${shop.shopName}"></td>
</tr>
<tr>
<td>Address :</td>
<td> <input type="text" disabled="true" id="address" value="${shop.address}"></td>
</tr>
<tr>
<td>Website:</td>
<td><input type="text" disabled="true" id="website" value="${shop.website}"></td>
</tr>
<tr>
<td>Email :</td>
<td> <input type="text" disabled="true" id="email" value="${shop.email}"></td>
</tr>
<tr>
<td>Description :</td>
<td> <input type="text" disabled="true" id="description" value="${shop.description}"></td>
</tr>
<tr>
<td>Telephone NO. :</td>
<td> <input type="text" disabled="true" id="contactNo" value="${shop.contactNo}"></td>
</tr>
<tr>
<td>Contact Person :</td>
<td><input type="text" disabled="true" id="contactPerson" value="${shop.contactPerson}"></td>
</tr>
<tr>
<td><input type="button" id="change" value="Change" onClick="gotoChange()"></td>
<!-- <td><input type="button" value="view the products" onClick="gotoView()"></td>-->
</tr>
</tbody>
</table>
<br/>Your Pictures :
${shop.picture}
<br>
</form>
</center>
</body>
</html>
My problem is : when I click the confirm button, the form are going to submit to EditServlet,
but all the values I entered in the form "userinfo" are null in EditServlet side,
in EditServlet, I do such things:
String shopName=request.getParameter("shopName");
this shopName is null, if I modified the javascript as:
temp=document.getElementById("userinfo"); temp.action="EditServlet?shopName="+document.getElementById("shopName").value;
temp.submit();
then the shopName value in EditServlet could be the value I entered in the userinfo form.
So what caused the problem like that , is there any way to solve it?
Looking forward to your replies, thank you !
Best Regards