Ajax模式:将选定的值返回到下拉列表到更新表单

时间:2018-05-16 08:45:13

标签: php jquery sql ajax modal-dialog

我一直在这个网站上搜索并尝试了很多解决方案,但没有一个对我有用!我的问题如下:

我有两张桌子:

TABLE INFO_STATUS (status_id, status_desc)

TABLE INFO_MARQUES (comp_id, comp_desc, comp_status(INT))

我正在关联comp_statusstatus_id,以便INFO_MARQUES中的行获取当前状态。

我想做什么? (从这里编辑)
2。在我打开更新表单时,获取位于下拉列表中自动选择的info_marquescomp_status的当前状态值

示例我想更新此公司:

comp_id : 15
comp_desc : WEISS
comp_status : 1

假设在表info_status中:

status_id = 1
status_desc = FOLLOW-UP

当我打开更新表单时,我想看到这个: Check this

我的模态:(工作)

                        <select class="form-control" name="select_status">
                        <option value=''>Selectionner</option>
                    <?php 
try {
                    $user = new USER();
                    $output = array();
                    $stmt = $user->runQuery("SELECT * FROM info_status");
                    $stmt->execute();
                    $result=$stmt->fetchAll();

                    foreach($result as $row) {
                        echo '<option value='.$row["status_id"].'>'.$row["status_desc"].'</option>';
                    }
}
                    catch(PDOException $e) {
                    printf('Erreur MySQL %d : %s', $e->getCode(), $e->errorInfo[2]);
                    exit;

}
?>
                    </select>

我的Ajax

$(document).on('click', '.update', function(){ 
        var user_id = $(this).attr("id");
        var array = [];
        $('select :selected').each(function(i,value)
        {
        array[i] = $(this).val();
        });     
        $.ajax({
            url:"partials/test/fetch_single.php",
            method:"POST",
            data:{user_id:user_id},
            dataType:"json",
            success:function(data)
            {
                $('#userModal').modal('show');
                $('#comp_name').val(data.comp_name);
                $('#comp_parent').val(data.comp_parent);

                $.each($('.select_status option'),function(a,b){

                if($(this).val()== data.comp_status){   
                $(this).attr('selected',true)
                }

                });

                $('.modal-title').text("Modifier un fichier client");
                $('#user_id').val(user_id);
                $('#user_uploaded_image').html(data.user_image);
                $('#action').val("Edit");
                $('#operation').val("Edit");

            }

        })
    });

然后是我的PHP页面:(工作)

if(isset($_POST["user_id"]))
{
    $output = array();
    $statement = $connection->prepare(
        "SELECT * 
FROM info_marques AS m 
LEFT JOIN info_status AS s 
ON s.status_id = m.comp_status 
WHERE m.id = '".$_POST["user_id"]."' 
LIMIT 1"
    );
    $statement->execute();
    $result = $statement->fetchAll();
    foreach($result as $row)
    {
        $output["comp_name"] = $row["comp_name"];
        $output["comp_parent"] = $row["comp_parent"];
        $output["comp_status"] = $row["status_desc"];

    }

    echo json_encode($output);
}

我在这里缺少什么?

干杯

2 个答案:

答案 0 :(得分:0)

我不确定您是否要填充下拉列表或根据您的回复选择数据,但是如果您想要选择数据并且您已经有下拉选项,则可以执行以下操作:

 $.each($('#select_status option'),function(a,b){

    if($(this).val() == data.comp_status){
              $(this).attr('selected',true)
    }

    });

但是如果要填充,则必须使用.append()附加它。如果问题不同,请告诉我,我可以给你一个解决方案。

正如您所说,您需要所有状态,然后显示当前状态。我建议的是使用ajax的.done()方法。它会派上用场,比如:

$("#select_status").prop('disabled',true)
$('#select_id').append('<option>Please wait... Fetching status</option>');
var status_options;
$.ajax({
 url:"your_page_for_all_status.php",
 success: function(e){
    //add <option> tags to a variable using loop
 }

}).done(function(){
 $.ajax({
   //ajax call to get current data. Compare and select data here. write your $.each here
  }).done(function(){
     $("#select_status").prop('disabled',false);
  });
});

你现在应该好好去!如果我把它变得复杂,我很抱歉。

答案 1 :(得分:0)

我找到了一个有效的解决方案,但不确定它是否非常干净。

对于有兴趣知道的人:

<强> HTML

$(document).on('click', '.update', function(){
        var user_id = $(this).attr("id");   
        $.ajax({
            url:"partials/test/fetch_single.php",
            method:"POST",
            data:{user_id:user_id},
            dataType:"json",
            success:function(data)
            {
                $('#userModal').modal('show');
                $('#comp_name').val(data.comp_name);
                $('#comp_parent').val(data.comp_parent);
                $('#status').val(data.select_status);

我们将表格中的所有选项列入下拉列表

<强> AJAX

        $('.modal-title').text("Modifier un fichier client");
        $('#user_id').val(user_id);
        $('#user_uploaded_image').html(data.user_image);
        $('#action').val("Edit");
        $('#operation').val("Edit");

    }

})
  • 从PHP页面获取正确的值并发送到下拉列表,以便在打开表单时选择此值(问题在这里)

    if(isset($_POST["user_id"]))
    {
        $output = array();
        $statement = $connection->prepare(
            "SELECT * 
    FROM info_marques AS m 
    LEFT JOIN info_status AS s 
    ON s.status_id = m.comp_status 
    WHERE m.id = '".$_POST["user_id"]."' 
    LIMIT 1"
        );
        $statement->execute();
        $result = $statement->fetchAll();
        foreach($result as $row)
        {
            $output["comp_name"] = $row["comp_name"];
            $output["comp_parent"] = $row["comp_parent"];
            $output["status"] = $row["status_id"]; 
    

    });

<强> PHP

    }

    echo json_encode($output);
}

我们返回匹配值

var customImages: [UIImage] = []