onchange event for html.dropdownlist

C#Htmlasp.netasp.net Mvchtml.dropdownlistfor

C# Problem Overview


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", 
                   new SelectListItem[] 
                   { 
                       new SelectListItem() { Text = "Newest to Oldest", Value = "0" }, 
                       new SelectListItem() { Text = "Oldest to Newest", Value = "1" }})

Thanks

C# Solutions


Solution 1 - C#

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>

Solution 2 - C#

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

Solution 3 - C#

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.

Solution 4 - C#

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

Solution 5 - C#

first you need to give your dropdown onchange event;

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

then in script section you have to call it like this.

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

Solution 6 - C#

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

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser3585193View Question on Stackoverflow
Solution 1 - C#Kartikeya KhoslaView Answer on Stackoverflow
Solution 2 - C#MoonsView Answer on Stackoverflow
Solution 3 - C#The GodfatherView Answer on Stackoverflow
Solution 4 - C#MinguocodeView Answer on Stackoverflow
Solution 5 - C#Mahir UsluView Answer on Stackoverflow
Solution 6 - C#user2107431View Answer on Stackoverflow