javascript - 复制网格中的第一行

Question

只是想问是否可以复制网格中行的第一个值？ 例如。我有两列。 A、B值分别为。如果我在第一行的 B 列中输入任何值。它应该填满所有剩余的行。

**Serial**   **CartNum**   Output **CartNum**
    1             1                    1
    2                                  1
    3                                  1
    4                                  1

这可能吗？我认为我正在使用 ASP.NET(VB)、javascript？

这是我的网格代码。

<div class="Scrolls">
  <asp:DataGrid runat="server" ID="dgSerial" AutoGenerateColumns="false" ShowFooter="false" ShowHeader="false" GridLines="None" DataKeyField="BaseLineNum" AlternatingItemStyle-CssClass="AlternateGrid">
    <Columns>
      <asp:TemplateColumn>
        <ItemTemplate>
          <table border="0" style="border-bottom: 1px dotted; border-color: #FF0000">
            <tr>
              <td style="width: 20px;">
                <asp:CheckBox runat="server" ID="chkSelect"></asp:CheckBox>
              </td>
              <td style="width: 120px;">
                <asp:TextBox Width="120" ID="SerialNum" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "SerialNum")%>' />
              </td>
              <td style="width: 120px;">
                <asp:TextBox Width="120" ID="CartNum" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "CartNum")%>' />
              </td>
            </tr>
          </table>
        </ItemTemplate>
      </asp:TemplateColumn>
    </Columns>
  </asp:DataGrid>
</div>

希望听到积极的回应。

Answer 1

您必须按上述方式编辑第二行模板:

<asp:TextBox Width="120" ID="CartNum" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "CartNum")%>'
  onchange="javascript: copy();" CssClass="row2"/>

然后添加 Javascript 魔法:

<script type="text/javascript">
  function copy() {
    var cells = document.getElementsByClassName("row2");
    for(var i = 1; i < cells.length; i++)
      cells[i].value = cells[0].value;
  }
</script>

我现在无法对此进行测试，因此我不确定它是否能正常工作，但我确信经过一些修改就可以。

请注意，javascript 代码始终从列的第一个单元格 (cells[0]) 中获取值，因为在您的问题中这就是您所要求的。