Codeigniter/jQuery：将值从选择下拉列表中提取到数据表中时出现问题

Question

我有一个从数据库中获取值的下拉框和一个按钮，当单击该按钮时，下拉框中的产品应在数据表中显示产品的详细信息。到目前为止，当我单击按钮将产品添加到数据表中时，没有任何反应。我将发布我的 MVC 和 jQuery 代码。

型号：

    public function getProductById($product_id){
    $query_product = $this->db->query("SELECT * FROM products WHERE id='".$product_id."'");
    return $query_product->result();
}

控制器：

public function getProduct () {
    $prod_id = $this->input->post('pid');
    $this->load->model('order_m');
    $prod = $this->order_m->getProductById($prod_id);
    echo json_encode($prod);} 

查看：

            <form > 
         <label>Select product</label>
            <select name="selectproduct" id="selectproduct">
                <option>Select a Product</option>
                <?php foreach ( $paid_products as $product ) { ?>
                <option value="<?php echo $product->product_id ?>"><?php echo $product->name; ?></option>
                <?php } ?>
            </select>
         <input type="button" class="btn btn-success" id="selectProduct" value="Add product to order">
        </form> 

<div class="container-fluid">
            <table class="display" border="1" cellspacing="0" width="100%">
            <thead>
            <tr>
            <th style="width:25%;" >Product</th>
            <th style="width:25%;" >Sales Price</th>
            <th style="width:25%;" >Qty</th>
            <th style="width:25%;">Total</th>
            </tr>
            </thead><tbody></tbody></table>

JS：

<script>
$(document).ready(function() {
$('table.container-fluid').dataTable({
    "processing": true,
    "serverSide": true,
    "ajax": {
        "url": "agent/order/getProduct",
        "data": {"pid": product_id}
    },
    });
$('#selectProduct').click(function() {
    var id = this.value;
    var product = ('agent/order/getProduct'+id);
    table.ajax.url(product).load();
    table.reload();
    });
</script>

如果有人能帮我解决这个问题，我将不胜感激。谢谢

编辑： 根据 Praveen Kumar 的观点进行编辑。

Answer 1

只需对代码进行两处更改：

替换

<option><?php echo $product->name; ?></option>

有

<option value="<?php echo $product->id; ?>"><?php echo $product->name; ?></option>

和

<script>
$(document).ready(function() {
var product_id = '<?php echo $product->product_id; ?>';
$('table.container-fluid').dataTable({
    "processing": true,
    "serverSide": true,
    "ajax": {
        "url": "agent/order/getProduct",
        "data": {"pid": product_id}
    },
    });
$('#selectProduct').click(function() {
    var id = $("#selectproduct").val();
    var product = ('agent/order/getProduct/'+id);
    table.ajax.url(product).load();
    table.reload();
    });
</script>