HTML Razor 页面中 Razor 组件内的按钮

Question

我有一个名为 CreateForm 的页面在我的 CreateForm 页面上，客户输入数据后，他们可以在我将其保存到数据库之前预览他们的输入。他们的预览版是一个 Razor 组件，包含一个 html 提交按钮。

我遇到的问题是，如果客户点击满意，他可能会多次点击按钮创建多个副本。因此我想在第一次点击后禁用该按钮。如何抓住按钮的手柄？

从 CreateForm 剃刀页面，我有这个嵌入的 Razor 组件

    <CustomerPreviewRequest HeadingToShow="@HeadingToShowPreviewCustomerScreen"
                            onBack="MoveToPreviousPage"
                            CurrentCustomerSubmission="@_model">

    </CustomerPreviewRequest>

在 CustomerPreviewRequest 中，我是这样定义按钮的

            <button aria-label="Submit Request." type="submit" class="login100-form-btn" style="background-color:#1a2b57"
                    tabindex="0" id="submitForm">
                Submit Request
            </button>

Answer 1

是否只希望客户提交一次数据，然后禁用提交按钮？你可以看看这个简单的演示：

查看：

<p style="text-align:center"> 
    <form id="yourFormId" name="yourFormId" method="post" action="#">

        <input type="text" /><br />
        <input type="submit" class="submitBtn" value="Submit Requestt" />
    </form>
</p>




<!--script to disable the submit button -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">  
</script>
<script type="text/javascript">

$(document).ready(function () {
    $(".submitBtn").click(function () {
        $(".submitBtn").attr("disabled", true);
        return true;
    });
});

</script>

结果：

HTML Razor 页面中 Razor 组件内的按钮

HTML button inside a Razor component within a Razor page

html

button

razor

asp.net-core