使用<a> tag</a>提交表单

时间:2013-10-29 13:04:27

标签: jquery forms submit

我有一个带有一些字段的表单和一个带链接的按钮。我想单击此按钮并提交表单。 表格如下:

 <form id="myForm" action="mypage.jsp">
  .....
 <a class="submit-button" href="#">Submit</a>
 </form>

然后是我的js:

  $(".submit-button").click(function(){
        if($(".submit-button").hasClass("disabled") == false){ 
            alert("true");
            $("#myForm").submit(function(ev) { 
                alert("submit");
                var form = $(this);
                $.ajax({
                    url: form.attr('action'),
                    data: form.serialize(),
                    success: function (data) {
                        ....
                    }
                });     
                return false;
            });         
        }   
    });

我的问题是当我点击按钮时没有任何反应。我可以看到“真实”警报但不能“提交”警报。有谁知道可能是什么问题? 提前致谢

3 个答案:

答案 0 :(得分:1)

尝试

将提交处理程序置于按钮单击之外,并在单击时调用表单提交。

我可以从您发布的html表单中看到ID myForm而不是supportForm

$(".submit-button").click(function () {
    if ($(".submit-button").hasClass("disabled") == false) {
        alert("true");
        $("#myForm").submit(); // or $("#myForm").trigger("submit");
    }
});
$("#myForm").submit(function (ev) {
    alert("submit");
    var form = $(this);
    $.ajax({
        url: form.attr('action'),
        data: form.serialize(),
        success: function (data) {....
        }
    });
    return false;
});

答案 1 :(得分:0)

这可能是因为您的表单标识为myForm,但您尝试提交supportForm

答案 2 :(得分:0)

您必须提交表单并将目标操作设置为iframe ...     如果你想在加载iframe后进行AJAX发布......

HTML:

<form id="my_form" class="myForm" method="post" action="mypage.jsp" **target="iframe123"**>


 </form>
 **<iframe id="iframe123" style="display:none;">

  </iframe>**
  <a class="submit-button" href="#" onclick="">Submit</a>

 jQuery:

  document.getElementById('my_form').submit(); // to submit form
    $('#iframe123').on('load',function(){ // Ajax Post
            alert('Hello');
            var form = $(this);
            $.ajax({
                url: form.attr('action'),
                data: form.serialize(),
                success: function (data) {

                }
            });     
            return false;
 });

Demo

  Hope it Helps....
  Thank U