Question

我有一张表格，可以生成报告。我需要为这一个报告编写javascript验证。不幸的是，我的javascript非常弱。我有服务器端验证，但我还需要进行javascript验证。我的页面如下......

<tr>
<form name="MedicaidResidents" action="Medicaid_Residents.cfm"  method="post" id='f1' onSubmit="ValidateForm(this.form);">
<td nowrap="nowrap">
Medicaid Residents
</td>
<td style="width: 5%;">
     <table style="width: 5%;">
    <tr>
        <td style="width: 5%;"><br><br>
        <input type="radio" name="choice" value='1' onClick="check_radio()";>All<br><br> 
        <input type="radio" name="choice" value='2' onClick="check_radio()";>States<br><br>
        <input type="radio" name="choice" value='3' onClick="check_radio()";>Communities
        </td>
        <td style="width: 5%;">
<select name="stateprompt1" multiple="multiple" size="10" id="T1">
    <cfloop query="Medicaid_States">
        <option value="#Medicaid_States.State_Code#">#Medicaid_States.State_Code#</option>
    </cfloop>
</select>
    </td>
      <td style="width: 10%;">
    <select name="houseprompt1" multiple="multiple" size="10" id="T2">
    <cfloop query="Medicaid_Houses">
        <option value="#Medicaid_Houses.iHouse_ID#">#Medicaid_Houses.Community# </option>
    </cfloop>
</select>
    </td>
    </tr>
    </table>
   </td>
<td>
<table style="width: 5%;">
    <tr>
        <td>
    From 
        </td>
    </tr>
    <tr>
        <td>

    <input type="text" id="txtFromDate" name="dateprompt1"> 
        </td>
    </tr>
    <tr>
            <td>&nbsp;
        </td>
    </tr>
    <tr>
        <td>
        To
        </td>
    </tr>
    <tr>
        <td>
        <input type="text" id="txtToDate" name="dateprompt2">
        </td>
    </tr>
</table>
</td>
<td>
<input type="Submit" name="Go" value="GO" style="font-size: 12; color: navy; height: 20px; width: 60px;">
</td>
</form>
</tr>

我写的javascript是......

<script LANGUAGE="JavaScript">
function ValidateForm(form){

if ( ( form.choice[0].checked == false ) && ( form.choice[1].checked == false ) && ( form.choice[2].checked == false ) ) 
{
alert ( "Please first select a radiobutton" ); 
return false;
}
elseif ( ( form.choice[1].checked == True ) && ( document.getElementById("T1").value=="")) 
{
alert ( "Please select a State" ); 
return false;
}
elseif ( ( form.choice[2].checked == True ) && ( document.getElementById("T2").value=="")) 
{
alert ( "Please select a House" ); 
return false;
}
elseif ( ( document.dateprompt1.value =="") && ( document.dateprompt2.value=="")) 
{
alert ( "please select 'From' and 'To' dates" ); 
return false;
}
}
</script>

......但它不起作用。我知道javascript写得不好。我很感激任何帮助它的工作！

Answer 1

而不是让一系列else语句只有if语句，因为它们会使用return false来停止它，并且绿色/传递的路径/操作位于底部。

＆＃13;

function ValidateForm(){

  var a = document.forms["MedicaidResidents"]["choice"].value;
  var b = document.forms["MedicaidResidents"]["stateprompt1"].value;
  var c = document.forms["MedicaidResidents"]["houseprompt1"].value;  
  
  var d = document.forms["MedicaidResidents"]["dateprompt1"].value;  
  var e = document.forms["MedicaidResidents"]["dateprompt2"].value;  
  
  if (a == null || a == "") {    
    alert("Please first select a radiobutton");
    return false;
  }  
    
  if (b == null || b == "") {    
    alert("Please select a State");
    return false;
  }   
  
  if (c == null || c == "") {    
    alert("Please select a House");
    return false;
  }  
  
  if (d == null || d == "" && e == null || e == "") {    
    alert("please select 'From' and 'To' dates");
    return false;
  }   
  
  return true;

}

＆＃13;

<tr>
<form name="MedicaidResidents" action="Medicaid_Residents.cfm"  method="post" id='f1' onSubmit="return ValidateForm();">
<td nowrap="nowrap">
Medicaid Residents
</td>
<td style="width: 5%;">
     <table style="width: 5%;">
    <tr>
        <td style="width: 5%;"><br><br>
        <input type="radio" name="choice" value='1' onClick="check_radio()">All<br><br> 
        <input type="radio" name="choice" value='2' onClick="check_radio()">States<br><br>
        <input type="radio" name="choice" value='3' onClick="check_radio()">Communities
        </td>
        <td style="width: 5%;">
<select name="stateprompt1" multiple="multiple" size="10" id="T1">
    <cfloop query="Medicaid_States">
        <option value="#Medicaid_States.State_Code#">#Medicaid_States.State_Code#</option>
    </cfloop>
</select>
    </td>
      <td style="width: 10%;">
    <select name="houseprompt1" multiple="multiple" size="10" id="T2">
    <cfloop query="Medicaid_Houses">
        <option value="#Medicaid_Houses.iHouse_ID#">#Medicaid_Houses.Community# </option>
    </cfloop>
</select>
    </td>
    </tr>
    </table>
   </td>
<td>
<table style="width: 5%;">
    <tr>
        <td>
    From 
        </td>
    </tr>
    <tr>
        <td>

    <input type="text" id="txtFromDate" name="dateprompt1"> 
        </td>
    </tr>
    <tr>
            <td>&nbsp;
        </td>
    </tr>
    <tr>
        <td>
        To
        </td>
    </tr>
    <tr>
        <td>
        <input type="text" id="txtToDate" name="dateprompt2">
        </td>
    </tr>
</table>
</td>
<td>
<input type="Submit" name="Go" value="GO" style="font-size: 12; color: navy; height: 20px; width: 60px;">
</td>
</form>
</tr>

＆＃13;

https://jsbin.com/kawewerisu/1/edit?html,js,output

我的报告页

1 个答案: