Javascript 修改Jquery以接受多个查询，而不是一个查询

目前，在我的系统中，我可以从下拉框中选择一个选项，然后该选项显示用户可以输入/选择信息的输入框。然后将此信息发送到数据库并返回信息。我需要对此进行修改，以便在一个页面上显示3或4个选项，而不是下拉框，按下一个按钮，如果选择了任何选项，则每个单独的查询都会发送到数据库。例如，如果他们选择Sex M/F和Subscribed Y/N，则会发送和返回两个单独的查询

这里是我目前拥有的示例文本-这非常有效

Java脚本

window.onunload = refreshParent;
    function refreshParent() {
        window.opener.location.reload();
    }

$body = $("body");

$(document).on({
    ajaxStart: function() { $body.addClass("loading");    },
    ajaxStop: function() { $body.removeClass("loading"); } 
});

$(document).ready(function() {
// Variable to hold request
var request;

$(".chosen-select").chosen({width: '300px'});

//$("#distance_slider").slider({});

// Bind to the submit event of our form
$("#criteria").submit(function(event){

    // Prevent default posting of form - put here to work in case of errors
    event.preventDefault();

    // Abort any pending request
    if (request) {
        request.abort();
    }
    // setup some local variables
    var $form = $(this);

    //$("#isajax").val("1");    

    // Let's select and cache all the fields
    var $inputs = $form.find("input, select, button, textarea");

    // Serialize the data in the form
    var serializedData = $form.serialize();

    // Let's disable the inputs for the duration of the Ajax request.
    // Note: we disable elements AFTER the form data has been serialized.
    // Disabled form elements will not be serialized.
    $inputs.prop("disabled", true);

    // Fire off the request to /form.php
    request = $.ajax({
          url: "index.php?module=Prospects&action=PopupContactsCriteria&html=Popup_Contacts_Criteria_picker&form=ContactsForm&record={RECORD_VALUE}&first_run=1&form_submit=true&query=true&sugar_body_only=1",
        type: "post",
        data: serializedData
    });

    // Callback handler that will be called on success
    request.done(function (response, textStatus, jqXHR){
        // Log a message to the console
        //console.log("Hooray, it worked!");
        //console.log(response);
        document.open();
        document.write(response);
        document.close();
    });

    // Callback handler that will be called on failure
    request.fail(function (jqXHR, textStatus, errorThrown){
        // Log the error to the console
        console.error(
            "The following error occurred: "+
            textStatus, errorThrown
        );
    });

    // Callback handler that will be called regardless
    // if the request failed or succeeded
    request.always(function () {
        // Reenable the inputs
        $inputs.prop("disabled", false);
    });

});

HTML-缺少表的结尾只是一段代码

<form id="criteria" name="criteria">

<table width="100%" border="0">
    <tr>
        <td>
            <table width="100%" name="criteria_search">
                <tr>
                    <td class="dataLabel" width="75%" align="left"><strong>Add Rule : &nbsp;&nbsp;</strong>
                        <select name="rule" id="rule" onChange="toggletdDisplay(this.form);"> 

                        <option value="email">Email</option>
                    <option value="sex">Sex</option>
                    <option value="account">Account</option>
                    <option value="mobile">Mobile</option>
                        </select>
                    </td>

                    <td align="right" name="buttonForm" id="buttonForm">
                    <input type="hidden" name="action" value="PopupContactsCriteria"/>
                    <input type="hidden" name="query" value="true"/>
                    <input type="hidden" name="record" value="{RECORD_VALUE}"/>
                    <input type="hidden" name="module" value="{MODULE_NAME}" />
                    <input type="hidden" name="form_submit" value="{FORM_SUBMIT}" />
                    <input type="hidden" name="sugar_body_only" value="1" />
                    <input type="hidden" name="form" value="{FORM}" />          
                    <input class="button" type="submit" name="addButton" id="addButton" value="  Add Selected  " disabled/>
                </td>   
                <td class="dataLabel" name="instructions" id="instructions" style="display: inline;padding: 50px;"> <p style="color:black;font-size:10px;"><br /> <i> </i> </td>
                <tr>
                    <td class="dataLabel" name="email" id="email" >Email Address Required?  Yes <input type="radio" name="email_c" value="true_ex" {EMAIL_TEX_CHECKED}>  No <input type="radio" name="email_c" value="false" {EMAIL_F_CHECKED}></td>
                </tr>

            <td class="dataLabel" name="sex" id="sex" style="display: none;" > <br /> Male  <input type="radio" name="sex_c" value="Male" {SEX_M_CHECKED}>  Female  <input type="radio" name="sex_c" value="Female" {SEX_F_CHECKED}></td>

            <td class="dataLabel" name="email" id="email" style="display: none;" >  <p><Strong>Email Address (Please additionally select Assigned Racecourse)</strong><p/>Has email address <input type="radio" name="email_c" value="true_ex" {EMAIL_TEX_CHECKED}>  <br /> No email address  <input type="radio" name="email_c" value="false" {EMAIL_F_CHECKED}></td>

            <td class="dataLabel" name="account" id="account" style="display: none;" >  <br />Has Account  <input type="radio" name="account_c" value="True" {ACCOUNT_T_CHECKED}>  No Account <input type="radio" name="account_c" value="False" {ACCOUNT_F_CHECKED}></td>

            <td class="dataLabel" name="awc" id="awc" style="display: none;" >  <br />AWC Newsletter Selected <input type="radio" name="awc_c" value="True"> AWC Newsletter Not Selected <input type="radio" name="awc_c" value="False"></td>

HTML

显示其他规则（*不需要）
附加规则

需要电子邮件地址吗？是不是
没有帐户
AWC新闻稿选定AWC新闻稿未选定
没有手机吗

在提交时，不要使用

.serialize（）

。这将生成一个对象数组，每个对象包含一个输入及其表单中的值：

[
  {
    name: "action",
    value: "1"
  },
  {
    name: "query",
    value: "2"
  },
  {
    name: "record",
    value: "3"
  }
]

然后很容易对每个字段提出一个请求：

for(let oneObject of serializedData){
    $.post({
        url: "index.php",
        data: oneObject
    })
} 

---

这将进行三个不同的（并行）调用，第一个调用带有

{name:“action”，value:“1”}

，第二个调用带有

{name:“query”，value:“2”}

，等等。

我用它更新了我的初始问题，它显示了一个加载图标，然后不会从查询返回任何值。但是，对第一个方法的相同查询确实会返回。知道为什么吗？嗯，还有一些服务器端诊断要做。你的服务器怎么说？我不知道为什么它没有反应。

[
  {
    name: "action",
    value: "1"
  },
  {
    name: "query",
    value: "2"
  },
  {
    name: "record",
    value: "3"
  }
]

for(let oneObject of serializedData){
    $.post({
        url: "index.php",
        data: oneObject
    })
}