更改动态生成的下拉列表的所选值 [英] change selected value of dynamically generated dropdown list

问题描述

 < table BORDER = 4 BORDERCOLOR = ORANGE width =300px> 
< tr> 
< td>型号：< / td> 
< td>< select name =modelid =model> 
< c：forEach items =$ {model_list}var =item> 
< option value =$ {item.modelId}> $ {item.modelName}< / option> 
< / c：forEach> 
< / select>< / td> 
< / tr> 
< / table> 
  

我只想根据我从这里获得的另一个值更改这些下拉菜单的选定值：

 < table BORDER = 4 BORDERCOLOR = ORANGE width =120pxid =product_table> 
< c：forEach items =$ {product_list}var =car> 
< tr> 
< td>< INPUT type =checkboxname =chk_groupvalue =$ {car.carId}/>< / td> 
< td>< c：out value =$ {car.carId}/>< / td> 
< td>< c：out value =$ {car.model.modelName}/>< / td> 
< td>< c：out value =$ {car.model.modelId}/>< / td> 
 
< / table> 
  

这里是脚本：

  function findRowNumber（）{
 var rowIdx; 
 var rowData = new Array（）; 
 var table = document.getElementById（'product_table'）; 
 var rows = table.getElementsByTagName（'tr'）; 
 var selectedRow; 
 for（var i = 0; i< rows.length; i ++）{
 rows [i] .onclick = function（）{
 rowIdx = this.rowIndex; 
 selectedRow = rows [rowIdx]; 
 document.getElementById（'model'）。value = selectedRow.cells [3] .innerHTML; 
 
} 
} 
} 
  

注意： selectedRow.cells [3] .innerHTML 返回3，但值不改变。

解决方案

我没有看到您的HTML中的任何内容，其ID为 model 。您是否意味着输入的名称 模型也可以将其作为ID？

$ b $我也注意到你的第二张表中没有结尾的< / tr>

Don不要使用 var rowData = new Array（）; 使用文字符号： var rowData = []; p>

添加id后，添加一对< tr> ，它对我很好：

http://jsfiddle.net/FJfZK/

请注意，调试JavaScript问题时，您渲染的HTML输出非常更有帮助。我们通常不关心您的服务器正在做什么，当它是一个DOM操作问题。

I have a dynamic drop down list generated in a JSP page as follow:

<table BORDER=4 BORDERCOLOR=ORANGE width="300px">
    <tr>
        <td>Model:</td>
        <td><select name="model" id="model">
            <c:forEach items="${model_list}" var="item">
                <option value="${item.modelId}">${item.modelName}</option>
            </c:forEach>
        </select></td>
    </tr>
</table>

I just want to change the selected value of these drop down based on another value that I get from here:

<table BORDER=4 BORDERCOLOR=ORANGE width="120px" id="product_table">
<c:forEach items="${product_list}" var="car">
    <tr>
        <td><INPUT type="checkbox" name="chk_group" value="${car.carId}" /></td>
        <td><c:out value="${car.carId}" /></td>
        <td><c:out value="${car.model.modelName}" /></td>
        <td><c:out value="${car.model.modelId}" /></td>

</table> 

And here's the script:

function findRowNumber() {
    var rowIdx;
    var rowData = new Array();
    var table = document.getElementById('product_table');
    var rows = table.getElementsByTagName('tr');
    var selectedRow;
    for ( var i = 0; i < rows.length; i++) {
        rows[i].onclick = function() {
            rowIdx = this.rowIndex;
            selectedRow = rows[rowIdx];
            document.getElementById('model').value = selectedRow.cells[3].innerHTML;

        }
    }
}

Note: selectedRow.cells[3].innerHTML returns 3 but the value doesn't change.

解决方案

I don't see anything in your HTML with an id of model. Did you mean for the input with a name of model to also have that as an id?

I also notice there is no ending </tr> in your second table.

Don't use var rowData = new Array(); use literal notation: var rowData = [];.

After adding on the id, adding a couple <tr>s, it worked for me fine:

http://jsfiddle.net/FJfZK/

Note, that your rendered HTML output is much more helpful when debugging a JavaScript issue. We generally don't care what your server is doing, when it is a DOM manipulation issue.

这篇关于更改动态生成的下拉列表的所选值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！