EditorTemplate에서 TextBox 내용 변경을 감지하는 Jookery

Question

텍스트 상자 내의 값이 변경되었는지 감지해야합니다. 텍스트 상자 내용이 변경/수정 된 경우 텍스트 상자를 표시하고 사용자가 변경 사항에 대한 설명을 입력해야합니다. 여기

내가 페이지가로드되는 위의 EditorTemplate

@if (!UtilityHelper.IsNullOrEmpty(Model.AddressesRecords)) 
     { 

      @Html.EditorFor(model => model.AddressesRecords) 

     } 

    <input type="submit" name="ButtonCommand" value="Save" /> 

에게 전화를 어디에 여기

@Html.EditorFor(model => model.Address) 
@Html.ValidationMessageFor(model => model.model.Address)) 
@Html.EditorFor(model => model.Comments,new{style="Visible:false" }) 
@Html.ValidationMessageFor(model => model.Comments ,new{style="Visible:false" }) 

가, MyPage.cshtml입니다 공유/EditorTemplates/Addresses.cshtml에있는 내 EditorTemplate 페이지입니다 여러 주소 텍스트 상자가됩니다. 사용자가 TextBox 주소 중 하나를 수정하면 즉시 해당 TextBox에 CommentTextBox가 표시되고 유효성 검사가 사용됩니다.

그래서 저장 버튼을 클릭하면 사용자가 CommentsTextBox에 몇 가지 주석을 입력했는지 확인해야합니다. 사용자가 주소 텍스트 상자를 변경하지 않고 저장 버튼을 클릭하면 레코드가 저장됩니다. 런타임 동안

, 나는 몇 가지 jQuery로 시도

의 동적 AddressesRecords_0_Address, AddressesRecords_1_Address 같이 생성 된 편집기 ID를 ...... 볼 수 있지만 보인다 결코이 실제 AddressTextBox ID가 동적으로 생성로 일하기 .

<script type="text/javascript"> 


    $(document).ready(function(){ 

     var $el = $('#AddressesRecords_0_Address'); 
     $el.data('oldVal', $el.val()); 


     $el.change(function(){ 

      $("#AddressesRecords_0_Comments").show(); 
     }) 

    }); 
</script> 

여기 내 addressTextBox 각각에 대해 내 Jquery 변경 기능을 연결하려면 어떻게해야합니까?

Answer 1

내가 TextBox1에, TextBox2를 명명 된 3 개의 텍스트 상자를 가정하고, TextBox3이 코드는 또한 각 필드에 클래스를 할당 할 수

$('#TextBox1, #TextBox2, #TextBox3').each(function() { 
    $(this).data('oldVal', $(this).val()); 
    $(this).bind("propertychange keyup input paste", function (event) { 
     if ($(this).data('oldVal') != $(this).val()) { 
      $(this).data('oldVal', $(this).val()); 

      $('#Comments').show(); 
     } 
    }); 
}); 

설명 필드를 해당 필드의 변화를 확인하고 표시합니다 이것을 좋아합니까?

$('.MyClass').each(function() { 
    $(this).data('oldVal', $(this).val()); 
    $(this).bind("propertychange keyup input paste", function (event) { 
     if ($(this).data('oldVal') != $(this).val()) { 
      $(this).data('oldVal', $(this).val()); 

      $('#Comments').show(); 
     } 
    }); 
});