在没有 JavaScript 或 JQuery 的情况下单击按钮时重置 @HTML.DropDownList 和表格答案

【问题标题】：Reset a @HTML.DropDownList & Table on button click without JavaScript or JQuery在没有 JavaScript 或 JQuery 的情况下单击按钮时重置 @HTML.DropDownList 和表格
【发布时间】：2018-02-15 05:12:00
【问题描述】：

您好，我需要一些帮助，因为我是 MVC 新手。我有一个下拉列表，其中填充了配置中的值。在点击提交以运行查询并将数据带回表中时，我将使用此下拉列表传递一个值。

我需要帮助的地方：

如果用户想要将下拉菜单重置为“选择您的值”并清除数据表以准备运行新查询，我希望他们能够单击“清除”按钮并能够这样做。

我进行了很多搜索并了解了很多关于 JavaScript 的方法，但我想使用 .NET 和 MVC。

这是我的下拉代码：

@{
  ViewBag.Title = "Index";
 }
 @Html.DropDownList("YourElementName", 
 (IEnumerable<SelectListItem>)ViewBag.DropdownVals, "--Choose Your Value--", 
 new {

        //size = "5",
        style = "width: 600px"

        }

我有一个这样的按钮：

<input id="Button2" type="button" value="Clear" />

按钮能否调用控制器中的一些代码来清除列表和表格数据？

如果有时间请详细说明。

非常感谢任何帮助。

现在的控制器：

public ActionResult Index()
    {
        //ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application.";

        string[] values = (ConfigurationManager.AppSettings["DropdownValues"]).Split(',').Select(sValue => sValue.Trim()).ToArray();
        List<SelectListItem> dropDowns = new List<SelectListItem>();
        for (int i = 0; i < values.Length; i++)
        {
            dropDowns.Add(new SelectListItem { Text = values[i], Value = values[i] });
        }
        ViewBag.DropdownVals = dropDowns;


        return View();
    }

【问题讨论】：

能否贴出加载页面的控制器方法以及提交和获取数据的方法？
我的意思是不想使用jquery 是可以理解的，但你为什么不想使用javascript？要清除，您必须刷新页面
@adiga 我用控制器代码更新了问题。我不介意 Javascript，但我查看的每个示例都必须经过循环才能获得最终结果。我只是想要一些简单的东西，却找不到任何东西。
你可以试试这个：<input id="Button2" type="button" value="Clear" onclick="window.location.reload()" /> 。它只会重新加载页面。
@adiga 效果很好。它是一个简单的应用程序，我想保持简单。谢谢，你能回答我的问题，我可以标记它正确吗？

标签： html asp.net-mvc asp.net-mvc-4 html.dropdownlistfor

【解决方案1】：

您可以简单地重新加载页面，这会将下拉菜单和页面设置为默认值。

<input id="Button2" type="button" value="Clear" onclick="window.location.reload()" />

同样，这也取决于您获取数据的方式。如果它是一个Get 请求，查询字符串中有dropdown 值，那么这是行不通的。

你必须这样做：

<input id="Button2" type="button" value="Clear" onclick="location.href='@Url.Action("Index", "ControllerName")'" />

【讨论】：

这如何回答这个问题 - OP 已经明确指出 无需 JavaScript 或 JQuery (onclick IS javascript)
@StephenMuecke 我的一个 cmets 说我不介意 Javascript，但不想要复杂的东西。
@Abdul，这不是您的问题所说的（我们回答问题，而不是 cmets）。如果您打算使用 javascript，请使用 Unobtrusive Javascript - 我们现在处于 21 世纪 :) - $(yourButton).click(function() { ...

【解决方案2】：

执行此类操作的自然方法是使用客户端代码，您不需要服务器中的任何内容来执行此操作。

使用服务器端代码是一种矫枉过正，但简单的方法是重新加载相同的页面（下拉列表默认设置为没有选定项目）。

对于一个简单的javascript方式，而不是重新加载页面：

<input id="Button2" type="button" value="Clear" onclick="document.getElementById('YourElementID').value=''" />

【讨论】：

你是对的，没有注意到显示了一些东西。