Question

您好我需要使用从数据库中获取的值填充下拉字段并将其显示为已选中，同时我希望显示从数据库中获取的选项列表，

一切正常，除了字段＆＃34;用户组＆＃34;这是我到目前为止所做的，有人可以帮帮我吗？非常感谢

Html文件

<div class="row">
    <div class="col-md-6">
        <div class="form-group">
            <label class="control-label">User Group
                       <span class="required"> * </span>
                      </label>
            <select class="form-control bs-select" id="userGroup" name="userPippo">

                      <?php 

                        $select_group_query="SELECT group_id, group_name FROM user_group";  
                        $run= mysqli_query($conn, $select_group_query);

                        while($row= mysqli_fetch_array($run)) {     

                            echo "<option value= '".$row['group_id']."' >" . $row['group_name'] . "</option>";

                        }

                      ?>  

                      </select>
        </div>
    </div>
</div>

Javascript文件

function GetUserDetail(id) {
    $("#EditUserModal").modal("show");
    $("#user_id").val(id);

    var user_id = $('#user_id').val();

    $.ajax({

        url: "../controllers/ctrl_admin_user_app/ctrl_admin_get_user_details.php",
        method: "POST",
        data: {
            user_id: user_id
        },
        dataType: "json",
        success: function(data) {
            console.log(data);
            $('#firstName').val(data.user_first);
            $('#lastName').val(data.user_last);
            $('#userEmail').val(data.user_email);
            $('#userTel').val(data.user_telephone);
            $('#userFiscalcode').val(data.user_fiscalcode);
            $('#userBirth').val(moment(data.user_birth).format('DD/MM/YYYY'));
            $('#userDocument').val(data.user_iddocument);
            $('#userRole').val(data.user_role);
            // ricarico il campo per falo funzionare con il plugin bs-select 
            $('#userRole').selectpicker('refresh');
            $('#userGroup').val(data.group_name); // doesn't work
            // make it work with bs-select 
            $('#userGroup').selectpicker('refresh');
            doesn 't  work

            $("#EditUserModal").modal("show");
        }
    });
}

PHP文件

 if (isset($_POST["user_id"])) {
      $userid = $_POST['user_id'];
      $user_id = filter_var($userid, FILTER_SANITIZE_NUMBER_INT);

      $query = "SELECT group_id, group_name, user_first, user_last, user_email, user_telephone, user_fiscalcode, user_birth, user_iddocument, user_role FROM user_group_join LEFT JOIN (user_group, users) ON (user_group_join . group_join_id = user_group . group_id AND user_group_join . user_join_id = users . user_id) WHERE user_join_id = ? ";

      $stmt = mysqli_prepare($conn, $query);
      mysqli_stmt_bind_param($stmt, "i", $user_id);
      mysqli_stmt_execute($stmt);
      $result = mysqli_stmt_get_result($stmt);
      $response = array();
      while ($row = mysqli_fetch_assoc($result)) {
      $response = $row;
  }
  echo json_encode($response);

}

Answer 1

来自文档，

.selectpicker('val');

您可以通过调用元素上的val方法来设置所选值。

$('.selectpicker').selectpicker('val', 'Mustard');
$('.selectpicker').selectpicker('val', ['Mustard','Relish']);

这与直接在select元素上调用val（）不同。如果直接在元素上调用val（），则bootstrap-select ui将不会刷新（因为更改事件仅从用户交互中触发）。你必须自己调用ui刷新方法。

.selectpicker('refresh');

要以编程方式使用JavaScript更新选择，请先操作select，然后使用refresh方法更新UI以匹配新状态。在删除或添加选项时，或通过JavaScript禁用/启用选择时，这是必需的。

$('.selectpicker').selectpicker('refresh');

所以，

替换这些行

$('#userGroup').val(data.group_name); // doesn't work
// make it work with bs-select 
$('#userGroup').selectpicker('refresh');

有了这一行，

 $('#userGroup').selectpicker('val', data.group_id).selectpicker('refresh');

使用ajax，php和mysql将数据加载到下拉列表中

1 个答案: