选择选项后在另一个表单上显示数据

Question

如何，在我选择选项后，它会出现#formid，其中表格由选项部分中选择的$stock填写

<div class="form-group">
    <label for="exampleFormControlSelect1">Nama Item</label>
    <select class="form-control" id="exampleFormControlSelect1" name="itemId">
      <option selected>Choose</option>

      <?php $no=1; while($row = $result->fetch_object() ) {
        $stock  = $row->stock;
        $i_name = $row->i_name;
        $id     = $row->id;
        ?>

      <option value="<?php echo $id; ?>"><?php echo $i_name; ?></option>

      <?php } ?>

    </select>
</div>      

选择选项后会出现的表格

<div class="form-group">
    <label>Stock</label>
    <input class="" type="number" name="" value="<?php echo $stock;?>">
</div>

我是 php 和 javascript 的新手，你能用简洁的代码和易于理解的方式编写吗，谢谢 :)

Answer 1

如果我理解正确，您希望显示第一个的第二个 div onSelect。

因为我假设你使用引导程序 你已经包含了 jQuery，如果没有，你必须在这个例子中这样做。

你必须在你的页面上添加这个 JavaScript。

<script>
 $( document ).ready(function() {
  $( "#exampleFormControlSelect1" ).change(function() {
    $("#secondDiv").show();
  });
 });

</script>

你的 div 上需要一个 id。

<div id="secondDiv" class="form-group">
    <label>Stock</label>
    <input class="" type="number" name="" value="<?php echo $stock;?>">
</div>

Answer 2

如果您希望在不重新加载页面的情况下显示数据，则需要 javascript。 首先，我们制作 Javascript 函数，它接受您的选项 id 并将其传递给您的输入值。

funcction chooseOption(clicked.id){
document.getElementById('myInput').value = clicked_id;
}

HTML 和 PHP 我们需要为每个选项添加不同的 id。传递您想要的每个选项名称的最佳方式。我们还在选项中添加了 onclick 功能。

<div class="form-group">
<label for="exampleFormControlSelect1">Nama Item</label>
<select class="form-control" id="exampleFormControlSelect1" name="itemId">
  <option selected>Choose</option>

  <?php $no=1; while($row = $result->fetch_object() ) {
    $stock  = $row->stock;
    $i_name = $row->i_name;
    $id     = $row->id;


 echo "<option onclick=\"chooseOption(this.id);\" id=\"".$stock."\" value=\"".$id."\">".$i_name."</option>";

  <?php } ?>

</select>
</div>      

在您的输入中添加了一个 id，以便 javascript 可以将数据发送给它。

<div class="form-group">
<label>Stock</label>
<input id="myInput" class="" type="number" name="" value="">
</div>