我有一种情况,我的 Jquery Ajax 脚本生成 HTML 表。另一个脚本旨在通过提供包含该特定列中唯一值的下拉列表来过滤表列。
如果我在 html 页面中有静态内容,则过滤器脚本可以正常工作。但是在运行时通过 Ajax 生成时无法读取表内容。
任何想法可能是什么原因。我还尝试按顺序对齐脚本。
我的 Ajax 脚本在这里:-
$(document).ready(function() {
$("#getResults").click(function(){
bug = $("#bug").val();
priority = $("#priority").val();
component = $("#component").val();
fixVersion = $("#fixVersion").val();
dateType = $("#dateType").val();
fromDate = $("#dp2").val();
toDate = $("#dp3").val();
$("#query").empty();
$("tbody").empty();
$.post("getRefineSearchResultsPath", {bug:bug,priority:priority,component:component,
fixVersion:fixVersion,dateType:dateType,fromDate:fromDate,toDate:toDate },
function(data) {
// setting value for csv report button
//clear the value attribute for button first
$("#query_csv").removeAttr("value");
//setting new value to "value" attribute of the csv button
$("#query_csv").attr("value", function(){
return $(data).find("query").text();
});
$("#query").append("<p class='text-success'>Query<legend></legend><small>" +$(data).find("query").text() +"</small></p>");
var count = 1;
$(data).find("issue").each(function(){
var $issue = $(this);
var value = "<tr>";
value += "<td>" +count +"</td>";
value += "<td>" +$issue.find('issueKey').text() +"</td>";
value += "<td>" +$issue.find('type').text() +"</td>";
value += "<td><div id='list' class='summary'>" +$issue.find('summary').text() +"</div></td>";
value += "<td><div id='list' class='mousescroll'>" +$issue.find('description').text() +"</div></td>";
value += "<td>" +$issue.find('priority').text() +"</td>";
value += "<td>" +$issue.find('component').text() +"</td>";
value += "<td>" +$issue.find('status').text() +"</td>";
value += "<td>" +$issue.find('fixVersion').text() +"</td>";
value += "<td>" +$issue.find('resolution').text() +"</td>";
value += "<td>" +$issue.find('created').text() +"</td>";
value += "<td>" +$issue.find('updated').text() +"</td>";
value += "<td>" +$issue.find('os').text() +"</td>";
value += "<td>" +$issue.find('frequency').text() +"</td>";
value += "<td>";
var number_of_attachement = $issue.find('attachment').size();
if(number_of_attachement > 0){
value += "<div id='list' class='attachment'>";
value += "<ul class='unstyled'>";
$issue.find('attachment').each(function(){
var $attachment = $(this);
value += "<li>";
value += "<a href='#' onclick='document.f1.attachmentName.value='" +$attachment.find('attachmentName').text();
value += "';document.f1.issueKey.value='"+$attachment.find('attachmentissueKey').text();
value += "';document.f1.digest.value='"+$attachment.find('attachmentdigest').text();
value += "';document.f1.submit();'>"+$attachment.find('attachmentName').text();
value += "</a>";
value += "</li>";
value += "<br>";
});
value +="</ul>";
value +="</div>";
}
value += "</td>";
value += "</tr>";
$("tbody").append(value);
count++;
});
});
});
});
我的过滤表脚本在这里,我从这个链接http://www.javascripttoolbox.com/lib/table/得到了这个脚本
我的 JSP 页面在这里:-
<html>
<body>
<table class="table table-bordered table-condensed table-hover example sort01 table-autosort:0 table-autofilter table-autopage:10 table-page-number:t1page table-page-count:t1pages table-filtered-rowcount:t1filtercount table-rowcount:t1allcount">
<thead >
<tr>
<th class="table-sortable:numeric" Style="width:3%;">No.</th>
<th class="table-sortable:default" Style="width:5.5%;">Issue Key <br>
</th>
<th>Type</th>
<th Style="text-align: center;">Summary</th>
<th Style="text-align: center;">Description</th>
<th class="table-filterable table-sortable:default" id ="priorityColumn" Style="width:5%">Priority</th>
<th class="table-filterable table-sortable:default" >Component</th>
<th class="table-filterable table-sortable:default" Style="width:5%">Status</th>
<th class="table-filterable table-sortable:default">Fix Version</th>
<th class="table-filterable table-sortable:default" Style="width:6%">Resolution</th>
<th>Created</th>
<th>Updated</th>
<th>OS</th>
<th>Frequency</th>
<th>Attachments</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<td class="table-page:previous" style="cursor:pointer;"><img src="table/icons/previous.gif" alt="Previous"><small>Prev</small></td>
<td colspan="13" style="text-align:center;">Page <span id="t1page"></span> of <span id="t1pages"></span></td>
<td class="table-page:next" style="cursor:pointer;">Next <img src="table/icons/next.gif" alt="Previous"></td>
</tr>
<tr Style="background-color: #dddddd">
<td colspan="15"><span id="t1filtercount"></span> of <span id="t1allcount"></span> rows match filter(s)</td>
</tr>
<tr class="text-success">
<td colspan="15">Total Results : ${count}</td>
</tr>
</tfoot>
</table>
</body>
</html>