Javascript 如何通过ajax和jquery在datatables中使用for循环为每行添加按钮
我想使用ajax函数为每一行添加按钮……我编写了一些代码,但效果不好。。按钮移出表格并查看页面底部的所有按钮。我想将这些按钮添加到datatables行。。。 我想使用for循环将abc按钮逐个添加到[object object]feild ajax和jqueryJavascript 如何通过ajax和jquery在datatables中使用for循环为每行添加按钮,javascript,jquery,ajax,spring-mvc,datatables,Javascript,Jquery,Ajax,Spring Mvc,Datatables,我想使用ajax函数为每一行添加按钮……我编写了一些代码,但效果不好。。按钮移出表格并查看页面底部的所有按钮。我想将这些按钮添加到datatables行。。。 我想使用for循环将abc按钮逐个添加到[object object]feild ajax和jquery <script> $(document).ready(function () { $("#searchArea").hide(); var uID = $("
<script>
$(document).ready(function () {
$("#searchArea").hide();
var uID = $("#userName").val();
var tableProduct = $('#dataTbl').DataTable({
"bSort": true
, "oLanguage": {"sZeroRecords": "", "sEmptyTable": ""}
});
$.ajax({
type: 'GET',
url: '${pageContext.request.contextPath}/restservice/App50/' + uID,
success: function (result) {
var jString = JSON.stringify(result);
var jdata = JSON.parse(jString);
for (var x = 0; x < jdata.length; x++) {
var pa = $('#aaa');
var td1 = jdata[x].snumber;
var td2 = jdata[x].date;
var td3 = jdata[x].slsNo + " in " + jdata[x].slsiUnit;
var td4 = jdata[x].productDesc;
var td5 = jdata[x].status;
var td6 = pa.append('<input type="button" class="btn btn-success" value="abc">');
var td7 = "jdata[x].hsCode";
var td8 = "jdata[x].hsCode";
tableProduct.row.add([td1, td2, td3, td4, td5, td6, td7, td8]).draw(true);
}
}
});
});
</script>
$(文档).ready(函数(){
$(“#搜索区域”).hide();
var uID=$(“#用户名”).val();
var tableProduct=$('#dataTbl')。DataTable({
“bSort”:正确
,“oLanguage”:{“sZeroRecords”:“sEmptyTable”:“}
});
$.ajax({
键入:“GET”,
url:“${pageContext.request.contextPath}/restservice/App50/”+uID,
成功:功能(结果){
var jString=JSON.stringify(结果);
var jdata=JSON.parse(jString);
对于(var x=0;x
jsp跳线
<body>
<div id="bootstrapCssTest" class="hidden"></div>
<div id="bootstrapCssTest" class="hidden"></div>
<div class="container">
<div class="row headerRow1">
<div class="col-md-12">
<jsp:include page="template/banner.jsp"/>
</div>
</div>
<div class="row">
<div class="authheader">
<%@include file="template/message.jsp" %>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-4 col-md-3 col-lg-3">
<jsp:include page="template/header.jsp"/>
</div>
<div class="col-xs-12 col-sm-8 col-md-9 col-lg-9">
<div class="row">
<div class="col-lg-12">
<div class="well lead">List of Applications</div>
</div>
</div>
<div class="row">
<input type="hidden" id="userName" value="${userID}"/>
<input type="hidden" id="recentView" value="1"/>
<div class="panel panel-default">
<div id="ribbon">Search - <p id="viewSearchCategory" style="display: inline-block" >View Recent 50 Applications</p></div>
<div id="searchArea" class="well ">
<div class="row">
VIEW RECENT
<select id="viewNumbers" name="viewNumbers">
<option value="50">50</option>
<option value="100">100</option>
<option value="150">150</option>
<option value="200">200</option>
<option value="500">500</option>
<option value="750">750</option>
<option value="1000">1000</option>
</select>
APPLICATIONS
</div>
</div>
<!-- Default panel contents -->
<div style="overflow-x:auto;">
<table id="dataTbl" class="table table-bordered table-hover" style="font-size:13px;">
<thead>
<tr>
<th width="10%">SLSI Entry No</th>
<th width="10%">Application Posted in</th>
<th width="30%">SLS No and Unit</th>
<th width="30%">Product Description</th>
<th width="10%">Status</th>
<th class="hidden-print"></th>
<th class="hidden-print"></th>
<th class="hidden-print"></th>
</tr>
</thead>
</table>
</div>
<p id="aaa"></p>
</div>
</div>
</div>
</div> <jsp:include page="template/footer.jsp"/></div>
</body>
申请表
搜索-查看最近50个应用程序
查看最近的
50
100
150
200
500
750
1000
应用
SLSI条目号
申请表张贴于
SLS编号和单位
产品说明
地位
帮我个忙您可以使用数据表的rows().every()属性
我给你举个例子
var table = $('#example').DataTable();
table.rows().every( function ( rowIdx, tableLoop, rowLoop ) {
this
.child(
$(
'<tr>'+
'<td><input type="button" value="new button"/></td>'+
'</tr>'
)
)
.show();
} );
var table=$('#示例').DataTable();
table.rows().every(函数(rowIdx、tableLoop、rowLoop){
这
.孩子(
$(
''+
''+
''
)
)
.show();
} );
这是一个示例代码。请根据您的要求进行更改。代码中的问题是。您将按钮附加到表外的$(“#aaa”)上 换行
var td6 = pa.append('<input type="button" class="btn btn-success" value="abc">');
var td6=pa.append(“”);
到
var td6='';
这是一个基于代码的JSFIDLE示例:添加按钮的最佳方法是在API级别的最后一个字段“${pageContext.request.contextPath}/restservice/App50/”+uID中准备按钮html
因此,当datatable不需要操作javascript返回的数据时。您需要在行中显示所有数据。并且还显示表外的所有按钮?我需要显示一个用于循环的行的按钮。我不理解这条线,因为我是ajax和jquery的新手。如果你能修改我的线,请尝试替换var td6=pa.append(“”);对于var td6='只需尝试。。
var td6 = '<input type="button" class="btn btn-success" value="abc">';