使用jquery动态建立网格(Dynamically buiding a grid with jquery)

使用jquery动态建立网格(Dynamically buiding a grid with jquery)

我一直在研究如何使用jquery动态构建网格。 我已经阅读了大量的api并通过搜索和谷歌进行了搜索，但似乎没有人对它做出明确的整体立场。 也许我只是不明白，所以我正在使用一个名为build table的函数，我想返回结果。

因此，一旦单击此生成表按钮，它应显示网格。

但没有表现出来

任何人都可以帮忙

function buildTable(criteria) { var result = new Object(); result.rows = criteria.rows; result.totalRows = result.rows + 1; result.row = new Array(); for(var i = 0; i < result.rows; i++) { result.row[i] = new Object(); result.row[i].shoeId = 100+i; result.row[i].dressId = "LKM0" + i; result.row[i].arrivalDt = "01/02/2013 15:45"; result.row[i].stockDt = "01/02/2013 15:46"; result.row[i].fashionStatus = "differences"; } return result; } </script> <input type="button" value="Generate a table." onclick=" document.getElementById('Grid').style.visibility = 'visible';" /> <div class="Grid" id="Grid" onload="buildTable()" > </div>

I have been researching how to dynamically construct a grid using jquery. I've read tons of api's and searched through s.o. and google but no one seems to give a clear overall stance on it. Maybe I'm just not understand also, so I'm using a function called build table and I want to return result.

So once this generate table button is clicked then it should display grid.

However nothing show

Can any one help

function buildTable(criteria) { var result = new Object(); result.rows = criteria.rows; result.totalRows = result.rows + 1; result.row = new Array(); for(var i = 0; i < result.rows; i++) { result.row[i] = new Object(); result.row[i].shoeId = 100+i; result.row[i].dressId = "LKM0" + i; result.row[i].arrivalDt = "01/02/2013 15:45"; result.row[i].stockDt = "01/02/2013 15:46"; result.row[i].fashionStatus = "differences"; } return result; } </script> <input type="button" value="Generate a table." onclick=" document.getElementById('Grid').style.visibility = 'visible';" /> <div class="Grid" id="Grid" onload="buildTable()" > </div>

最满意答案

如果您在服务器端生成数据，则可以在将页面呈现到Grid div时呈现它：

<div id="Grid" style="display:none"> <table> ... etc ... </table> </div>

然后只需在他们点击按钮时显示div

或者，如果只需要在单击按钮时构建表，则可以使用Ajax执行此操作：

<input type="button" value="Generate a table." onclick="loadGrid()" /> <script> $("#Grid").load("Url to generate table", function() { $(this).show(); }); </script>

或者如果你真的想用javascript构建表格，那么这可能会给你一些想法

If you're generating the data on the server side, you could either render it when you render the page into your Grid div:

<div id="Grid" style="display:none"> <table> ... etc ... </table> </div>

and then just show the div when they click on the button

Or if you need to build up the table only when they click the button, then you could do so using Ajax:

<input type="button" value="Generate a table." onclick="loadGrid()" /> <script> $("#Grid").load("Url to generate table", function() { $(this).show(); }); </script>

Or if you really want to build up the table using javascript, then this might give you some ideas