Question

我正在尝试为下拉框（动态）

进行ajax调用

当变量$place可用时，它将进行ajax调用并填充下拉框。

我正在尝试将变量$place传递给listplace.php并在json数据中对其进行编码并获取datalist值，但不确定编码的json文件是否正确

我刚试了一下，不确定下面的代码是否有效，请帮忙。

下拉框

<select>
  <option selected disabled>Please select</option>
</select>

Ajax调用

<?php if(isset($_GET['place']) && $_GET['place'] !='') {?>
<script>
    $.ajax({
        type: "POST",
        data: {place: '<?= $place ?>'},
        url: 'listplace.php',
        dataType: 'json',
        success: function (json) {
            var $el = $("#name");
            $el.empty(); // remove old options
            $el.append($("<option></option>")
                .attr("value", '').text('Please Select'));
        }
    });
</script>
<?php } ?>

listplace.php

<?php
$sql = @mysql_query("select placename from employee where placename= '$place'");
$rows = array();
while($r = mysql_fetch_assoc($sql)) {
  $rows[] = $r;
}

Answer 1

var request;

// Abort request is previous doesnt end
if (request) {
  request.abort();
}

// Make request
request = $.ajax({
  type: "POST",
  url: 'listplace.php',
  dataType: 'json',
  // One option is passed php into script
  data: {
    department: '<?= $place ?>'
  }
  // but I prefer this solution
  // html markup:
  // <div style='display:none;' data-place>YOUR_PLACE</div>
  // or hidden input, in final it doesnt matter...
  data: {
    department: $('[data-place]').text()
  }
});

request.done(function(response, textStatus, jqXHR){
  // check response status
  // HTML Markup:
  // <select id='select'></select>
  var select = $('#select');
  select.empty();
  // add default option first one disabled, selected, etc.
  // data are rows in your situatios
  // append data to select with lodash for example
  // _.map(response.rows, function(row){...}
  // jQuery each
  // $.each(response.rows, function(index,row){...}
})

request.fail(function(){
  // do something
})

request.always(function(){
  // do something
})

.php中的

缺少行

$place = $_POST['department'];

Answer 2

将您的AJAX调用更改为以下内容。

<?php if (isset($_GET['place']) && $_GET['place'] != '') { ?>
    <script>
        $.ajax({
            type: "POST",
            data: {place: '<?= $_GET['place'] ?>'},
            url: 'listplace.php',
            dataType: 'json',
            success: function (json) {
                if (json.option.length) {
                    var $el = $("#name"); 
                    $el.empty(); // remove old options
                    for (var i = 0; i < json.option.length; i++) {
                        $el.append($('<option>',
                            {
                                value: json.option[i],
                                text: json.option[i]
                            }));
                    }
                }else {
                    alert('No data found!');
                }
            }
        });
    </script>
<?php } ?>

你的PHP

<?php
$place = $_POST['place'];
$sql = @mysqli_query($conn,"select placename from employee where placename= '$place'");
$rows = array();
while($r = mysqli_fetch_assoc($sql)) {
    $rows[] = $r['placename'];
}
if (count($rows)) {
    echo json_encode(['option'=> $rows]);
}else {
    echo json_encode(['option'=> false]);
}

存在变量时的ajax下拉框

2 个答案: