如何在ASP.NET MVC中设置默认按钮

Question

这是我的html代码：

@using (Html.BeginForm("Index", "EmployeeList", FormMethod.Post, new {defaultbutton = "searchBtn" }))
            {
  @Html.TextBox("SearchString", ViewBag.SearchString as string, new { @id = "SearchString", @class = "form-control", placeholder = "Search Name" })
<button type="submit" name="MyButton" value="Export" class="btn btn-sm btn-danger">
<button type="submit" name="MyButton" value="Search" id="searchBtn" class="btn btn-sm btn-warning">
}

根据我的页面设计，我必须在"搜索"按钮之前编写"导出"按钮的HTML代码。

当我按Enter填写搜索文本"导出"按钮后，我需要单击"搜索"按钮。

Answer 1

您可以处理Kewdown事件：

 <script type="text/javascript">
$(document).bind('keydown', function (e) {
    if (e.which === 13) { // return
        $('#searchBtn').trigger('click');
    }
});
  </script>

Answer 2

如果您希望在任何形式上都有一个defaultbutton，则添加一个非常容易。以下是一个微不足道的例子。请注意，我要求DefaultButton是选择器而不是ID，但是如果您希望接受ID，则需要前缀A哈希。

还要注意，使用名称" DefaultButton"具有与他人代码相冲突的风险（并且缺乏数据前缀 - 这可能与可能的" DefaultButton"功能相抵触，将来添加到未来的HTML规格中。<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<</p>

以下是一个简单的示例。更改closest检查默认属性属性将允许单个表单具有不同组件的不同默认按钮。

//Load this script on any pages that need to support default buttons.
$(document).bind('keydown', function(e) {
    if (e.which === 13) {
        var button = $(e.target);
        if (button.attr('type') != 'text') {
            return true;
        }
        var parentform = $(e.target).closest('form');
        var selector = parentform.attr('defaultbutton');
        var targetbutton = parentform.find(selector);
        if(targetbutton.length > 0) {
            targetbutton.trigger('click');
            return false;
        }
        return true;
    }
});

<!-- Example usage.  Just add a defaultbutton attribute to your form-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form defaultbutton='#candy'>
  <input type='text' id='text' placeholder='text' />          <br /><br />
  <input type='submit' value='toys'  id='toys' onclick='alert("Toys") ;return false;' />
  <br /><br />
  <input type='submit' value='candy' id='candy' onclick='alert("Candy");return false;' />
  <br /><br />
  <input type='submit' value='money' id='money' onclick='alert("Money");return false;' />
  <br /><br />
</form>