Question

我有一个使用ajax动态加载的表单。一旦加载，我就可以提交表单，以便重新加载页面。我正在尝试现在ajaxify表单，以便我不必重新加载页面。我正在使用malsup的ajaxform插件，但是我无法正确使用此插件，因为我正在尝试ajaxify动态加载的表单。目前，使用下面的代码，它要求我提交表单两次以进行任何更改。换句话说，一旦使用页面上的上一个按钮加载表单，我就必须单击两次提交按钮以提交表单。在第一次单击（不提交表单）之后，每隔一次单击就会执行。我不明白为什么我必须在第一次两次提交表格。请参阅下面的代码。

declare @tblemployee Table(
    id int identity(1,1) primary key not null,
    name nvarchar(MAX) not null,
    salary int not null
);

declare @Result Table(
    name nvarchar(MAX) not null,
    salaryString nvarchar(MAX)
);

insert into @tblemployee(name,salary) values ('joseph' ,25000);
insert into @tblemployee(name,salary) values ('mary' ,25000);
insert into @tblemployee(name,salary) values ('Max' ,40000);
insert into @tblemployee(name,salary) values ('rob' ,40000);
insert into @tblemployee(name,salary) values ('jon' ,40000);

declare @LastSalary int = 0;
declare @name nvarchar(MAX);
declare @salary int;



DECLARE iterator CURSOR LOCAL FAST_FORWARD FOR
    SELECT  name,
            salary
    FROM    @tblemployee
    Order by salary desc
OPEN iterator
FETCH NEXT FROM iterator INTO @name,@salary
WHILE @@FETCH_STATUS = 0 
    BEGIN
        IF (@salary!=@LastSalary)
        BEGIN
            SET @LastSalary = @salary
            insert into @Result(name,salaryString)  
            values(@name,@salary+'');
        END
        ELSE
        BEGIN 
            insert into @Result(name,salaryString)  
            values(@name,'');
        END
        FETCH NEXT FROM iterator INTO @name,@salary
    END

Select * from @Result

我尝试使用ajaxSubmit而不是ajaxForm，因为我知道ajaxform实际上并没有提交表单。当我这样做时，表单似乎在第一次单击时提交（所有警报都出现），但实际上没有提交任何内容。我很感激任何帮助。

Answer 1

您在此发送了哪些数据？你在哪里发送它们？

我想您需要在onSubmit函数中添加event.preventDefault。

我建议使用$ .post（）函数。您可以在此处找到更多信息：https://api.jquery.com/jquery.post/

Answer 2

找出问题所在。我不得不在页面加载时调用ajaxform，然后提交它。不提交它然后调用ajaxform。无论如何，这似乎有效。

$(document).ready(function() { 
  var options = {  
    type: 'post',
    beforeSubmit: showRequest,
    error:  showError,  // error
    success: showResponse  // post-submit callback 
  }; 
$('#send-form').ajaxForm(options);
$('#send-form').live('submit', function (e) {
      e.preventDefault();
    });
}); 

// pre-submit callback 
function showRequest(formData, jqForm, options) { 
return true; 
alert('Please wait...');
} 
// error callback
function showError(er, err, error) {  
var currentAlert = $.jAlert('current');
currentAlert.closeAlert();
errorAlert('Error','Try Again Later');
} 
// post-submit callback 
function showResponse(responseText, statusText, xhr, $form)  { 
var currentAlert = $.jAlert('current');
currentAlert.closeAlert();
successAlert('Success!', 'Your form has been sent');
} 

<form action="" method="post" id="send-form">
<input type="submit" class="submit-btn" name="modal-form" value="submit" />
</form>

对于动态表单，Jquery ajaxform需要两次单击

2 个答案: