用 php mysql jQuery 链接选择

Question

我的 mvc 结构中的链接选定脚本存在问题 我有表单视图，它包含以下内容：

<div class="col-md-6 col-md-offset-3">
  <form action="" method="post" role="form">
    <div class="form-group">
      <label>Nom de l'annonce:</label>
      <input class="form-control input-lg" type="text" name="reg_name">
    </div>
    <div class="form-group">
      <label>Choisi une catégorie:</label>
      <select id="first_drop" class="form-control input-lg" name="categories">
        <option disabled="disabled" selected="selected">choisi une categorie</option>
        <?php
          for ($i = 0; $i < count($dispalyCat); $i++) {
            echo'<option value="' . $dispalyCat[$i]['id'] . '">' . $dispalyCat[$i]['categorieName'] . '</option>';
          }
        ?>
      </select>
    </div>
    <span id="loading" style="display: none;">
      <img alt="Loading..." src="resources/images/loader.gif"/>
    </span>
    <div class="form-group" id="result" style="display: none">
      <label>Choisi une sou-catégorie:</label>
      <select id="second_drop" class="form-control input-lg" name="subCategories">
        <?php
          for ($i = 0; $i < count($dispalySubCat); $i++) {
            echo'<option>' . $dispalySubCat[$i]['subCategorieName'] . '</option>';
          }
        ?>
      </select>
    </div>
    <div class="form-group">
      <label>Prix:</label>
      <input class="form-control input-lg" name="reg_pass2" type="text"/>
    </div>
    <div class="form-group">
      <label>Surface:</label>
      <input class="form-control input-lg" name="reg_pass2" type="text"/>
    </div>
    <div class="form-group">
      <label>Description:</label>
      <textarea class="form-control input-lg"></textarea>
    </div>
    <div class="form-group">
      <label>Images:</label>
      <input type="file" value="Ajouter l'annonce" class="form-control input-lg" multiple="" />
    </div>
    <div class="form-group">
      <input type="submit" value="Ajouter l'annonce" class="btn btn-danger btn-lg" />
    </div>
    <input type="hidden" name="do" value="register"/>
  </form>
</div>

然后在控制器中对信息进行操作，代码如下：

<?php
  $display = new Display('categories');
  $dispalyCat = $display->getAllData();

  $func = $_POST['func'];
  $drop_val = $_POST['drop_val'];

  if (isset($_POST['drop_val'])) {
    $display2 = new Display('subcategories');
    $dispalySubCat = $display2->getAllDataFromParentId($drop_val, 'categorieId');
  } 

  include 'views/ajouterAnnonce.php';
?>

jquery 脚本是：

$(document).ready(function () {
    "use strict";
    $('#loading').hide();
    $('#first_drop').change(function () {
        $('#loading').show();
        $('#result').hide();
        $.post('addAds.php',  {
        drop_val: $('select[name=categories]').val()
      }, function (response) {
          $('#result').fadeOut();
          setTimeout("finishAjax('result', '" + escape(response) + "')", 400);
      });
      return false;
  });
});

function finishAjax(id, response) {
    "use strict";
    $('#loading').hide();
    $('#' + id).html(unescape(response));
    $('#' + id).fadeIn();
}

当我测试此代码并从第一个选择中选择一个选项时，我收到一条错误消息，指出在第 3 行（在第二个代码中）找不到类 Display，尽管它在第一个选择中工作并向我显示所有类别在数据库中 问题出在哪里？

Answer 1

把问题分成两部分：

1.- 服务器端：

//在你的文件php中

<?php 
    // get values from url, because for a query from a select, is not necessary use request POST
    // then
    echo $.GET['value'];
    // Here you use queries or you do procedures for obtain data related with $.GET['value']
    // Last you return data on format Json
?>

// This file php, has a url, for example: get_data_select.php 
// Then whitout jquery or javascript, you should test the url, on the browser.
// http://somedomain/get_data_select.php?value=12
// If it return data with header json. server side works good.

2.- 客户端：你改变选择

$('#idselect').on("change", function(){
  var values = '?value=' + $('#idselect').val();
  $.get('http://somedomain/get_data_select.php' + values, function(res){
    console.log("response", res);
    callFunctionRender(res);
  });   
});


function callFunctionRender(data) {
 // here You have data from server
// then you should rendered
};