성공적으로 테이블에 데이터 추가 - JS

기존 데이터베이스를 성공적으로 쿼리하여 기존 데이터를 찾을 수 있습니다. 하지만 지금은 테이블을 검색 할 항목 만 표시하는 방법을 모르겠습니다. 텍스트 상자가 지워지면 표는 기본 상태로 돌아갑니다.성공적으로 테이블에 데이터 추가 - JS

어떻게하면 좋을까요?

당신은 새로운 검색 데이터를 추가하기 전에에서 취소 $("#table").empty()를 사용할 수 있습니다

<script> 
     $(document).ready(function() { 
       var typingTimer;    //timer identifier 
       var doneTypingInterval = 100; //time in ms (5 seconds) 

       $("#myInput").on('keyup', function() { 


    clearTimeout(typingTimer); 
       if ($('#myInput').val()) { 
        typingTimer = setTimeout(doneTyping, doneTypingInterval); 
       } 
      }); 
     }); 

     //user is "finished typing," do something 
     function doneTyping() { 
      var key = $('#myInput').val(); 

      if (key.length >= 1) { 
       $.ajax({ 
        url: '/admin/search/?myInput='+key, 
        type: 'GET', 
        beforeSend: function() { 
        $("#table").slideUp('fast'); 

        }, 
        success: function (data) { 
         console.log(data); 
         $("#table").append(data); 
         $("#table").slideDown('fast'); 
        } 
       }); 

     } 
    } 
    </script>

출처

2017-12-18 XamarinDevil

이 작업을 시도 할 수 :

success: function (data) { 

    var table = $("#table tbody"); 

    $.each(data, function(idx, elem){ 

    table.append(" 
    <tr><td>"+elem.id+"</td> 
    <td>"+elem.name+"</td> 
    <td>"+elem.lastname+"</td> 
    </tr> 
    "); 
    }); 
    }

사용자가 if (key.length >= 1)을 선택 했으므로 사용자가 아무 것도 입력하지 않으면 현재 콘텐츠가있는 표를 남겨 둡니다. Read this

출처

2017-12-18 08:02:23

문법을 잘 확인하십시오. 그것은 나에게 버그 투성이가 보인다 – XamarinDevil

무엇이 깔끔하게 보인다? 더 정확 해? –

행이 테이블에 추가되는 곳에서 내 코드에서 해당 부분을 주석 처리 할 때 실행 중입니다. 올바르지 않거나 예기치 않은 토큰이 표시됩니다. – XamarinDevil

컨트롤러

public function index(Request $request) 
     { 
      $query = "%".$request->get('myInput')."%"; 
      $students = Student::where('name','LIKE',$query)->where('grade_id',Auth::user()->grade_id)->paginate(5);    
      return view('customer.index',compact('stduent','query')); 

     }

JS는

출처

2017-12-18 07:55:22

성공할 경우 아무 것도 실제로 내 테이블에 추가되지 않습니다. {: 1, 이름 : "존스"전화 "23242349243"주소 : "pickson"... ID} 길이 : __proto__ : 배열하지만 내 콘솔 내가 개체의 배열이'처럼 발견되는 것을 볼 (0)' – XamarinDevil

데이터는 테이블에 직접 추가 할 수없는 json 데이터입니다. 'table.append (""+ data.name + "")와 같이 추가하려면 attr을 사용해야합니다. 그리고 그 전에는 $ ("# table"). empty()'를 사용하여 새로운 검색 결과를위한 테이블을 지울 수있다. –

나는 테이블을 비우는 방법을 알지 못한다. 이것은 사용자가 시작할 때 원하는 것이다. 타이핑을하면 필터가 걸릴 것입니다. – XamarinDevil

성공적으로 테이블에 데이터 추가 - JS

답변

관련 문제