Meteor 和 Bootstrap 表,如何调用 detailFormatter 函数
Meteor and Bootstrap table, How to call detailFormatter function
我正在使用引导表
1:http://bootstrap-table.wenzhixin.net.cn/。我已经添加了这个包来导入引导表。
<table id="table" class="table table-striped"
data-toolbar="#toolbar"
data-detail-view="true"
data-height="460"
data-pagination="true"
data-search="true"
data-sort-name="name"
data-sort-order="desc"
data-unique-id="id"
data-page-list="[10, 25, 50, 100, ALL]"
data-detail-formatter="detailFormatter"
data-show-export="true"
data-show-refresh="true"
data-show-columns="true"
data-row-style="rowStyle"
data-export-types="['csv']">
<thead>
<tr>
<th data-field="id" data-sortable="true">id</th>
<th data-field="question" data-sortable="true">question</th>
<th data-field="answerswer" data-sortable="true">answer</th>
<th data-field="category" data-visible="true" data-tableexport-display="always">category</th>
</tr>
</thead>
</table>
它工作正常,但我有一个 detailFormatter 函数,必须调用它来创建行详细信息内容。 基本上我试图实现 这个
所以在我的js中,我添加了detailFormatter函数,但是不工作,那么我应该把detailFormatter函数放在哪里工作。
if (Meteor.isClient) {
function detailFormatter(index, row) {
alert("detailFormatter 1")
var html = [];
$.each(row, function (key, value) {
console.log("key: "+key);
if(key=="answerswer") {
html.push('<p><b>' + key + ':</b> <textarea class="form-control">' + value + '</textarea> </p>');
html.push('<button type=button class=update-btn>Update</button>');
}
if(key=="category"){
console.log("category:: "+value)
if(value=="application_related"){
html.push('<select class="form-control"><option selected value="application_related">Application Related</option><option value="application_status">Application Status</option></select>');
} else {
html.push('<select class="form-control"><option selected value="application_related">Application Related</option><option value="application_status" selected>Application Status</option></select>');
}
$('select').first().val("application_status");
//$('select option[value="' + value + '"]')
}
if(key=="id"){
html.push('<input type="hidden" class="id" value='+ value + '></input>');
console.log("category:: "+value)
}
});
return html.join('');
}
}
当通过 HTML 定义时,我在 rowStyle 中遇到了类似的问题。解决方案是通过 JS 将函数传递给表。这同样适用于需要传递给引导表的任何函数。
例如:
Template.results.onRendered(function(){
this.$('#table').bootstrapTable({detailFormatter : myFormatterFunction, rowStyle : myRowStyleFunction});
};
相关文章:
- 如何使jQuery插件函数可调用以供独立使用,而不在集合上操作
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 如何从Java/scala调用js美化程序
- 如何调用这个匿名 JavaScript 函数
- 如何从模块链中调用函数.导出到节点中
- 我需要从php调用javascript或jquery
- Chrome开发工具(如何知道我在调用哪个javascript对象)
- 单击按钮后如何逐个调用分区,上一个分区将隐藏
- 另一个ajax调用中的Jquery ajax调用在for循环中没有按预期工作
- Twitter Bootstrap typeahead:使用“this”获取上下文/调用元素
- node.js:setInterval()正在跳过调用
- 如何在单击复选框后调用控制器方法
- 如何在JQuery函数中定义一个值,然后调用另一个函数并使用该值
- 使用Google Visualization动态调用构造函数
- 如何在webView,Android中从@JavascriptInterface方法调用Javascript
- 是否可以将一个函数输入连接到另一个函数调用的文本
- 调用函数内部的函数
- 函数未在Object.keys或Object.getOwnPropertyNames下列出,但可以调用
- Javascript/jQuery中的并行Ajax调用
- 同步调用,直到用户通过angular验证为访问者