从数据列表中获取 id

Question

我需要帮助，因为我需要转换它：

<select name="productId">
       <option value=""></option>
       <c:forEach items="${productsBeanId.activeProductsList}" var="product">                    
                <option value="${product.productId}">${product.productName}</option>
       </c:forEach>
 </select>

关于它：

<input list="productId">
      <datalist id="productId">
          <c:forEach items="${productsBeanId.activeProductsList}" var="product">                    
              <option value="${product.productId}">${product.productName}</option>
          </c:forEach>                  
      </datalist>

我需要让 productId 在数据库上使用它，创建一个产品。

<option value="${product.productId}">${product.productName}</option> 这行对我来说是个问题，因为我需要保存 productId，但要在列表中显示 productName，以便于查找。

你能帮帮我吗？

Answer 1

试试这个

var selectObj = document.getElementById( "productId" );
var innerHTMLSelect = selectObj.innerHTML; //first save the innerHTML of select 
var selectParent = selectObj.parentNode();
selectParent.removeNode(selectObj); //remove current select element

selectParent += '<input list="productId"><datalist id="productId"></datalist>'; //append the data list to the parent
document.getElementById( "productId" ).innerHTML = innerHTMLSelect ; //put the saved innerHTML to the current data list element