javascript - jquery .ajax 从同一页面上的两个表单提交数据

Question

我在一个页面上有两个表格。

Form1 - 收集公司数据

<form id="company">
    Company Name : input - text
    Address : input - text
    City : select from drop down using select2
    submit button
</form>  

表格 2 - 在表格 1 的下拉列表中添加一个城市

<form id="city">
    City Name :input - text ....
    State : select from drop down using select2 ...
    button : add city ....onClick do .ajax submit
</form>

表格2（城市）用于在表格1（公司）的下拉列表中添加缺失的城市。“添加城市”功能使用 .ajax。

当我这样做时， .ajax 正在提交来自Form 1和Form 2的数据。我明确指定了要提交的两个字段。我怀疑 .ajax 参数之一的设置是这种行为的原因。如果有人可以帮助我解决此问题，我将不胜感激。jQuery代码如下。

    $.ajax({
      url: "addCity",
      method: 'POST',
      data: {
        name: $("#city_name").val(),
        state: $("#state").val(),
      },
      success: function(data) {
        var messages = $('.messages');

        var successHtml = "success message ....";
        $(messages).html(successHtml);

      }
    });

标签： javascriptjqueryajax