HTML表单 - 表单提交POST值中不包含AJAX更新

时间:2015-11-24 11:27:56

标签: javascript php jquery html ajax

我有一个简单的HTML表单,允许用户选择Type值。根据选定的Type值,他们可以从Categories列表中进行选择。类别是基于类型的条件 - 当您选择类型时,将对数据库运行查询以选择匹配的类别并将其显示为选择菜单。

就显示匹配的类别而言,这一切都运行良好,但是当我提交表单时,所选类别的值不是HTTP请求的一部分,因此没有任何内容添加到数据库中。

这是HTML表单中的Type字段:



<div class="form-group">
  <label for="title" class="control-label col-sm-3">Type</label>
  <div class="input-group col-xs-8">
    <select class="form-control" name="type" id="type" onchange="getCategories(this.value)">
      <option value="Business">Business</option>
      <option value="Commercial">Commercial</option>
      <option value="Commercial Land">Commercial Land</option>
      <option value="Land">Land</option>
      <option value="Rental">Rental</option>
      <option value="Residential" selected>Residential</option>
      <option value="Rural">Rural</option>
    </select>
  </div>

</div>
&#13;
&#13;
&#13;

并且这里是HTML表单中的“类别”字段:

&#13;
&#13;
<div class="form-group">
  <label for="category" class="control-label col-sm-3">Category</label>
  <div class="input-group col-xs-8" class="" id="categoryList">
    <select class="form-control" name="category" id="category">
      <option value=""></option>
    </select>
  </div>
</div>
&#13;
&#13;
&#13;

从“类型”菜单中进行选择时,将运行以下脚本:

&#13;
&#13;
< script type = "text/javascript" >
  function getCategories(str) {
    if (str == "") {
      document.getElementById("categoryList").innerHTML = "";
      return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        document.getElementById("categoryList").innerHTML = xmlhttp.responseText;
      }
      var status = xmlhttp.status == 200 ? 'success' : 'error'
      var group = document.getElementById("category")
      group.classList.add(status)
    }
    xmlhttp.open("POST", "getPropertyCategoriesNew.php?type=" + str, true);
    xmlhttp.send();
  } < /script>
&#13;
&#13;
&#13;

返回以下HTML:

&#13;
&#13;
<select class="form-control" name="category" id="category">
  <option></option>
  <option value="AcreageSemi-rural">AcreageSemi-rural</option>
  <option value="Alpine">Alpine</option>
  <option value="Apartment">Apartment</option>
  <option value="BlockOfUnits">BlockOfUnits</option>
  <option value="DuplexSemi-detached">DuplexSemi-detached</option>
  <option value="Flat">Flat</option>
  <option value="House">House</option>
  <option value="Land">Land</option>
  <option value="Other">Other</option>
  <option value="Retirement">Retirement</option>
  <option value="ServicedApartment">ServicedApartment</option>
  <option value="Studio">Studio</option>
  <option value="Terrace">Terrace</option>
  <option value="Townhouse">Townhouse</option>
  <option value="Unit">Unit</option>
  <option value="Villa">Villa</option>
  <option value="Warehouse">Warehouse</option>
</select>
&#13;
&#13;
&#13;

这可以正确填充类别选择菜单,但是当我检查POST参数时,没有Category参数。这两个字段都是其中的一部分,我有一个保存/提交按钮:

<button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-floppy-disk"></span> Save</button>

然后处理表单,我正在检查类别值,如下所示:

if (isset($_REQUEST['category']) and $_REQUEST['category'] !=='') { 
$request->setField('category', $_REQUEST['category']);
}

0 个答案:

没有答案