onchange event for html.dropdownlist

Question

I am trying to trigger an action method for onchange event for dropdownlist, how can I do this without using jquery onchange.

@Html.DropDownList(\"Sortby\",          


        

Answer 1

You can do this

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

Answer 2

If you don't want jquery then you can do it with 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>

Answer 3

try this :

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

Answer 4

You can try this if you are passing a value to the action method.

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

Remove the query string in case of no parameter passing.

Answer 5

If you have a list view you can do this:

1. Define a select list:

   @{
      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. Use the defined SelectList, creating a diferent id for each record (remember that id of each element must be unique in a view), and finally call a javascript function for onchange event (include parameters in example url and record key):

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

3. onchange function can be something as:

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