2013-03-09 3 views
0

У меня есть форма, в которой у меня есть 2 разных набора форм, которые используются в зависимости от значения окна выбора. Проблема, с которой я сталкиваюсь, заключается в том, что когда я пытаюсь отключить ненужные поля ввода, я отключил атрибут: disabled = "" вместо disabled = "disabled" вот код, который я использую. Это довольно сложная форма, поэтому я буду использовать соответствующие поля, чтобы я мог попытаться максимально упростить ее. Если вы думаете, что чего-то не хватает ... пожалуйста, дайте мне знать, если вам нужно увидеть больше.Использование uniForm и попытка отключения ввода

<cfform id="entry-form" ACTION="index-10.cfm?Company" name="send" class="uniForm"> 
     <div class="ctrlHolder"><label for="" style="display:none"><em>*</em>Builder or Individual</label>       
         <cfselect name="select1" id="select1">     
          <option value="" <cfif Individual is "">selected="selected"</cfif>>Who is this Case for? (choose one)</option>     
          <option value="0"<cfif Individual is 1>selected="selected"</cfif>>An Individual Home Owner</option>     
          <option value="1"<cfif Individual is not 1 and Individual is not "">selected="selected"</cfif>>A Builder</option>    
         </cfselect> 
        <p class="formHint">A selection is required</p>   
    </div> 

    <!--- this is for individual home owner. --->   
       <div class="hide" id="hide1"> 

        <div class="ctrlHolder"><label for="" style="display:none"><em>*</em>First name</label> 
        <cfinput type="text"    
           name="FirstName" 
           id="FirstName" 
           data-default-value="Enter your first name" 
           size="35" 
           class="textInput required validateAlpha" 
           maxlength="50" 
           value="#FirstName#"> 
        <p class="formHint">First Name is required</p> 
        </div> 
       </div> 

       <div class="hide" id="hide2"> 

       <div class="ctrlHolder"><label for="" style="display:none"><em>*</em>Builder Name</label> 
        <cfinput type="text" id="builder" 
           name="BuilderName" 
           data-default-value="Type a builder's name" 
           size="35" 
           class="textInput required" 
           value="" /> 
         <p class="formHint">Builder's name is required</p> 
         <cfinput id="builder_hidden" name="BuilderID" type="hidden" value="" /> 
         <cfinput id="builder_hidden_plan" name="PlanID" type="hidden" value="" /> 
        </div> 
       </div> 
</cfform> 

    <script> 

    $(document).ready(function(){  
     $("#select1").change(function(){   
      if ($(this).val() == "1") {    
       $("#hide2").slideDown("fast"); //Slide Down Effect    
       $("#hide1").slideUp("fast"); 
       $("#FirstName").prop("disabled", true); 
         $("#builder").prop("disabled", false); 
    } else if ($(this).val() == "0"){    
       $("#hide1").slideDown("fast"); //Slide Down Effect    
       $("#hide2").slideUp("fast"); 
         $("#FirstName").prop("disabled", false); 
         $("#builder").prop("disabled", true);  
      } 
     }); 
</script> 

Я использую:

  • JQuery-1.9.1.js
  • JQuery-UI-1.10.1.custom.js
  • уни-форм-validation.jquery.js

ответ

1

Я нашел проблему. Добавлено свойство отключено. Это был необходимый класс, который не позволял этому работать. Я добавил методы removeClass и addClass, чтобы исправить это.

0

Пожалуйста, измените Jquery 'опору' в 'ATTR' & проверить ниже сценарий, когда он работает отлично .....

<script type="text/javascript"> 
$(document).ready(function(){  
    $("#select1").change(function(){   
     if ($(this).val() == "1"){    
      $("#hide2").slideDown("fast"); //Slide Down Effect    
      $("#hide1").slideUp("fast"); 
      $("#firstname").attr("disabled", "disabled"); 
      $("#builder").attr("disabled", false); 
     } 
     else if ($(this).val() == "0"){    
      $("#hide1").slideDown("fast"); //Slide Down Effect    
      $("#hide2").slideUp("fast"); 
      $("#firstname").attr("disabled", false); 
      $("#builder").attr("disabled", "disabled");  
     } 
    }); 
});