Jquery 在将整个表单作为insert提交给DB之前，如何使用Ajax根据DB验证表单select输入值？_Jquery_Nested Forms

Jquery 在将整个表单作为insert提交给DB之前，如何使用Ajax根据DB验证表单select输入值？

jquery

Jquery 在将整个表单作为insert提交给DB之前，如何使用Ajax根据DB验证表单select输入值？,jquery,nested-forms,Jquery,Nested Forms,我有一个主表单，它将被插入到mysql，在这个表单中我有一个选择选项，用户可以选择一个房间，在选择这个房间的同时，他可以点击一个按钮，对照DB检查这个房间是否可用到目前为止，结构是一种嵌套形式，我知道，这通常是不建议/不允许的，但是有其他方法吗假设所有元素都是主窗体的一部分我已经在下面发布了我的代码示例 $（文档）。在（“单击”，“检查室”，函数（）上）{ var data=$（'#checkRoomForm'）.serialize（）； $.post（'urlToMyPHP'，数据）。

我有一个主

表单

，它将被插入到

mysql

，在这个表单中我有一个选择选项，用户可以选择一个房间，在选择这个房间的同时，他可以点击一个按钮，对照DB检查这个房间是否可用

到目前为止，结构是一种嵌套形式，我知道，这通常是不建议/不允许的，但是有其他方法吗

假设所有元素都是主窗体的一部分

我已经在下面发布了我的代码示例

$（文档）。在（“单击”，“检查室”，函数（）上）{
var data=$（'#checkRoomForm'）.serialize（）；
$.post（'urlToMyPHP'，数据）。成功：函数（响应）{
//论成功。。
$（'#checkRoomResult'）.val（响应）；//显示结果
};
});
$（文档）。在（“单击”，“主提交”，函数（）上）{
var data=$（'#masterForm'）.serialize（）；
$.post（'urlToMyPHP'，数据）；
});

姓名：
房间：
1号房间
2号房间
3号房间
地位：
您可以将内部表单更改为除法，如下所示
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

<form id="masterForm">

  <label>Name:</label>
  <input id="checkName" name="checkName">


  <div id="checkRoomForm" name="checkRoomForm">
    <label>Room:</label>
    <select id="selectRoom" name="selectRoom">
    <optgroup>
      <option value="R1">Room 1</option>
      <option value="R2">Room 2</option>
      <option value="R3">Room 3</option>
    </optgroup>
  </select>

    <input type="button" value="Check Room" id="checkRoom">
  </div>

  <label>Status:</label>
  <input id="checkRoomResult" value="">

<input id="MasterSubmit" type="submit">
</form>
</body>
</html>

看起来很有趣，我去看看。
$(document).ready(function(){
  $("#checkRoom").click(function(){
    console.log($("#checkRoomForm :input").serialize());
  });
});