Question

我有一个Jquery在完成期间提交，因此提交发生两次。有没有办法避免相同的？

以下是代码段。

我的Claim加载路线如下所示。

# Claim Loading for Historical Claims
GET     /claimLoading            controllers.ClaimLoading.form
POST    /claimLoading            controllers.ClaimLoading.submit

在我的控制器中，提交如图所示。

/**
 * Handle form submission.
 */
def submit = Action { implicit request =>
claimLoadingForm.bindFromRequest.fold(
  // Form has errors, redisplay it
  errors => {
    Logger.info("Some error occurred before calling the service")
    BadRequest(html.claimloading.form(errors))
  },
  claimLoading => {
    // Invoke the LoadCSVorXML2Mongo service from here
    claimsLoadingService.loadCSVOrXMLClaimToDatabase(claimLoading.claimLoadingPath)

    val resultSummary  = claimsLoadingService.retrieveSummaryInfo
    // We got a valid ClaimLoading value, display the summary
    Ok(html.claimloading.summary(claimLoading, Json.prettyPrint(resultSummary)))
  }

)
}

点击按钮的Jquery呼叫是＆gt;＆gt;＆gt;＆gt;

/views/claimloading/form.scala.html

<input type="button" class="btn primary" id="claimsLoadButton"  value="Invoke Claim Loading">

在claimloading下的form.scala中的Jquery是＆gt;＆gt;＆gt;＆gt;

<script type="text/javascript"  xmlns="http://www.w3.org/1999/html">

$(document).ready( function () {
    $("#claimsLoadButton").click(function () {
        createLoadingModal();
        showLoader(true);
        $.ajax({
            url: "/claimLoading",
            type: "POST",
           data: $("#claimLoadingForm").serialize(), // serializes the form's elements.
            dataType:"json",
            success: function (data) {
                showLoader(false);
            },
            error: function (jqXHR, textStatus, errorThrown) {
            },
            complete: function (data) {

                submitClaimsLoading();
            }
        });
    });
});

function submitClaimsLoading()
{
    $("#claimLoadingForm").submit();
    showLoader(false);
}

</script>

Answer 1

使用event.preventDefault();按钮点击停止提交表单。

$(document).ready(function (event) {
    event.preventDefault(); //add this here
    $("#claimsLoadButton").click(function () {
        createLoadingModal();
        showLoader(true);
        $.ajax({
            url: "/claimLoading",
            type: "POST",
            data: $("#claimLoadingForm").serialize(), // serializes the form's elements.
            dataType: "json",
            success: function (data) {
                showLoader(false);
            },
            error: function (jqXHR, textStatus, errorThrown) {},
            complete: function (data) {

                submitClaimsLoading();
            }
        });
    });
});

Jquery play框架避免双重提交

1 个答案: