【问题标题】:Html table + JSON response + select boxHtml 表格 + JSON 响应 + 选择框
【发布时间】:2014-01-15 12:29:31
【问题描述】:

下面是我的选择框

<select id="ProductCode" style="border: 1px solid #CCCCCC; border-radius: 4px 4px 4px 4px;" name="ProductCode">
   <option value="1">Product Description 1 - Box</option>
   <option value="2">Product Description 2 - Carton</option>
   <option value="3">Product Description 3 - Bottle</option>
   <option value="4">Product Description 4 - Cylinder</option>
</select>

我有一个表,我需要用 JSON 响应填充它 下面是Json

[{"RQST_KEY":"1844","EFT_RQST_ID":"1845","EFT_CODE":null,"EFT_DATE":"14-JAN-14","EXPECTED_DATE":"07-JAN-14","EFT_REQUESTOR":"Tecnics2","EFT_STATUS":"NEW","EFT_SUPPLIER":"Tecnics2","DELIVERY_LOCN":"1","REMARKS":"kk","APPROVE_FLAG":null,"LINE_NUMBER":"1846","PRODUCT_CODE":"2","UOM":null,"ORDER_QTY":"90"}]

一切都很好,我可以从 JSON 中获取 Product Code 的值为“2”,这是我选择框中的第二个选项。如果我将它插入到我的表格中,它显然会显示为“2”,但我需要在表格单元格中插入文本“产品描述 2 - 纸箱”。

JS

for (var i=0; i<result.length ;i++) {

                html += '<tr id="tr-'+tblcounter+'"><td>'
                           + result[i].PRODUCT_CODE
                           + '</td><td class="class1">'
                           + result[i].ORDER_QTY
                           + '</td><td><a href="#" onClick="editRow(this);"><img src="<?php echo $this->baseUrl(); ?>/images/edit_icon.jpg" height="20px" width="20px"></a>'
                           + '</td><td><a href="#" onClick="deleteRow(this);"><img src="<?php echo $this->baseUrl(); ?>/images/delete_icon.jpg" height="16px" width="16px"></a>'
                           + '</td></tr>';
                   tblcounter++;
              }

              $('#rqstLines').append(html);

result 是 AJAX 调用的响应。那么如何将选项文本从 JSON 响应插入到 td 中。谢谢

【问题讨论】:

  • 是否可以硬编码“产品描述 +result[i].PRODUCT_CODE+ - 纸箱”。否则需要搜索其他方法。

标签: jquery html json


【解决方案1】:

你会从你的选择框中按值获取文本,如下所示:

$("#ProductCode option[value=2]").text();

所以您的最终代码将如下所示:

var selectValue = $("#ProductCode option[value=" + result[i].PRODUCT_CODE + "]").text();
html += '<tr id="tr-'+tblcounter+'"><td>'
           + selectValue 
           + '</td><td class="class1">'
           + result[i].ORDER_QTY
           + '</td><td><a href="#" onClick="editRow(this);"><img src="<?php echo $this->baseUrl(); ?>/images/edit_icon.jpg" height="20px" width="20px"></a>'
           + '</td><td><a href="#" onClick="deleteRow(this);"><img src="<?php echo $this->baseUrl(); ?>/images/delete_icon.jpg" height="16px" width="16px"></a>'
           + '</td></tr>';

更新:Fiddle Added to prove out code concept

【讨论】:

  • 它返回空字符串作为选项值
  • 我的jquery版本是1.7.2
  • jsfiddle.net/RX4EZ/3 在要查看其值的框中键入数字。这表明如果您传递正确的数字,它将返回正确的值
猜你喜欢
  • 2017-08-26
  • 2018-05-22
  • 2015-09-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-03-04
  • 2013-08-28
  • 1970-01-01
相关资源
最近更新 更多