即使尝试了许多解决方案，ajax 调用也无法正常工作

Question

我尝试了许多解决方案，但仍然无法正常调用 ajax。 它没有显示控制台错误或任何错误。我试过 $_POST 和 $_REQUEST

HTML

<div class="form-group">
  <label for="usernamee" class="col-sm-2">Select Customer :</label>
  <div class="col-sm-10">
    <select class="form-control select2" required="" name="uid" id="customer_name">
      <?php
        $getcust = $conn->query("SELECT id,full_name FROM `data_entry`");
        while ($fetch1 = $getcust->fetch_array()) {
      ?>
      <option value="<?=$fetch1[0]?>"><?=$fetch1[1]?></option>
      <?php  } ?>
    </select>
  </div>
</div>

Ajax 调用

$("#customer_name").change(function(e) {
      e.preventDefault();
      var idd = $('#customer_name').find(":selected").val();
      var data = 'idd=' + $('#customer_name').find(":selected").val();
      //alert(data)
      $.ajax({
          type : "POST",
          url : "ajax_get_subid.php",
          //data : {idd:idd},
          data : data,
          success : function(data) {
              alert(data);
          }
      });
      e.preventDefault();
    });

ajax 调用在$(document).ready(function(){()} 内。 Jquery 版本是 2.2.3

还有 PHP

<?php

if(isset($_REQUEST['idd'])){

    $id = $_REQUEST['idd'];

    echo $id;

}

?>

在我的文件中 JS 是

<script src="../plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="../plugins/input-image-display/fileinput.min.js" type="text/javascript"></script>
<script src="../dist/js/jquery-ui.min.js"></script>
<script>
  $.widget.bridge('uibutton', $.ui.button);
</script>
<script src="../bootstrap/js/bootstrap.min.js"></script>
<script src="../plugins/select2/select2.full.min.js"></script>
<script src="../dist/js/moment.min.js"></script>
<script src="../plugins/daterangepicker/daterangepicker.js"></script>
<script src="../plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="../plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<script src="../plugins/slimScroll/jquery.slimscroll.min.js"></script>
<script src="../plugins/fastclick/fastclick.js"></script>
<script src="../dist/js/app.min.js"></script>
<script src="../dist/js/demo.js"></script>

有冲突吗？

Answer 1

由于你使用的是select2，你需要这样使用它：

$("#customer_name").on('select2:select', function(e) {
  e.preventDefault();
  var selectedVal = $(this).val();
  $.ajax({
    type: "POST",
    url: "ajax_get_subid.php",
    data: {idd: selectedVal},
    success: function(response) {
      alert(response);
    }
  });
});

Answer 2

兄弟，我认为你错过了 ajax 调用中的 dataType 试试这个，希望对你有帮助：

$("#customer_name").change(function(e) {
     e.preventDefault();
    var id = $('#customer_name').find(":selected").val();

    $.ajax({
        type : "POST",
        url : "ajax_get_subid.php",
        data : {id:id},
        dataType:'json',
        success : function(data) {
            alert(data);
        }
    });
    e.preventDefault();
  });

还有你的 PHP：

 if(isset($_POST['id'])){

   $id = $_POST['id'];

   echo json_encode($id);

}

Answer 3

如果您使用 $.getJSON 或 $.get/$.post 可能会更容易，在这种情况下，我认为 $.getJSON 是最好的选择，尤其是对于未来的代码更改。

JS 代码： /scripts/main.js

function getData(requestID, callback){
    $.getJSON("/api/getData.php",{id:requestID},callback);
}

function customerName_change(){
  debugger;
  getData(12345,function(result){
     debugger;
     console.log(result);
     alert(result.ID);
  });
}

$(document).ready(function(){
   $('#customer_name').on('change',customerName_change);
});

PHP 代码： /api/getData.php

<?php
  class ApiResult {
     public $ID;
     public $Extra;
  }

  $res = new ApiResult();
  $res->ID = 234124;
  $res->Extra =$_REQUEST['id'];

  echo json_encode($res);

?>