javascript—获取下拉列表值，然后将其插入表中的textbox，但不更改第二行

ghhkc1vu 于 2021-06-19 发布在 Mysql

关注(0)|答案(1)|浏览(246)

我试图得到一个下拉列表的值，然后将它插入到我的文本框，然后它将保存到数据库。数据来自数据库。问题是在我从下拉列表中选择数据，然后单击插入按钮之后；只有一个文本框已更改。另一行没有改变。当我点击第二行的插入按钮时，它会改变第一行的文本框。
javascript语言

function copyValue(id) {
    var dropboxvalue = document.getElementById('mydropbox').value;
    document.getElementById('mytextbox').value = dropboxvalue;
}

主页.php

<td align="center"><input type="submit" name="insert"  onclick="copyValue(<?php echo $r['so_id'] ?>)" class="btn btn-success" value="Insert" /></td>
      <td><input class="form-control" name="dar_numberr" id="mytextbox" type="text" required="required" placeholder="Delivery Date" value="<?php echo $r['dar_numberr'] ?>"></textarea></td>

下拉列表

<?php
            $databaseHost = "localhost"; 
            $databaseUser = "root";
            $databasePassword = "";
            $databaseName = "csl_otd";

            $con=mysql_connect($databaseHost ,$databaseUser ,$databasePassword )or die ('Connection Error');
            mysql_select_db("csl_otd",$con) or die ('Database Error');
         ?>
             <select name="dar_number" id="mydropbox" class="form-control"> 
             <option value=""> -----------Available DAR Number----------- </option> 
         <?php
            $dd_res=mysql_query("Select DISTINCT dar_number from dar");
            while($r=mysql_fetch_row($dd_res))
            { 
               echo "<option value='$r[0]'> $r[0] </option>";
            }
         ?>
            </select>

mysql php JavaScript

来源：https://stackoverflow.com/questions/52945025/getting-dropdown-value-then-inserting-it-to-textbox-inside-a-table-but-doesnt

1条答案

按热度按时间

inkz8wg91#

我的怀疑是，您只针对javascript中的一个特定id，并且可能对不同行中的多个输入使用相同的id。ID必须是唯一的。
因此，请尝试以下方法：

//change only the input in the same row by click on button
function copyValue(event) {
    var dropboxvalue = document.getElementById('mydropbox').value;
    event.target.parentElement.nextElementSibling.getElementsByTagName('input')[0].value = dropboxvalue;
  }

//change all inputs by click on button
  function updateAllRows() {
    var dropboxvalue = document.getElementById('mydropbox').value;
    var inputs = document.getElementsByClassName('mytextbox');
    for (var i = 0; i < inputs.length; ++i) {
      inputs[i].value = dropboxvalue;
    }
  }

<!-- example dropdown -->
<select id="mydropbox">
  <option>myOption</option>
  <option>myOtherOption</option>
</select>

<!-- example if you want to update all rows at once -->
<button onclick="updateAllRows()">
  Update all rows
</button>

<!-- example table -->
<table>

  <tr>
    <!-- here, add the event to your function call to access the exact button that was clicked -->
    <td><input type="submit" name="insert" onclick="copyValue(event)" class="btn btn-success" value="Insert" /></td>

    <!-- here, change id to class - if you use it somewhere, css or something similar, use '.' instead of '#' -->
    <td><input class="form-control mytextbox" name="dar_numberr" type="text" required="required" placeholder="Delivery Date" value="myNumber" /></td>
  </tr>
  <tr>
    <!-- second row -->
    <td><input type="submit" name="insert" onclick="copyValue(event)" class="btn btn-success" value="Insert" /></td>
    <td><input class="form-control mytextbox" name="dar_numberr" type="text" required="required" placeholder="Delivery Date" value="myNumber" /></td>
  </tr>

</table>

https://jsfiddle.net/ba91jpxf/

赞(0）回复(0）举报 2021-06-19

我来回答

javascript—获取下拉列表值，然后将其插入表中的textbox，但不更改第二行

1条答案

相关问题

热门标签

最新问答