【问题标题】:onchange event for html.dropdownlisthtml.dropdownlist 的 onchange 事件
【发布时间】:2014-09-23 06:09:59
【问题描述】:

我正在尝试触发下拉列表的 onchange 事件的操作方法,如何在不使用 jquery onchange 的情况下执行此操作。

@Html.DropDownList("Sortby", 
                   new SelectListItem[] 
                   { 
                       new SelectListItem() { Text = "Newest to Oldest", Value = "0" }, 
                       new SelectListItem() { Text = "Oldest to Newest", Value = "1" }})

谢谢

【问题讨论】:

  • 您想在更改时调用控制器??
  • 我想调用 /Controller/Actionmethod?value=valueofthedropdownlist 之类的东西,这样行吗??
  • 助手中的 Sortby 是什么?是标签还是别的什么?

标签: c# html asp.net asp.net-mvc html.dropdownlistfor


【解决方案1】:

如果你不想要 jquery,那么你可以用 javascript 来做:-

@Html.DropDownList("Sortby", new SelectListItem[] 
{ 
     new SelectListItem() { Text = "Newest to Oldest", Value = "0" }, 
     new SelectListItem() { Text = "Oldest to Newest", Value = "1" }},
     new { @onchange="callChangefunc(this.value)" 
});

<script>
    function callChangefunc(val){
        window.location.href = "/Controller/ActionMethod?value=" + val;
    }
</script>

【讨论】:

  • 我正在尝试获取该选项的文本,但是当我编写 this.text 时,它似乎不起作用。如何获取文本?
  • @BurakKarakuş...用于获取选定的文本...代码会有所不同...请参阅fiddle
【解决方案2】:

你可以这样做

@Html.DropDownList("Sortby", new SelectListItem[] { new SelectListItem() 
  { 

       Text = "Newest to Oldest", Value = "0" }, new SelectListItem() { Text = "Oldest to Newest", Value = "1" } , new
       {
           onchange = @"form.submit();"
       }
})

【讨论】:

  • 如何使用@Html.DropDownListFor
【解决方案3】:

如果你向 action 方法传递一个值,你可以试试这个。

@Html.DropDownList("Sortby", new SelectListItem[] { new SelectListItem() { Text = "Newest to Oldest", Value = "0" }, new SelectListItem() { Text = "Oldest to Newest", Value = "1" }},new { onchange = "document.location.href = '/ControllerName/ActionName?id=' + this.options[this.selectedIndex].value;" })

不传参数的情况下删除查询字符串。

【讨论】:

  • this.options[this.selectedIndex].value 是默认的吗?如何将所选选项值分配给 this.options[this.selectedIndex].value?
  • @Nabid 我不太确定你的默认意思是什么......它是纯javascript。 'this' 指向当前的 html 元素;在上述情况下,它的
  • Sortby 是什么?是 viewbag 变量名还是别的什么?
【解决方案4】:

如果你有一个列表视图,你可以这样做:

  1. 定义一个选择列表:

    @{
       var Acciones = new SelectList(new[]
       {
      new SelectListItem { Text = "Modificar", Value = 
       Url.Action("Edit", "Countries")},
      new SelectListItem { Text = "Detallar", Value = 
      Url.Action("Details", "Countries") },
      new SelectListItem { Text = "Eliminar", Value = 
      Url.Action("Delete", "Countries") },
     }, "Value", "Text");
    }
    
  2. 使用定义的SelectList,为每条记录创建一个不同的id(记住每个元素的id在一个视图中必须是唯一的),最后为onchange事件调用一个javascript函数(包括例子url和记录键中的参数):

    @Html.DropDownList("ddAcciones", Acciones, "Acciones", new { id = 
    item.CountryID, @onchange = "RealizarAccion(this.value ,id)" })
    
  3. onchange 函数可以是:

    @section Scripts {
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
    
    <script type="text/javascript">
    
    function RealizarAccion(accion, country)
    {
    
        var url = accion + '/' + country;
        if (url != null && url != '') {
            window.location.href = url ;
        }
    }
    </script>
    
    @Scripts.Render("~/bundles/jqueryval")
    }
    

【讨论】:

    【解决方案5】:

    试试这个:

    @Html.DropDownList("Sortby", new SelectListItem[] { new SelectListItem() 
    { Text = "Newest to Oldest", Value = "0" }, new SelectListItem() 
    { Text = "Oldest to Newest", Value = "1" }},
    new { onchange = "document.location.href = '/ControllerName/ActionName?id=' + this.options[this.selectedIndex].value;" })
    

    【讨论】:

      【解决方案6】:

      首先你需要提供你的下拉 onchange 事件;

      @Html.DropDownList("ddl_reportId", new SelectList(ViewBag.ddl_reportName, "ddl_reportId", "ddl_reportName"), "Raporu seçin", new { @class = "form-control", @onchange = "getVal()" })
      

      然后在脚本部分你必须这样称呼它。

      function getVal() {
          var selectedVal = document.getElementById("ddl_reportId").value;
          console.log(selectedVal)};
      

      【讨论】:

      • 请包含@HTML....部分的代码格式
      猜你喜欢
      • 2012-02-16
      • 1970-01-01
      • 1970-01-01
      • 2014-05-05
      • 2021-04-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多