2013-04-12 156 views
0

我在这里要做的是在窗体中,如果没有输入字段然后警告显示,如果甚至一个字段被输入,表单被submit.and我使用javascript在这里提交表单是我形式 -jsp表单没有提交

<form method="POST" name="report" id="reportbean"> 

     <div id="maindiv"> 
      <div align="center"> 
       <p>&nbsp;</p> 
       <p id="Title">CHANDNA COLD STORAGE 
       </p> 
      </div> 
      <p>&nbsp;</p> 
      <p>&nbsp; </p> 
      <p align="center" style="font-size: 20px; text-align: left;"> OCCUPANT DETAILS:</p> 
      <table width="770" height="97" cellpadding="10" > 
       <tr> 
        <td><input type="text" name="FirstName" id="FirstName"  placeholder="FIRSTNAME" value="${firstname}" onchange="stringCheck(this);" /></td> 

        <td><input type="text" name="LastName" id="LastName" placeholder="LASTNAME" value="${lastname}" onchange="stringCheck(this);" ></td> 
        <td><input type="text" name="Village" id="Village" placeholder="VILLAGE" value="${village}" onchange="stringCheck(this);" ></td> 
       </tr> 
       <tr> 
        <td><input type="text" name="FatherName" id="FatherName" placeholder="FATHER'S NAME" value="${sonof}" onchange="stringCheck(this);" ></td> 
        <td><input type="text" name="District" id="District" placeholder="DISTRICT" value="${district}" onchange="stringCheck(this);" ></td> 
        <td>&nbsp;</td> 
       </tr> 
      </table> 
      <p>&nbsp;</p> 
      <div id="occupationlist" > 
      <display:table name="List" export="true" class="displaytag" sort="list" > 
       <display:setProperty name="basic.empty.showtable" value="true" /> 

       <display:column property="occid" title="ID" ></display:column> 
       <display:column property="firstName" title="First Name" ></display:column> 
       <display:column property="lastName" title="Last Name" ></display:column> 
       <display:column property="sonOf" title="Father's Name" ></display:column> 
       <display:column property="district" title="District" ></display:column> 
       <display:column property="village" title="Village" ></display:column> 
       <display:column title="Reservation Form"> 
        <input type="button" id="reservationid" name="show reservation" onClick="javascript:toggle1();" value="show reservation det"> 
       </display:column> 
       <display:column title="Agreement Form"> 

        <input type="button" id="agreementid" name="show agreement" onClick="javascript:toggle2();" value="show agreement det"> 
       </display:column> 
      </display:table> 
      </div> 
      <br> 
      <br> 
      <div id="reservationlist" style="display: none"> 
       <display:table name="List1" export="true" class="displaytag" sort="list" > 
       <display:setProperty name="basic.empty.showtable" value="true" /> 

       <display:column property="resid" title="Reservation ID" ></display:column> 
       <display:column property="date" title="Date" ></display:column> 
       <display:column property="weight" title="Weight" ></display:column> 
       <display:column property="bags" title="Bags" ></display:column> 
       <display:column property="amount" title="Amount" ></display:column> 
       <display:column property="advance" title="Advance" ></display:column> 

      </display:table> 
      </div> 
      <br> 
      <br> 

      <div id="agreementlist" style="display: none" > 
       <display:table name="List2" export="true" class="displaytag" sort="list" > 
       <display:setProperty name="basic.empty.showtable" value="true" /> 

       <display:column property="agreeNo" title="Agreement ID" ></display:column> 
       <display:column property="date" title="Date" ></display:column> 
       <display:column property="weight" title="Weight" ></display:column> 
       <display:column property="rate" title="Rate" ></display:column> 
       <display:column property="bags" title="Bags" ></display:column> 
       <display:column property="amount" title="Amount" ></display:column> 
       <display:column property="advance" title="Advance" ></display:column> 
       <display:column property="lotNo" title="Lot No" ></display:column> 


      </display:table>    
      </div> 
      <p align="CENTER"> 
       <input type="button" name="BACK" id="BACK" value="BACK" width="10px" height="10px" onClick="javascript:goBack()">&nbsp;&nbsp; 
       <input type="button" name="SUBMIT" id="submit" value="SEARCH" onclick="checkemptyreport();" > 
      </p> 

    </div> 
    <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 
      <p>&nbsp;</p> 

    </form> 

,这里是我的javascript功能 -

function checkemptyreport() 
{ 
var firstname = document.getElementById("FirstName").value; 
var lastname = document.getElementById("LastName").value; 
var fathername = document.getElementById("FatherName").value; 
var village = document.getElementById("Village").value; 
var district = document.getElementById("District").value; 
if((firstname=="") && (lastname == "") && (village == "") && (fathername == "") &&  (district == "") ) 
{ 

    alert("Enter Atleast One field"); 
    document.getElementById("FirstName").focus(); 
    return false; 
} 
else 
{ 
    alert(2); 

    //document.forms["report"].submit(); 
    document.form["report"].action = "/reportbeanservlet"; 
    //document.location = "reportbeanservlet"; 
    return true; 
    } 
} 

回答

3

更改搜索按钮的类型为“提交”(类型按钮不提交表单) ,它会提交表格。或者你可以这样做:

document.form["report"].submit(); 

里面的checkemptyreport()函数。

+0

如果我改变搜索按钮提交它检查验证点击按钮后,然后自动提交表单。我想如果没有输入字段。它不应该是形式。 – Divyang

+0

是不是你想要完成的,即验证输入,然后提交? – tomor

+2

@Divyang,如果你的表单无效,你只需在显示你的消息后返回false。这将阻止表单被发布。 –

1

请看下面的例子:

的Javascript

window.onsubmit = function() 
{ 
    var firstname = document.getElementById("FirstName").value; 
    var lastname = document.getElementById("LastName").value; 
    var district = document.getElementById("District").value; 

    if(firstname == "" && lastname=="" && district=="") 
    { 
     alert("Fill in at least one"); 
     return false; 
    } 
    else 
    { 
     alert(2); 
     //document.forms["report"].submit(); 
     document.form["report"].action = "/reportbeanservlet"; 
     //document.location = "reportbeanservlet"; 
     return true; 
    } 
} 

标记

<form method="POST" name="report" id="reportbean"> 
    <input type="text" name="FirstName" id="FirstName" /> 
    <input type="text" name="LastName" id="LastName" /> 
    <input type="text" name="District" id="District" /> 
    <input type="submit" value="Submit" /> 
</form> 

当然,这是你的代码的缩小版,但作为@tomor拥有,您可以通过提交按钮来完成,并捕获表单的onsubmit事件。

的jsfiddlehttp://jsfiddle.net/hescano/xZEbH/

+1

谢谢你哥们..终于明白了。我很感激。 – Divyang