gpt4 book ai didi

javascript - jqGrid - 搜索本地数组数据

转载 作者:行者123 更新时间:2023-11-30 06:40:08 25 4
gpt4 key购买 nike

在 jqGrid 中对本地数据进行工具栏搜索时出现问题。

我在这里找到了早期版本的修复程序,但我理解文档的方式是自 V3.7 以来内置的(我使用的是 4.4)。

如果您对字段名称感到好奇,它是羊驼农场畜群管理系统的 Web 界面

为什么在 jquery 中使用 ajax 而不是将 XML 拉入 jqGrid? XML(不在我的控制范围内)格式不正确 - 每次我在 jqGrid 中尝试它时,它都失败了,因此 XML -> DOM -> 对象转换。

Grid 完美加载、显示、分页和排序

<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>

当我开始在其中一个搜索框中输入任何内容时,一切都会消失。

我错过了什么?

最佳答案

几个月后,但刚刚看到 Jeff 的评论,建议我添加一个答案,而不仅仅是对我的错误的评论。开始...

问题是用户错误之一,或者更确切地说,是用户解释。

代码运行完美,只是不是我期望的那样。 jqgrid 中搜索的默认行为是将输入的搜索词视为区分大小写并进行简单的从左到右比较

关于javascript - jqGrid - 搜索本地数组数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12016636/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com