开发者

jquery submit causes error due to recursion

I have a form with onsumbit attribute. I am calling a javascript function on the onsumbit. I need to set some values on hidden variables before the form actually submits. That bit is done in the SaveQuery() function. I also have a link on the page which does the same action of submitting the form. I have added the onsubmit, so that the form gets submitted when some one presses the Enter key.

The problem is that when using jquery v1.4.4 library, the form seems to be submitted recursively. How do I avoid that from happening. With jquery v1.3.2, there doesn't seem to be a problem.

The Form:

<form id="savequery" action="savedquery.aspx" method="post" onsubmit="SaveQuery(); return false;">
        <input type="hidden" id="orig_q" name="orig_q" value="" />
        <input type="hidden" id="isFullText" name="isFullText" value="" />
        <input id="queryName" name="queryName" value="New Query" />
        </form>
        <table class="centerButton">
            <tbody>
                <tr>
                    <td>
                        <div id="proceedSave" class="butActive idProceed">
                            <p>
                            </p>
                            <div>
                                <a href="#" onclick="SaveQuery();">Proceed</a></div>
                        </div>
                        <!-- duplicate text item -->
                    </td>
                </tr>
            </tbody>
        </table>

SaveQuery Function:

开发者_运维百科
SaveQuery = function () {
    $("#orig_q").val(document.getElementById("txtQuery").value);
    $("#isFullText").val(document.getElementById("chkFulltext").checked);
    $("#savequery").submit();
}


Instead of stopping the submission and triggering it, you can just let it pass though:

onsubmit="SaveQuery();"

var SaveQuery = function () {
  $("#orig_q").val(document.getElementById("txtQuery").value);
  $("#isFullText").val(document.getElementById("chkFulltext").checked);
}


Your calling SaveQuery in both the onsubmit handler for the <form>, and the click action for the <a>. The function then calls submit() again, which will trigger the function, which calls submit(), which triggers the function, etc... so of course it recurses! Just call SaveQuery on the click event and it should be fine.


I can't comment on the differences between the two libraries, however I would suggest that a simple ammendment to your code would fix the issue.

In your form tag you have an onsubmit="SaveQuery(); tab, and then you call this function when you click on Proceed. In my eyes this ought to present the behavior you see, regardless of whether earlier versions of jQuery mask it.

Simply task this onsubmit declaration out.

Random bonus comment

You're mixing your JavaScript and jQuery DOM interaction methods. Why not just use jQuery:

$("#orig_q").val($("#txtQuery").val());
$("#isFullText").val($("#chkFulltext").attr("checked"));
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜