时间戳

首页 > 解决方案 > Ajax 请求多次提交输入

javascript - Ajax 请求多次提交输入

问题描述

我有表格行，当按下一行时，通过 ajax get 请求创建带有输入字段的侧边栏。侧边栏将依次有另一个 ajax 发布请求，用于提交侧边栏中的输入字段。

我遇到的问题是，如果用户在不同的表行上按下然后提交输入字段，它将为所有已按下的表行运行 ajax 调用，但它应该只提交当前所在的行“站在。

Ajax 调用创建带有输入字段的侧边栏：

var ajaxRequest = null;

$('.detailedTable tbody').on('click', '.tablerow', function() {
  var somedata = $(this).attr('data-somedata');

  ajaxRequest = $.ajax({
    url:"/ajax/showAccountSidebar",
    method:"GET",
    data: {
      somedata: somedata,
    },
    beforeSend:function() {
        if(ajaxRequest != null) {
            ajaxRequest.abort();
        }
     },
    success:function(data) {
      $('#sidemenu').html(data);
    }
  });
});

在侧边栏中提交输入字段的 Ajax 调用：

var sidebarRequest = null;

$(document).on('click', '#sidebarMenu', function() {
  var someData = $("#someData").val();

  sidebarRequest = $.ajax({
    url:"/ajax/saveAccountNote",
    method:"POST",
    data: {
      inputData: someData
    },
    beforeSend:function() {
        if(sidebarRequest != null) {
            sidebarRequest.abort();
        }
    }
  });
});

标签： javascriptjqueryajax

解决方案

我遇到的问题是调用第二个 AJAX 调用

$(document).on('click', '#sidebarMenu', function() {

将其更改为以下内容，现在它仅提交我上次单击的输入字段：

$('#sidebarMenu').on('click', $(this), function() {

推荐阅读