如何获取 HTML 表格值并分配给选择和输入文本字段？

Question

我希望你们一切都好，我一直面临着将数据从 HTML 表中获取到选择框的问题。

我正在使用 Php MySQLi 和 Ajax 使用 Jquery 来执行插入、更新、删除和查看等操作。我完成了插入和在表格上显示数据等两个过程，但是我无法获取 HTML 表格并无法在 HTML 标签选择框中进行分配。

我使用外键引用在类别和产品表之间建立关系。我想从产品表中获取 Category_Name 并将选定的 category_name 分配给 HTML 选择框。

这里是 PHP 函数

 // Get Product Data
       function get_product_record()
       {
        global $con;
        $Pro_Update_Id = $_POST['Pro_Update_ID'];
        $query = "select * from product where Product_ID='$Pro_Update_Id'";
        $result = mysqli_query($con,$query);

        while($row=mysqli_fetch_assoc($result))
        {
            $data = "";
            $data[0]=$row['Product_ID'];
            $data[1]=$row['Category_ID'];
            $data[2]=$row['Product_Name'];
            $data[3]=$row['Product_Qty'];
            $data[4]=$row['Price'];
            $data[5]=$row['Description'];
        }
            echo json_encode($data);
       }

这里是 jQuery 文件

function get_pro_record()
{
    $(document).on('click','#p_btn_edit',function()
    {
        var GetPID = $(this).attr('data-id');
        
        $.ajax(
            {
                url: 'includes/products/get_pro_record.php',
                method: 'post',
                data:{Pro_Update_ID:GetPID},
                dataType: 'JSON',
                success:function(data)
                {
                    $('#product_id').val(data[0]);
                    $('#cat_up_id').val(data[1]);
                    $('#product_up_name').val(data[2]);
                    $('#up_Qty').val(data[3]);
                    $('#up_Price').val(data[4]);
                    $('#up_description').val(data[5]);
                    $('#products_update').modal('show');
                }
            })
    })
}

**这里是 HTML 表单 **

<form>
 <input type="hidden" id="product_id" class="form-control my-2" placeholder=" Product Name">
 <select name="cat_up_id"></select>
 <input type="text" id="product_up_name" class="form-control my-2" placeholder=" Product Name">
 <input type="text" id="up_Qty" class="form-control my-2" placeholder=" QTY">
 <input type="text" id="up_Price" class="form-control my-2" placeholder=" Price ">
 <textarea id="up_description" class="form-control" placeholder="Description"></textarea>
 </form>

我正在控制台屏幕中接收完整的数据，但我看不到 category_name 我正在接收 category_id。所以请告诉我我能做些什么来解决这个问题。

这是控制台中项目的输出 Project Output in Console

Answer 1

首先您需要使用内部联接从 Product 和 Category 表中查询数据库

$query = "select a.*, b.Category_Name from product a, category b where a.Category_Id = 
          b.Category_Id and Product_ID='$Pro_Update_Id'";

那么您需要为类别名称添加一个包含更多元素的 $data

 $data[6]=$row['Category_Name'];

那么你需要添加选项项来选择

 $('#cat_up_id').html('<option>' + data[6] + '</option>');    

并且，在选择标签中将属性 name="cat_up_id" 替换为 id="cat_up_id"

Answer 2

Sonal Bonkar 是正确的，您需要在此处进行表连接是一些更正在您的情况下，因为您需要将值作为 id 来存储在表中

$('#cat_up_id').html('<option value="'+ data[1] +'">' + data[6] + '</option>');