如何根據單選按鈕選擇重定向表格

Question

我有一張註冊表格，用於檢查他/她是否是我們的客戶。如果用戶選擇是，則會顯示兩個字段（客戶號碼和郵政編碼）。但是，如果用戶選擇否，我希望表單只發送並轉到下一頁。

由於它現在正常工作，所以當用戶選擇否時，由於客戶編號+和郵編空白，因此嘗試提交表單時出現錯誤。

在單選按鈕選擇上重定向表單的最佳方法是什麼？或者，如果用戶選擇否，可以預先填寫客戶編號+ zipcdoe字段？有沒有可行的方法來重定向？

我的單選按鈕代碼：

Yes <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck"> No <input type="radio" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck" onChange="OnChangeForm" value="epc"> 

的jsfiddle：https://jsfiddle.net/7ycha0ge/

Answer 1

特殊照顧不是非常具體與您的情況，但我相信的那裏有3個posibilities：

1. 是你正在驗證填充的字段在JavaScript和沒有考慮到你的輸入是隱藏的，在這種情況下，你應該重新訪問你的代碼，並且如果這個字段是可見的，那麼只會拋出錯誤，或者根據收音機的選擇從HTML中完整地添加/刪除字段。

2. 你的服務器端代碼總是期望的參數填充你的空缺數據，它會引發錯誤。

3. 考慮使用這樣的形式（與novalidate屬性）：

<形式的novalidate> </FORM>

這樣你會不會緊張到瀏覽器的驗證，但你必須親自驗證

編輯：附加實例添加和刪除元素

function yesnoCheck(resp) { 
 

 
var yes = '<div class="form-group">'+ 
 
     '<label for="account" class="col-sm-3 control-label">Account Number</label>'+ 
 
     '<div class="col-sm-9">'+ 
 
      '<input type="text" class="form-control" id="account" name="account" placeholder="Enter Account Number">'+ 
 
     '</div>'+ 
 
    '</div>'+ 
 
    
 
    '<div class="form-group">'+ 
 
     '<label for="lastname" class="col-sm-3 control-label">Zip Code</label>'+ 
 
     '<div class="col-sm-9">'+ 
 
      '<input type="text" class="form-control" id="zip" name="zip" placeholder="Enter Zip Code">'+ 
 
     '</div>'+ 
 
    '</div>'; 
 
    
 
    if(resp == 'yes') { 
 
     $('#ifYes').append(yes); 
 
    } else { 
 
     $('#ifYes').html(''); 
 
    } 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="section section-breadcrumbs"> 
 
\t \t \t <div class="container"> 
 
\t \t \t \t <div class="row"> 
 
\t \t \t \t \t <div class="col-md-12"> 
 
\t \t \t \t \t \t <h1>Register</h1> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t </div> 
 
     
 
<div class="section"> 
 
    <div class="container"> 
 
     <div class="row"> 
 
\t \t \t \t \t <div class="col-sm-8 col-sm-offset-2"> 
 
       <div class="panel panel-default"> 
 
       <div class="panel-body"> 
 
        <h2>Online Training Access</h2> 
 
        <p><em>We need to verify if you are a retailer first. Please enter your account number without spaces or dashes, or select 'no' if you are a consumer.</em></p><br> 
 
        
 
        
 
<form class="form-horizontal" role="form" id="my-account-form" method="post" action=""> 
 
    <div class="col-sm-offset-3"></div> 
 

 
<div class="form-group"> 
 
    <label for="lastname" class="col-sm-3 control-label">Are you a retailer?</label> 
 
     <div class="col-sm-9"> 
 
     Yes <input type="radio" onclick="javascript:yesnoCheck('yes');" name="yesno" id="yesCheck"> 
 
     No <input type="radio" onclick="javascript:yesnoCheck('no');" name="yesno" id="noCheck"> 
 
     </div> 
 
</div> 
 

 
<!-- the contents will only be added if yes --> 
 
<div id="ifYes"> 
 
</div> 
 

 
</form> 
 
</div> 
 
</div> 
 
</div> 
 
</div> 
 
</div>