gpt4 book ai didi

javascript - JQueryMobile 过滤 XMLhttprequest

转载 作者:行者123 更新时间:2023-11-28 08:23:47 25 4
gpt4 key购买 nike

我很难让 JQueryMobile 过滤器功能在我正在使用的脚本上运行。

我创建了一个简单的 xmlhttp 请求来从包含 175 个条目和 4 列的 XML 文件中收集数据。输出没问题。现在我不想在这个表中进行过滤。但是当连接时它没有任何效果。

感谢任何帮助

<script type="text/javascript">

xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","Issue.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;


document.write('<table border="1" cellspacing="1" cellpadding="5">')
var Asset = xmlDoc.getElementsByTagName("Attribute");

for (x = 0; x <= Asset.length; x++) //Asset.length
{
document.write("<tr>");
document.write("<td>" + xmlDoc.getElementsByName("Number")[x].childNodes[0].nodeValue) + "</td>";
document.write("<td>" + xmlDoc.getElementsByName("Name")[x].childNodes[0].nodeValue) + "</td>";
document.write("<td>" + xmlDoc.getElementsByName("Address")[x].childNodes[0].nodeValue) + "</td>";
document.write("<td>" + xmlDoc.getElementsByName("Phone")[x].childNodes[0].nodeValue) + "</td>";
document.write("</tr>");
}

document.write("</table>");
</script>

XML:

<?xml version="1.0" encoding="UTF-8"?>
<Assets pageSize="2222222" pageStart="0" total="175">
<Asset href="www.home1.com">
<Attribute name="Number">123123123</Attribute>
<Attribute name="Name">asdqweqweqwe</Attribute>
<Attribute name="Address">dsffdfsdfdasfsda</Attribute>
<Attribute name="Phone">123123123</Attribute>
</Asset>
<Asset href="www.home2.com">
<Attribute name="Number">4344433</Attribute>
<Attribute name="Name">ssssss</Attribute>
<Attribute name="Address">ddddd</Attribute>
<Attribute name="Phone">6666666</Attribute>
</Asset>
</Asset>

工作表标题:

    document.write('<table data-role="table" data-filter="true" data-input="#filterTable-input" id="thetable" class="ui-responsive table-stroke">');
document.write('<thead><tr><th>Number</th><th>Name</th><th>Custom</th><th>Owner</th></tr></thead>');
document.write('<tbody>');

最佳答案

创建表后,您不会初始化 jQuery Mobile 小部件(表和可过滤)。以下是如何执行此操作的示例。

给定一个带有过滤器输入和表的空容器的 jQM 页面:

<div data-role="page" id="page1">
<div data-role="header" data-position="fixed">
<h1>My page</h1>
</div>
<div role="main" class="ui-content">
<form>
<input id="filterTable-input" data-type="search" />
</form>
<div id="tableContainer">
</div>
</div>
</div>

您的脚本将使用 data-filter="true"data-input="#filterTable-input" 创建表,继续创建 THEAD 和TBODY 部分并使用 XML 填充行。将创建的表附加到空容器后,使用 .table().filterable() 初始化表和可过滤小部件:

$(document).on("pagecreate", "#page1", function(){      
var thetable = '<table data-role="table" data-filter="true" data-input="#filterTable-input" id="thetable" class="ui-responsive table-stroke">';
thetable += '<thead><tr><th>Number</th><th>Name</th><th>Address</th><th>Address</th></tr></thead>';
thetable += '<tbody>';
for (x = 0; x <= 175; x++) {
thetable += '<tr>';
thetable += '<td>' + x + 'a</td>'
thetable += '<td>' + x + 'b</td>'
thetable += '<td>' + x + 'c</td>'
thetable += '<td>' + x + 'd</td>'
thetable += '</tr>';
}
thetable += '</tbody>';
thetable += '</table>';

$("#tableContainer").empty().append(thetable);
$("#thetable").table().filterable( );
});

Here is a DEMO

关于javascript - JQueryMobile 过滤 XMLhttprequest,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22670833/

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