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 : &nbsp;
        ${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

I found my problem and corrected already, but still dunno why , if you have idea, can you post it here?

the codes I corrected in the form is :
in the javascript I do:
temp=document.userinfo

and I add name property which has the same value as the id property of all the elements in the form (including form , for form, I also add name property to it as "userinfo")
then all the value can be gotten in the EditServlet.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.