2014-11-25 2 views
1

페이지에 들어가려고하는 항목이 세 개 있습니다. 처음 두 가지는 문제가 아닙니다. 세 번째 항목은 두 번째 선택 옵션에서 선택되는 항목에 따라 다릅니다. 세 번째 옵션은 초를 기준으로 숨기거나 표시합니다. 그래서 문제 없습니다. 코드는 여기에 있습니다 : 다른 입력의 jQuery 동적 입력 값

// Create a Javascript class to handle the form. 
function InquiryCardForm() { 
    var objSelf = this; 

    // Get a jQuery reference to the form. 
    this.Form = $("#inqueryCard-form"); 

    // Get jQuery references to the key fields in our contact 
    // form. This way, we don't have to keep looking them up. 
    // This will make it faster. 
    this.DOMReferences = { 
     // Form elements 
     ID: this.Form.find("input[ name = 'id' ]"), 
     SourceCode: this.Form.find("input[ name = 'sourceCode' ]"), 
     SourceValue: this.Form.find("select[ name = 'source' ]"), 
     SourceText: this.Form.find("input[ name = 'other" 
      +this.Form.find("input[ name = 'sourceCode' ]").val() 
      +this.Form.find("select[ name = 'source' ]").val() +"' ]") 
    }; 

그래서 나는 HTML이 : 여기

<form action="" method="post" name="inqueryCard" id="inqueryCard-form"> 
... 
    <tr> 
     <td> 
      <input type="hidden" name="sourceCode" value="SRCE"> 
      <select id="source" name="source"> 
       <option value="" selected>*** Select ***</option> 
       <option value="1" data-more="N">Web Search</option> 
       <option value="2" data-more="N">Word Of Mouth</option> 
       <option value="3" data-more="O">Other</option> 
       <option value="4" data-more="R">Other</option> 
      </select> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <div id="otherDIV_SRCE1"> 
       <p> <input type="text" name="otherSRCE1" value="" /></p> 
      </div> 
      <div id="otherDIV_SRCE2"> 
       <p> <input type="text" name="otherSRCE2" value="" /></p> 
      </div> 
      <div id="otherDIV_SRCE3"> 
       <p>Please Specify <input type="text" name="otherSRCE3" value="" /></p> 
      </div> 
      <div id="otherDIV_SRCE4"> 
       <p>Must Share <input type="text" name="otherSRCE4" value="" /></p> 
      </div> 
     </td> 
    </tr> 

문제가 SourceText 객체가 객체가 아닌 것입니다. 나는 "소스"의 선택에 따라 div를 숨기거나 표시하고 있습니다.

내가이

var code = objSelf.DOMReferences.SourceCode.val(); 
var value = objSelf.DOMReferences.SourceValue.val(); 
var SourceText = objSelf.Form.find("input[ name = 'other" + code + value + "' ]"); 

같은 양식을 제출 기능에이 작업을 얻을 수있었습니다 있습니다하지만 난 this.DOMReferences에서이 작업을 수행하고 싶었다. 이 페이지에는 약 21 개의 다른 항목이 있으므로이 기능과 매우 유사합니다.

미리 감사드립니다. (처음 아무것도 게시, 그래서 내가 여기에 있어야한다 뭔가 잊어 버린 경우 알려주세요)

답변

0

당신이 기능을 업데이트하십시오 :

function InquiryCardForm() 
{ 
    var objSelf = this; 

    this.Form = $("#inqueryCard-form"); 

    var select = this.Form.find("select[ name = 'source' ]"); 

    this.DOMReferences = 
    { 
     // Form elements 
     ID: this.Form.find("input[ name = 'id' ]"), 
     SourceCode: this.Form.find("input[ name = 'sourceCode' ]"), 
     SourceValue: select , 
     SourceText: function() 
     { 
      var index = select.find(":selected").val(); 
      return this.Form.find("input[ name = 'other" + SourceCode.val() + index + "' ]"); 
     } 
    }; 
}