我正在使用Jquery数据表并使用Ajax从服务器获取数据.基本上我发送的数据是关于订单的,并且有不同类型的订单.
我想要实现的是订单类型和订单数据一起发送,并在客户端显示图像.
我有两种主要类型,Surplus和Deficit.我在客户端和服务器上都有两个图像作为静态内容,我可以获取数据.我不知道如何显示它.
这是我从服务器获取数据的方式
$('#matchOrderedTable').dataTable({
"ajax": {
"url": TippNett.Api.Url + "Match/DataTable","data": function (d) {
d.token = authToken;
}
},"columns": [
{ "data": "Created" },{ "data": "Amount" },{ "data": "OrderOrg" },{ "data": "OrderMatchedOrg" },{ "data": "OrderLoc" },{ "data": "OrderMatchLoc" },]
});
我的视图看起来像这样
<table id="matchOrderedTable">
<thead>
<tr>
<th>@Texts.Created</th>
<th>@Texts.Amount</th>
<th>@Texts.Organizations</th>
<th>@Texts.MatchedOrg</th>
<th>@Texts.Locations</th>
<th>@Texts.MatchedLoc</th>
</tr>
</thead>
</table>
关于如何做的任何想法或例子？
解决方法
尝试使用
columns.render属性,以便您可以创建自定义函数来执行逻辑以检查订单类型,然后返回图像的正确字符串表示形式.
示例(更新以匹配以下评论)
在表格声明代码中,为订单类型添加一列
$('#matchOrderedTable').dataTable({
"ajax": {
"url": TippNett.Api.Url + "Match/DataTable",{ "data": "OrderLoc",render: getImg },{ "data": "OrderMatchLoc",render: getImg }
]
});
列渲染功能代码. data属性将行数据存储为对象,因此使用它来访问订单类型值.
更新：即使OrderType没有列,您仍然可以访问数据参数中的对象值.
function getImg(data,type,full,Meta) {
var orderType = data.OrderType;
if (orderType === 'Surplus') {
return '<img src="image path here" />';
} else {
return '<img src="image path here" />';
}
}
希望这会有所帮助.