0

有一个基于无线电隐藏/可见的字段。

因此,在加载页面时,我们根据无线电值使其可见隐藏

    $(document).ready(function() {

        if(edit) {
          populateData();
        }

        $(radio).change(function(){
            //here also we show hide text box based on radio value
        })

        function PopulateData() {
            //This does select radio and based on same show / hide text field
        }

       $("myForm").validate(); // attaching validate . At this point field could be hidden or visible


       $(savebutton).click(function(){

         /*This does not validate text 
          field (visibleBasedOnRadio) which was hidden and made visible by either of above */

          if( $("myForm").valid() == false) {
              return false;
          }
       });
    });

<form id="myForm">
<radio>
  <option 1>
  <option 2>
</radio>

<input type="text" id="visibleBasedOnRadio" class="required" style="display:none"/>
</form>
4

1 回答 1

0

我不知道您为演示逻辑使用什么框架。我会尽量做到通用。

让我们在表单中添加两个变量。

  1. radioButtonValue - 保存所选单选按钮的值。例如,选项 1 或选项 2。您可以为此字段设置默认值,以便在页面加载时默认选择该特定选项。
  2. valueOfTheVisibleField - 此字段保存输入文本框的值,一旦选择单选按钮,该文本框就可见。

    <form>
      <input type="radio" name="radioButtonValue" value="option1"> Option 1<br> //This is checked.
      <input type="radio" name="radioButtonValue" value="option2"> Option 2<br>
      <input type="text" id="visibleBasedOnRadio" class="required" name="valueOfTheVisibleField" style="display:none"/>
    </form>
    

现在在您的验证中首先检查单选按钮的值。仅当其值为 option2 时,即显示必填字段时...仅检查文本框值是否存在。如果不是,不要做任何与 valueOfTheVisibleField 字段相关的事情,因为它是隐藏的。

于 2012-11-01T18:38:22.190 回答