2

jqGrid のローカル データでのツールバー検索に問題があります。

ここで以前のバージョンの修正のように見えるものを見つけましたが、ドキュメントを理解する方法は、V3.7 以降に組み込まれています (私は 4.4 を使用しています)。

フィールド名に興味がある場合は、アルパカ ファームの群れ管理システムへの Web インターフェイスです。

XMLをjqGridにプルするだけでなく、jqueryでajaxを使用するのはなぜですか? XML (私の制御範囲外) は整形式ではありません。jqGrid 内で試行するたびに失敗したため、XML -> DOM -> オブジェクト変換が行われました。

グリッドは完全に読み込み、表示、ページ、並べ替えを行います

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" media="screen" href="jqGrid/css/ui.jqgrid.css" />

<script src="jqGrid/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="jqGrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<style>
#list td {
font-size: .6em;
}

.ui-pg-input{
    height: initial !important;
}
</style> 
<script type="text/javascript">
pacaURL = "/alpaca/proxy.php?url=localhost:9002/rest/alpaca";
$(function(){ 
var pData = new Array();
$.ajax({
    url:pacaURL, 
    success:function(data){
        pacaData = $.parseXML(data);
        console.log(pacaData);

        $(pacaData).find("AlpacaListing").each(function(){
            pData.push({
                Name: $(this).find("Name").text(),
                Age: FormatDate($(this).find("DOB").text()),
                Colour: $(this).find("Colour").text(),
                IAR: $(this).find("IAR").text(),
                Sex: $(this).find("Sex").text(),
                Sire: $(this).find("SireName").text(),
                Dam: $(this).find("DamName").text()
            });
        });
        console.log(pData);
        makeGrid(pData);
    },
    complete:function(data){
        console.log("COMPLETE");
    }
});


}); 

function makeGrid(pData) {
$("#list").jqGrid({
    datatype:'local',
    data: pData,
    colNames:['Name','Age(M)', 'Colour','IAR','Sex','Sire', 'Dam'],
    colModel :[ 
    {name:'Name', index:'Name', width:180}, 
    {name:'Age', index:'Age', width:90, align:'right', sorttype:'int'}, 
    {name:'Colour', index:'Colour', width:150}, 
    {name:'IAR', index:'IAR', width:70, align:'right', sorttype:'int'}, 
    {name:'Sex', index:'Sex', width:70}, 
    {name:'Sire', index:'Sire', width:180},
    {name:'Dam', index:'Dam', width:180}
    ],
    pager: '#pager',
    rowNum:20,
    rowList:[10,20,30],
    loadonce: true,
    sortname: 'Name',
    sortorder: 'desc',
    viewrecords: true,
    gridview: true,
    caption: 'The Herd'
}); 

$('#list').jqGrid('filterToolbar', { stringResult:true, searchOnEnter: false });
}

function FormatDate(sqlDate){
b=new Date(sqlDate);
d= new Date(new Date() - b);

return (d.getYear() - 70) * 12 + d.getMonth();
}
</script>

</head>
<body>
<table id="list"><tr><td/></tr></table> 
<div id="pager"></div> 
</body>
</html>

検索ボックスの 1 つに何かを入力し始めるとすぐに、すべてが空白になります。

私は何が欠けていますか？

4

1 に答える 1

0

数か月後、エラーに関する単なるコメントではなく、回答を追加することを示唆するジェフからのコメントを見たところです。ここに行きます...

問題は、ユーザー エラー、またはユーザーの解釈の 1 つでした。

コードは完全に機能していましたが、私が期待していた方法ではありませんでした。jqgrid での検索のデフォルトの動作は、入力された検索用語を大文字と小文字を区別して扱い、単純な左から右への比較を行うことです。

于 2012-12-10T23:00:31.433 に答える