Question

我不确定标题的解释是否完美。

我有2个选择标签，并且两个选择标签数据都来自同一张表，

第一个选择标记-我正在从存储位置名称的数据库中获取数据=>这非常有效，并且我在数据库中有3个位置名称。

<select name="location" class="form-label" id="location" required>
   <option value="">Select Dojo Location</option>
   <?php foreach ($location as $row): ?>
       <option value="<?php echo $row->id; ?>"><?php echo $row->location; ?></option>
   <?php endforeach; ?>
</select>

用于首次选择标签的图像

第二个选择标签-我从同一张表的不同列中获取价格，但它显示了来自不同位置的每个价格。

<select name="month" class="form-label" id="month" required>
   <option value="">Select Fees Period</option>
   <?php foreach ($location as $row1): ?>
      <option value="<?php echo $row1->admission_fee_1; ?>">Monthly</option>
      <option value="<?php echo $row1->admission_fee_1; ?>">Quarterly</option>
      <option value="<?php echo $row1->admission_fee_6; ?>">Half Yearly</option>
      <option value="<?php echo $row1->admission_fee_12; ?>">Annually</option>
   <?php endforeach; ?>
<?php endif; ?>

第二个选择标记的图像

表数据的图像

我想做的是，当用户在1个select标签中选择位置时，它只在第二个select标签中显示了数据库中该所选位置的价格。

这就是我得到的结果

但是我还没有成功，任何解决方案都是有帮助的，或者有其他方法可以做到这一点，或者我做错了吗？

谢谢。

Answer 1

您必须使用JavaScript和onChange方法。它已经解决了很多次，例如how to change a selections options based on another select option selected?

Answer 2

您需要拨打一些ajax电话。

在选择第一个位置标签时；您可以拨打jQuery Ajax并仅获取所选位置的价格。在Ajax响应中，您可以接收第二个选择标记的HTML并替换为当前的一个。

如果您需要进一步的说明，请告诉我。

Answer 3

您需要动态获取数据。

类似这样的东西

$( "#location" ).change(function() {
    // this.value is your ID
    $.post('/endpoint/fetch-details/' + this.value)
     .done(function(data) {
          // load data into another SELECT
     })
     .fail(function() {
          alert( "error" );
     })       
});

在Codeigniter上，您可以具有一个返回JSON对象的控制器方法（/ endpoint / fetch-details/)。

Answer 4

成功完成...

Ajax函数=>

$(document).ready(function () {
    $('#location').on('change', function () {
        var location_id = $(this).val();

        if (location_id == '') {
            $('#fees').prop('disabled', true);
        } else {
            $('#fees').prop('disabled', false);
            $.ajax({
                url: "<?php echo $base_url;?>welcome/getFeePeriod",
                type: 'POST',
                data: {location: location_id},
                dataType: 'json',
                success: function (data) {
                    //alert("Ok");
                    $('#fees').html(data);
                },
                error: function () {
                    alert("Error Accured...");
                }
            });
        }
    });
});

控制器功能=>

public function getFeePeriod()
{
    $location_id = $this->input->post('location');
    $FeesPeriod = $this->admin_model->getFeePeriod($location_id);
    if (count($FeesPeriod)>0) {
        $fee_select_box = '';
        $fee_select_box .= '<option id="">Select Fee Period</option>';
        foreach ($FeesPeriod as $fees) {
        $fee_select_box .= '<option id="' . $fees->admission_fee_1 . '">Monthly</option>+
                            <option id="' . $fees->admission_fee_3 . '">Quarterly</option>+
                            <option id="' . $fees->admission_fee_6 . '">Half Yearly</option>+
                            <option id="' . $fees->admission_fee_12 . '">Yearly</option>';
        }
        echo json_encode($fee_select_box);
    }
}

模型函数=>

function getFeePeriod($location_id){
    $query = $this->db->get_where('location', array('id'=>$location_id));
    return $query->result();
}

感谢大家的回应...

如何根据所选的另一个选择选项更改选择选项的值？

4 个答案: