如何使用php mysql,jquery从ajax返回一个字符串来填充html表

时间:2015-04-22 07:16:29

标签: php jquery ajax

我想用ajax返回的数据填充html表。我该怎么做下面是从ajax返回的字符串:

1-1.00-2013-2014,2-2.00-2013-2014,3-3.00-2013-2014,4-4.00-2013-2014,6-5.00-2013-2014,8-6.00-2013 -2014,10-7.00-2013-2014,12-8.00-2013-2014,16-9.00-2013-2014,20-10.00-2013-2014,24-11.00-2013-2014,30-12.00-2013-2014 ,36-13.00-2013-2014,48-14.00-2013-2014,60-15.00-2013-2014,61-16.00-2013-2014,


我的想法是将整个字符串拆分为:

var dataarr = data.split(',');

分割后,再次拆分,将转换为三个独立的数组

var dataarr = data.split('-');

然后使用循环填充html表。但是不知道如何在php中完成。我在网上搜索过。我不想使用" json"而是尝试使用" mysqli"请指导我?

1 个答案:

答案 0 :(得分:0)

您可以将.map()$(function() { $('#create').change(function() { createTable($(this).val(), $('#tblBdy')) }); function createTable(data, tbl) { var bdy = $.map(data.split(','), function(tr, i) { return $('<tr></tr>').html( $.map(tr.split('-'), function(td, i) { return $('<td></td>').html(td); }) ); }); tbl.html(bdy); } $('#tblBdy').on('click', 'tr', function() { var tableData2 = $(this).closest("tr").children("td").map(function() { return $(this).text(); }); $('#bx1txt').val($.trim(tableData2[0])); $('#bx2txt').val($.trim(tableData2[1])); }); });结合使用来实现此目的:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="create">
  <option value="">Select one</option>
  <option value="6-5.00-2013-2014,8-6.00-2013-2014,10-7.00-2013-2014,12-8.00-2013-2014,16-9.00-2013-2014,20-10.00-2013-2014,24-11.00-2013-2014,30-12.00-2013-2014,36-13.00-2013-2014,48-14.00-2013-2014,60-15.00-2013-2014,61-16.00-2013-2014">first group</option>
  <option value="1-1.00-2013-2014,2-2.00-2013-2014,3-3.00-2013-2014,4-4.00-2013-2014,6-5.00-2013-2014,8-6.00-2013-2014,10-7.00-2013-2014,12-8.00-2013-2014,16-9.00-2013-2014,20-10.00-2013-2014,24-11.00-2013-2014,30-12.00-2013-2014,36-13.00-2013-2014,48-14.00-2013-2014,60-15.00-2013-2014,61-16.00-2013-2014">second group</option>
  <option value="3-3.00-2013-2014,4-4.00-2013-2014,6-5.00-2013-2014,8-6.00-2013-2014,10-7.00-2013-2014,12-8.00-2013-2014,16-9.00-2013-2014,20-10.00-2013-2014,24-11.00-2013-2014">third group</option>
  <input type="text" id="bx1txt" value="" />
  <input type="text" id="bx2txt" value="" />
</select>
<br>
<br>
<table border="1">
  <thead>
    <tr>
      <th>Quantity</th>
      <th>Price</th>
      <th>Start</th>
      <th>End</th>
    </tr>
  </thead>
  <tbody id="tblBdy"></tbody>
</table>
var linkNode = image.GetPropertyValue("imgLinkNode" + model._lang.ToUpper());
if (linkNode is string)
{
    string id = linkNode;
    linkNode = model.NodeById(id);
}
var linkNodeUrl = linkNode.Url;