如何使用jstl生成动态复选框值

时间:2013-07-04 08:44:41

标签: html jstl

此代码有一些可能从@COntroller填充的值,我只想选择一个复选框,该行将转换为文本框。通过使用此代码,只有第一行更改为文本框。

<table border=2>
<th>ID</th><th>Status</th><th>test</th><th>Name</th><th><input type="button"  name="edit"      value="Edit"    onclick="setEditable(this)">    </th>

 <c:forEach items="${Data}" var="data">
 <tr> <td>
 <input type="text"  disabled="disabled"  id="idc"   value="  ${data.ID}">   </td>
 <td><input type="text"  disabled="disabled"  id="status"   value="${data.status}"></td>
 <td><input type="text"  disabled="disabled"  id="test"   value="${data.test}"></td>
 <td><input type="text"  disabled="disabled"  id="name"   value="${data.Name}"></td>
 <td><input type="checkbox" name="Rowselect"   onclick="setEditable(this)" ></td>
 </tr>
  </c:forEach>
  </table>

  <script type="text/javascript">
  function setEditable()
  {
         document.getElementById("idc").disabled = false;
         document.getElementById("status").disabled = false;
         document.getElementById("test").disabled = false;
         document.getElementById("name").disabled = false;
          alert("after the remove");
     }
  </script>

1 个答案:

答案 0 :(得分:0)

<table border=2>
    <th>ID</th>
    <th>Status</th>
    <th>Test</th>
    <th>Name</th>
    <th>Select</th>
    <c:forEach items="${Data}" var="data" varStatus="stCount" begin="0"
        end="${Data.size()}">
        <tr>
            <td><input type="text" disabled="disabled"
                id="itc${stCount.count}" value="  ${data.ID}"></td>
            <td><input type="text" disabled="disabled"
                id="status${stCount.count}" value="${data.status}"></td>
            <td><input type="text" disabled="disabled"
                id="test${stCount.count}" value="${data.test}"></td>
            <td><input type="text" disabled="disabled"
                id="name${stCount.count}" value="${data.Name}"></td>
            <td><input type="checkbox" id="selectCheck" name="Rowselect"
                onclick="setEditable('${stCount.count}',this)"></td>
        </tr>
    </c:forEach>
</table>

<script type="text/javascript">
    function setEditable(stCount, event) {

        if (event.checked) {
            document.getElementById("idc" + stCount).disabled = false;
            document.getElementById("status" + stCount).disabled = false;
            document.getElementById("test" + stCount).disabled = false;
            document.getElementById("name" + stCount).disabled = false;
        } else {
            document.getElementById("itc" + stCount).disabled = true;
            document.getElementById("status" + stCount).disabled = true;
            document.getElementById("test" + stCount).disabled = true;
            document.getElementById("name" + stCount).disabled = true;
        }
    }
</script>