2014-06-20 3 views
0

jstring.js와 함께 asp.net mvc 5를 사용하여 프로젝트를 빌드합니다.텍스트 상자의 키 이벤트 이벤트에서 Html 테이블 내에서 텍스트 검색

페이지 중 하나에는 직원 목록이 들어있는 html 테이블 인 생성하는 동적 HTML이 있습니다.

아래 코드로 내용을 검색하려고합니다.

텍스트 상자의 keyup 이벤트에서 호출됩니다.

JQuery와 파일은 여기 refernced :

$(function(){ 
     $('#txtFilter').keyup(function(){ 
      FilterData(); 
     }); 
    }); 

마크 업 : 내가 텍스트 상자에 단일 문자를 입력 할 때마다

<div class="popHeader"> 
     Select Employee 
    </div> 
    <br> 
    <span>Filter:<input id="txtFilter" type="text"></span> 
    <br><br> 
    <table id="tblSearch" class="table"> 
     <tbody><tr> 
      <th></th> 
      <th> 
       EmployeeId 
      </th> 
      <th> 
       Display Name 
      </th> 
      <th> 
       CurrentUsername 
      </th> 
     </tr> 
    <tr><td><a>Select</a></td><td>95961</td><td>Ankur</td><td>ankurda</td></tr><tr><td><a>Select</a></td><td>79761</td><td>Sameer </td><td>sameerba</td></tr><tr><td><a>Select</a></td><td>91060</td><td>Neeraj </td><td>Neerajsi</td></tr><tr><td><a>Select</a></td><td>83127</td><td>Pankaj </td><td>pankajpu</td></tr></tbody></table> 


function FilterData() 
    { 
     debugger; 
     var $rows = $('#tblSearch tr'); 


    var val = '^(?=.*\\b' + $.trim($(this).val()).split(/\s+/).join('\\b)(?=.*\\b') + ').*$', 
     reg = RegExp(val, 'i'), 
     text; 

    $rows.show().filter(function() { 
     text = $(this).text().replace(/\s+/g, ' '); 
     return !reg.test(text); 
    }).hide(); 
} 

내가 오류 아래이 얻을

@Scripts.Render("~/bundles/jquery") 

이벤트에 등록 .

Error:Microsoft JScript runtime error: Unable to get value of the property 'toLowerCase': object is null or undefined. 

무엇이 잘못되었는지를 알 수 없습니다. 이 같은

+0

'FilterData()'를 어떻게 호출할까요? 'this'에 대한 참조를 전달해야합니다. –

+0

제공된 코드에'toLowerCase' 함수 호출이 없으므로 코드의 다른 곳에 오류가 있습니다 ..? –

+0

전화가 없다는 것을 알고 있습니다. jquery 파일과 함께 제공됩니다. – ankur

답변

0

제거

@Scripts.Render("~/bundles/jquery") 

그리고 추가 JQuery와 :

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 

그런 다음 다음과 같이하십시오. 그것은 당신을 도울 수 있습니다.

function FilterData() { 
     var rows = $('#tblSearch tbody tr'); 

     var val = $.trim($('#txtFilter').val()).replace(/ +/g, ' ').toLowerCase(); 

     rows.show().filter(function() { 
      var text = $(this).text().replace(/\s+/g, ' ').toLowerCase(); 
      return !~text.indexOf(val); 
     }).hide(); 
    } 
}); 
관련 문제