Question

我正在尝试在执行操作时显示“加载”页面。

在视图中，我有以下形式：

<div>
    <label class="bold center">
        Payment options
    </label>
    <div class="center">
        <div class="float-left">
            <label class="center bold">PayPal</label>
            <form id="payPal" action="@Url.Action("PaypalMethod")">
                <input type="image" name="submit"
                       src="~/Images/Functional/Icons/PayPal Pay.gif"
                       alt="PayPal — The safer, easier way to pay online." onclick="needToConfirm = false" />
            </form>
        </div>
        <div class="float-left">
            <label class="center bold">Credit Cards</label>
            <form id="credit" action="@Url.Action("CreditCardMethod")">
                <input type="image" name="submit"
                       src="~/Images/Functional/Icons/Credit cards.png"
                       alt="CreditCards" onclick="needToConfirm = false"/>
            </form>
        </div>
    </div>
</div>

我可以使用这些javascript方法：

var spinnerVisible = false;

function ShowProgress() {
    if (!spinnerVisible) {
        $('div#spinner').fadeIn("fast");
        spinnerVisible = true;
    }
}
function HideProgress() {
    if (spinnerVisible) {
        var spinner = $('div#spinner');
        spinner.stop();
        spinner.fadeOut('fast');
        spinnerVisible = false;
    }
}

因此，当我点击第一个表单时，我想首先调用ShowProgress()方法，然后调用操作，最后调用结果后的HideProgress()或者只是加载下一个观点。

我怎么能这样做？

Answer 1

您可以使用表单元素的onsubmit属性。

<form onsubmit="ShowProgress()">

调用javascript加载函数和控制器操作

1 个答案: