2016-11-23 80 views
0

所以我有這些單選按鈕,用戶可以選擇,然後我需要在它的文本輸入。我如何驗證這些輸入以便他們需要選擇一個無線電選項,如果它是前兩個之一,確保他們填寫文本輸入?我假設我需要使用jquery.validator.addMethod,但是我真的失去了我需要做的事情。我真的很感謝一些幫助。非常感謝!如何驗證其中有輸入字段的單選按鈕?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/additional-methods.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 

 
<div id="itemPricing" class="clearfix"> 
 
    <div class="row"> 
 
    <div class="col-sm-12" form-group> 
 
     <label for="itemPricing" class="required">Pricing</label> 
 
     <span id="helpBlock" class="help-block">Select how you want pricing to display on your website.</span> 
 
    </div> 
 
    <!-- Regular Price --> 
 
    <div class="col-sm-12 form-group"> 
 
     <div class="form-inline radio-input-group"> 
 
     <div class="radio"> 
 
      <input type="radio" class="height-initial" name="pricingOptions" id="regularPrice" value=""> 
 
      <label for="regularPrice" class="required">Regular Price</label> 
 
     </div> 
 
     <div class="input-group"> 
 
      <span class="input-group-addon">$</span> 
 
      <input type="text" class="form-control money" id="productPrice" name="productPrice"> 
 
     </div> 
 
     </div> 
 
     <div class="form-inline radio-input-group"> 
 
     <div class="radio"> 
 
      <input type="radio" class="height-initial" name="pricingOptions" id="salePrice" value=""> 
 
      <label for="salePrice" class="required">Sale Price</label> 
 
     </div> 
 
     <div class="input-group"> 
 
      <span class="input-group-addon">$</span> 
 
      <input type="text" class="form-control money" id="productPrice" name="productPrice"> 
 
     </div> 
 
     </div> 
 
     <div class="form-inline radio-input-group"> 
 
     <div class="radio"> 
 
      <input type="radio" class="height-initial" name="pricingOptions" id="emailPrice" value=""> 
 
      <label for="emailPrice" class="required">Email for Price</label> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
<!-- end itemPricing --> 
 
    
 
    <button type="submit" class="btn btn-success save ladda-button" data-style="zoom-in">Save</button>

+0

**客戶端**驗證(js/html ...)將永遠不夠好,它很容易繞過簡單的檢查元素擺弄。如果你真的想驗證你的客戶端的輸入,你需要在**服務器端**(php/node/ruby​​ ...) – Mihailo

+0

@Mihailo我將這個交給了一個開發人員,他將在asp.net,所以我會提出這個問題。謝謝。 –

回答

1

是,跳過服務器端驗證是不是一種選擇,但你得到一個更好的用戶體驗,如果你也對客戶端進行驗證了。在用戶意識到問題之前等待往服務器的往返是確保用戶關閉的一種方法。單選按鈕可以有onChange處理程序,用於檢查是否選擇該按鈕並相應地設置文本框的所需狀態。

相關問題