связыванию данных Аякса Bootgrid не показывает результат

Question

я столкнулся вопрос о поисковых functionality.I ищу информацию и в то время как ключ в любом значение & отладки дал мне ошибку на линии ниже:

if (column.searchable && column.visible && 
 
        column.converter.to(row[column.id]).search(searchPattern) > -1)

Моя реализация :

$(document).ready(function() 
 
{ 
 
sendRESTQuery(asmx()); 
 
}); 
 
function asmx() { 
 
var url = window.location.protocol + "//" + window.location.host + _spPageContextInfo.siteServerRelativeUrl; 
 
    var asmx = url + "/_vti_bin/listdata.svc/AD?$select=Column1,Column2,Column5,Column7,Column9"; //?$select=Column1,Column2,Column3,Column4 
 
    
 
    return asmx; 
 
} 
 
function testBtn() { 
 
sendRESTQuery(asmx()); 
 
} 
 
var baseUrl = asmx(); 
 

 
function sendRESTQuery(baseUrl) { 
 
    
 
    $.ajax({   
 
     contentType: 'application/json;odata=verbose',  
 
     url: baseUrl, 
 
     headers: { 
 
      'X-RequestDigest': $('#__REQUESTDIGEST').val(), 
 
      "Accept": "application/json; odata=verbose" 
 
     }, 
 
     post: function() {alert('true')},  
 
     complete: function (result) {     
 
      var response = JSON.parse(result.responseText); 
 
      if (response.error) { 
 
      } 
 
      else { 
 
       bgDetails = response.d; 
 
       onSuccess(bgDetails.results);     
 
      } 
 
     }   
 
    
 
    });  
 
} 
 

 
function onSuccess(bgDetails) { 
 
\t \t 
 
     $("#grid-data").bootgrid().bootgrid("append", bgDetails); 
 
     $("#grid-data").bootgrid("sort", { Column2 : "asc"}).bootgrid("search", $('.search-field').val()); 
 

 
     
 
     }

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-bootgrid/1.2.0/jquery.bootgrid.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-bootgrid/1.2.0/jquery.bootgrid.js"></script>

<table id="grid-data" class="table table-condensed table-hover table-striped" data-toggle="bootgrid" data-keep-selection="true"> 
<thead> 
<tr> 
<th data-column-id="Column1" data-type="numeric" data-identifier="true" data-visible="false" >Employee ID</th> 
<th data-column-id="Column2">Full Name</th> 
<th data-column-id="Column5">Department</th> 
<th data-column-id="Column7" >Work Phone</th> 
<th data-column-id="Column9">Email</th> 
</tr> 
</thead> 
</table> 

Answer 1

Это известная ошибка в bootgrid, когда вы работаете с append с JSON, содержащим null значения для поиска столбца.

Вы должны убедиться, что у вас нет нулевых значений в любых строках столбцов, доступных для поиска. Один из способов сделать это:

function onSuccess(bgDetails) { 

    // iterate every row, and every property with null, and set an empty string... 
    for (var i = 0; i < array.length; i++) { 
     var row = array[i]; 
     for (var prop in row) { 
      if (row.hasOwnProperty(prop) && row[prop] === null) { 
       row[prop] = ""; 
      } 
     } 
    } 

    $("#grid-data").bootgrid().bootgrid("append", bgDetails); 
    $("#grid-data").bootgrid("sort", { Column2 : "asc"}).bootgrid("search", $('.search-field').val()); 

    } 

Другим вариантом было бы использовать их ajax вместо использования append с чем-то вроде этого:

$("#grid-data").bootgrid({ 
    ajax: true, 
    ajaxSettings: {   
     contentType: 'application/json;odata=verbose', 
     headers: { 
      'X-RequestDigest': $('#__REQUESTDIGEST').val(), 
      "Accept": "application/json; odata=verbose" 
     } 
    }, 
    url: baseUrl 
}); 


$("#grid-data").bootgrid("sort", { Column2 : "asc"}) 
       .bootgrid("search", $('.search-field').val()); 

... но вы, возможно, потребуется изменить ответ сервера апи чтобы соответствовать JSON они ожидают, что это что-то вроде этого (см в their examples):

{ 
    "current": 1, 
    "rowCount": 10, 
    "rows": [ 
    { 
     "id": 19, 
     "sender": "123@test.de", 
     "received": "2014-05-30T22:15:00" 
    }, 
    { 
     "id": 14, 
     "sender": "123@test.de", 
     "received": "2014-05-30T20:15:00" 
    }, 
    ... 
    ], 
    "total": 1123 
}