Question

<strong>Type Of Party</strong>
<select name="p_name">
    <?php 
        $sql = mysqli_query($con, "SELECT * FROM party");
        while ($row = $sql->fetch_array()){

            echo '<option value="'.$row['type_party'].'">'.$row['type_party'].'</option>';  
        }
    ?>
    </select>


<p>
    <strong>Max No. Of Children</strong>
    <input type="text" id="txt" name="nocc" placeholder="Type Your children" required="required" />
</p>

我想在文本字段中检索数据，并使用我在droplist中选择的选项的相应数据。在我的表格中：我有id，Type_party，capacity，当我在下拉列表中选择type_party时，我希望在文本字段中收到capacity。请帮帮我。

Answer 1

鉴于，您使用jQuery，这可以通过将容量存储在数据属性中轻松实现。

<strong>Type Of Party</strong>
<select name="p_name" >
<?php 
$sql = mysqli_query($con, "SELECT * FROM party");
while ($row = $sql->fetch_array()){

echo '<option value="'.$row['type_party'].'" data-capacity="' . $row['capacity'] . '">'.$row['type_party'].'</option>';  
}
?>
</select>


<p>
<strong>Max No. Of Children</strong>
<input type="text" id="txt" name="nocc" placeholder="Type Your children" required="required" />
</p>

使用以下javascript代码

$('select[name="p_name"]').on('change', function() {
    $('#txt').val($(':selected', this).data('capacity'));
});

Answer 2

试试这个简单的JavaScript

您需要为每个选项添加capacity data-capacity属性
然后使用onchange功能选择
最后匹配selecIndex，然后使用dataset

data-capacity

<强>的JavaScript

 function getvalue(that) {
      documenyt.getElementById('txt').innerHTML = that.options[that.selectedIndex].dataset.capacity
    }

<强> PHP

    <strong>Type Of Party</strong>
    <select name="p_name" onchange="getvalue(this)">
    <?php 
    $sql = mysqli_query($con, "SELECT * FROM party");
    while ($row = $sql->fetch_array()){

    echo '<option value="'.$row['type_party'].'" data-capacity="'.$row['capacity'].'">'.$row['type_party'].'</option>';  
    }
    ?>
    </select>


    <p>
      <strong>Max No. Of Children</strong>
      <input type="text" id="txt" name="nocc" placeholder="Type Your children" required="required" />
    </p>

当我在droplist中选择一个选项时，如何将数据检索到文本字段中

2 个答案: