带有Ajax的表单发送带有多参数和A href的表单

Question

在form元素中，我使用href发送数据。 使用JavaScript（如下定义），可以完美地工作。

我现在想使用Ajax发送表单，不幸的是它不起作用。 你有为我解决的办法吗？ jQuery包含在页面中。

谢谢！

function sendData(sFm, sID, sFn, sCl) {
    var form = document.getElementById(sFm);
    form.sid.value = sID;
    form.fnc.value = sFn;
    form.cl.value = sCl;
    form.submit();
}

<a href="Javascript:sendData('myform', '2343', 'product', 'order');">Send Data</a>

我的新代码：

function sendData(sFm, sID, sFn, sCl) {
    var form = $("#"+sFm);
    form.submit( function() {
        var sid = $('input[name="sid"]').val(sID);
        var fnc = $('input[name="fnc"]').val(sFn);
        var cl = $('input[name="cl"]').val(sCl);
        $.ajax({
            type: form.attr('method'),
            url: form.attr('action'),
            data: {sid: sid, fnc: fnc, cl: cl}
        }).done(function( e ) {
        });
    });
    form.submit();
}

Answer 1

$("form").submit(function() { // for all forms, if you want specially one then use id or class selector

    var url = $(this).attr('action'); // the script where you handle the form input.
    var method = $(this).attr('method');    

    $.ajax({
           type: method,
           url: url,
           data: $(this).serialize(), // serializes the form's elements.
           success: function(data)
           {
               alert(data); // handle response here
           }
         });

    return false; // avoid to execute the actual submit of the form.
});

：） ， 谢谢

只是因为我们不想通过ajax提交所有表单，所以我们可以将数据属性设置为form标记以指示它应该由ajax还是通常由提交，所以,,

$("form").submit(function() {  ...

   if($(this).attr('data-ajax') != "true") return true;  // default hanlder

   ...  

所以如果表单是这样写的：

<form action="/dosomething" method="post" data-ajax="true">      </form>   // will be sumit by ajax

<form action="/dosomething" method="post" data-ajax="false">      </form>  

//默认情况下为sumit