Question

我有一个项目列表（来自后端数据库），它是使用.jsp文件中的Struts迭代器动态填充的。该文件还具有JavaScript函数，用于将新项目插入数据库。但在我进行插入之前，我需要检查项目ID（这是一个唯一键）是否已经存在。我尝试过这样的事情：

item.jsp

<s:form name="ItemForm" id="ItemForm" action="Item.action">
    <table>
      <tbody>
        <s:iterator value="itemForm.allItems">
          <tr class="pointer" align="left">
            <td align="left"><s:property value="itemID" /></td>
            <td align="left"><s:property value="itemName" /></td>
          </tr>
        </s:iterator>
      </tbody>
    </table>

    <label>Item ID</label>
    <s:textfield name="itemForm.itemID" id="itemID"/>

    <label>Item Name</label>
    <s:textfield name="itemForm.itemName" id="itemName"/>

    <button type="button" id="insertBtn" onclick="insertItem()">Add New Item</button>
</s:form>

<script>
function insertItem() {
    // check if item already exist
    var inputID = document.getElementById("itemID").value;
    var allItems = $("#itemForm.allItems"); // doesn't work - allItems remain undefined
    for (var item in allItems) {
        if (item["itemID"] == inputID) {
            alert("Item ID already exist");
            return; // exit if already exist
        }
    }


// code to insert item

}
</script>

如何使用struts迭代器遍历JavaScript中的项目列表？如果那不可能，那么在JS级别上推荐的方法是什么？

修改

我还根据建议尝试了以下内容。

        var inputID = document.getElementById("itemID").value;

        // Get all itemIDs and look for a match
        var matchingElement = $("#itemForm\\.allItems tr td:first-child").filter(function() {
            return this.textContent.trim.value() = inputID; // returns an array of matching values
        });

        console.log("matchingElement length: " + matchingElement.length);

        if (matchingElement.length > 0) {
            alert("Item ID already exist");
            return; // exit if already exist
        }

无论我输入什么itemID，它总是返回一个空数组（length = 0）。我在没有.filter()的情况下尝试了它并且仍然得到了相同的结果，这使我相信问题在于获得实际列表（即我原来的相同问题），而不是过滤器。

var matchingElement = $("#itemForm\\.allItems tr td:first-child");

以下是生成的html示例。道歉，如果它没有太大帮助。我必须省略并掩盖很多与我工作有关的东西。

            <table class="table table-striped jambo_table bulk_action" id="searchResults">
            <caption>Search Results</caption>
            <thead>
              <tr class="headings">
                <th align="left" class="column-title"><a class="sort" href="javascript:sortItem('itemID')">Item ID</th>
                <th align="left" class="column-title"><a class="sort" href="javascript:sortItem('itemName')">Item Name</th>
              </tr>
            </thead>
            <tbody>
                <tr class="pointer" align="left">
                  <td align="left">BT </td>
                  <td align="left">Item BT</td>
                </tr>   
                <tr class="pointer" align="left">
                  <td align="left">CLM</td>
                  <td align="left">Item CLM</td>
                </tr>   
                <tr class="pointer" align="left">
                  <td align="left">CR </td>
                  <td align="left">Item CR</td>
                </tr>   
                <tr class="pointer" align="left">
                  <td align="left">FA </td>
                  <td align="left">Item FA</td>
                </tr>   
                <tr class="pointer" align="left">
                  <td align="left">HN </td>
                  <td align="left">Item HN</td>
                </tr>   
                <tr class="pointer" align="left">
                  <td align="left">LA  </td>
                  <td align="left">Item LA</td>
                </tr>   
            </tbody>
            </table>

Answer 1

You may want to try this:

function insertItem() {
    // check if item already exist
    var inputID = document.getElementById("itemID").value;
    $("#searchResults tbody tr td:first-child").each( function( index){
    alert( $(this).text().trim() );
    if ( $(this).text().trim() == inputID) {
        alert("Item ID already exist");
        return; // exit if already exist
    }
    });
// code to insert item
}

Or you can access your allItems using :

var allItems = "<s:property value='itemForm.allItems'/>"

在JavaScript中循环Struts迭代器

1 个答案: