실시간 검색으로 페이지 매김

Question

지금까지 페이징으로 보고서를 만들었습니다. 샘플 코드의 index.php :

<div class='web'>  
    <h1>Data Order Notaris</h1> 
     <div id="page_data"></div> 
      <span class="flash"></span> 
     </div> 

사용 스크립트 : 라이브 검색을 사용하는 경우 쇼 페이징

$(document).ready(function(){ 
        change_page('0'); 
       }); 
        function change_page(page_id){ 
         $(".flash").show(); 
         $(".flash").fadeIn(400).html('Loading <img src="ajax-loader.gif" />'); 
         var dataString = 'page_id='+ page_id; 
          $.ajax({ 
           type: "POST", 
           url: "paging.php", 
           data: dataString, 
           cache: false, 
            success: function(result){ 
             $(".flash").hide(); 
             $("#page_data").html(result); 
            } 
          }); 
        } 

내 파일이 paging.php 내 문제입니다.

<input type='text' name='search' placeholder='search' /> 

내가 그것을 양식을 필요로하고 버튼을 제출하지 않는 생각 : 나는

입력 스크립트를 추가 index.php를

에 입력 유형을 추가하려합니다. 입력 데이터 이름 = '검색'에서 필터 데이터보고를 위해 paging.php에 값을 게시하는 방법은 무엇입니까?

더 많은 기능이 필요하거나 function change_page를 사용해야합니까? 나는 아직도 논리와 혼동하고있다. 도움을 주셔서 감사

Answer 1

당신은이 방법으로 입력을 제공한다 :

<input type='text' Id="search_box" name='search' placeholder='search' /> 

그런 다음 사용 JS 당신이 그래서 JS 코드가 같은 것이 필드의 값

를 가져올 수 :

$(document).ready(function(){ 
        change_page('0'); 
       }); 
        function change_page(page_id){ 
         //To get the field value 
         var search_val = $("#search_box").val(); 
         $(".flash").show(); 
         $(".flash").fadeIn(400).html('Loading <img src="ajax-loader.gif" />'); 
         var dataString = 'page_id='+ page_id+'&search='+search_val; 
          $.ajax({ 
           type: "POST", 
           url: "paging.php", 
           data: dataString, 
           cache: false, 
            success: function(result){ 
             $(".flash").hide(); 
             $("#page_data").html(result); 
            } 
          }); 
        } 

그런 다음 paging.php에서 적절한 쿼리를 작성하십시오.