html.dropdownlist 的 onchange 事件

Posted 2023-03-05

【中文标题】html.dropdownlist 的 onchange 事件

【英文标题】：onchange event for html.dropdownlist

【发布时间】：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 是什么？是标签还是别的什么？

【参考方案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 元素；在上述情况下，它的 控件。并且“选项”将在 d 下拉列表中提供可用值的数组，而 selectedIndex 是 JS 属性，它返回下拉列表中选定值的索引。每次更改下拉列表中的选定值时，浏览器也会更改 selectedIndex。 . 检查这些链接.. w3schools.com/jsref/prop_option_index.asp w3schools.com/jsref/prop_select_selectedindex.asp

Sortby 是什么？是 viewbag 变量名还是别的什么？

【参考方案4】：

如果你有一个列表视图，你可以这样做：

定义一个选择列表：

@
   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");

使用定义的SelectList，为每条记录创建一个不同的id（记住每个元素的id在一个视图中必须是唯一的），最后为onchange事件调用一个javascript函数（包括例子url和记录键中的参数）：

@Html.DropDownList("ddAcciones", Acciones, "Acciones", new  id = 
item.CountryID, @onchange = "RealizarAccion(this.value ,id)" )

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....部分的代码格式