Question

我有这个AJAX请求

    function save_details()
    {
        $('#msgDialog').attr('class', 'alert alert-danger alert-dismissable hide');
        $('#msgResult').html('');

        BootstrapDialog.show(
        {
            title: 'Confirmation',
            message: 'Save the details?',
            buttons: [
            {
                label: '<i class="fa fa-times"></i> Cancel',
                cssClass:'btn btn-danger btn-sm',
                action: function(dialogItself) 
                {
                     dialogItself.close();
                }
            }, 
            {
                label: '<i class="fa fa-check"></i> OK',
                cssClass: 'btn btn-primary btn-sm',
                action: function(dialogItself)
                {
                    dialogItself.close();       //i have added this to close the confirmation box so that the user wont click it again

                    if(xhr_pm && xhr_pm.readyState !=4)
                    {
                        xhr_pm.abort();
                    }

                    xhr_pm = $.ajax(
                    {
                        type    :"POST",
                        url     : "  {{ Request::root().'/researcher/linkedin_interface/save_details' }} ",
                        data    :
                        {
                            id              : $('#modalClassifierData').attr('data-record'),
                        },
                        success:function(return_data)
                        {
                            //additional codes
                        }
                    });
                }
            }]
        });
    }

我在Laravel中有后端代码将INSERT处理到数据库中。问题是，用户正在进行多次点击（有意或无意）并导致相同的记录被插入到数据库中，因此现在我有多个记录需要处理。

我正在寻找用后端代码解决这个问题的方法，而不是仅使用JQuery来取消Ajax请求，因为我注意到，即使取消了Ajax请求，它仍然会在服务器中执行。

我已添加验证以在插入记录之前检查状态，只是点击之间的间隔太短，因此它没有检测到记录已添加。

public function saveDetails()
{
    $request = \Request::all();

    $record = RecordsModel::with('record_details')->get()->first();

    //i even tried inserting sleep for 2 seconds but it still does not help, because the interval is just too short.

    $check = \LeadsModel::where('id', '=', $record->id)->where('source_id', '=',  1)->get()->count();

    if($check > 0)
    {
        //return already added in the database
    }

    $rollback_ctr = 0;
    DB::beginTransaction();

    //save lead
    $insert_lead = new LeadsModel();
    $insert_lead->name = $record->name;
    $insert_lead->country = $record->country;
    if(!$insert_lead->save())
    {
        $rollback_ctr++;
    }
    else
    {
        //save lead_details
        $insert_lead_detail = new LeadDetailsModel();
        $insert_lead_detail->contact_no = $request['no']
        if(!$insert_lead_detail->save())
        {
            $rollback_ctr++;
        }
    }

    if($rollback_ctr > 0)
    {
        DB::rollback();
        //return failed message
    }
    else
    {
        DB::commit();
        //return successful message
    }
}

希望有一个很好的建议来解决这个问题。感谢

UPDATE 有时候该功能需要5秒才能完成执行，所以到那时，用户可以关闭对话框，然后点击按钮，再次出现对话框确认。

Answer 1

正如您所注意到的，取消AJAX请求并不会阻止执行后端代码。唯一的方法是阻止发送AJAX请求。

最简单的方法是在发送AJAX请求之前设置一些Javascript变量，以标记用户已经点击并且已经发送了请求。然后，在用户的后续点击中，您可以检查该变量，如果已设置，则不发送AJAX请求。

另一种方法是在用户点击按钮时禁用该按钮。

Answer 2

每当有人点击链接/按钮时都会禁用链接/按钮，因此无法触发进一步的点击操作

$('selector').prop('disabled', true);

多次点击AJAX导致多个php执行

2 个答案: