ASP.Net MVC 5: How to execute an action when the user select an item in dropdownlist html helper?

Question

I have tried this but nothing happened.

cshtml

@Html.DropDownList("UtilisateurId", ViewBag.Utilisateurs as SelectList, String.Empty, new { @class = "UserSelected" })

JS

$("#UserSelected").change(function () {
    alert("$(this).val() = " + $(this).val());
});

I get no error but it doesn't work.

Can someone please advise what is the best way to do?

Kartikeya Khosla · Accepted Answer · 2014-08-25 12:42:22Z

1

$(document).ready(function(){  //wrap under document.ready
  $(".UserSelected").change(function () {  //put '.' here instead of '#' because its a class selector
    alert("dropdown value = " + $(this).val());
  });
});

Edit:-

As questioner put another question in comments section so i m answering it here. In order to call a action from jquery you can make a ajax call as :

View :-

  $(document).ready(function(){  
    $(".UserSelected").change(function () {  
    var serviceURL = '/AjaxTest/FirstAjax'; //here 'AjaxTest' is controller name and 'FirstAjax' is action name or you can also use @Url.Action() to specify url here

        $.ajax({
            type: "GET",
            url: serviceURL,
            data:{ param = $(this).val() },
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: successFunc,
            error: errorFunc
        });

        function successFunc(data, status) {     
            alert(data);
        }

        function errorFunc() {
            alert('error');
        }
      });
  });

Controller :

public class AjaxTestController : Controller
{
  //
  // GET: /AjaxTest/
  public ActionResult Index()
  {
    return View();
  }

  [HttpGet]
  public ActionResult FirstAjax(string param)
  {
    return Json("test", JsonRequestBehavior.AllowGet);
  }   
}

edited Aug 25, 2014 at 12:42

answered Aug 25, 2014 at 12:24

Kartikeya Khosla

18.9k8 gold badges46 silver badges70 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sounouk Over a year ago

Thanks! It works. Do you know how can I execute an action and passing the value as parameter instead of displaying the alert message, please?

Kartikeya Khosla Over a year ago

@Sounouk.. i think above answer is enough if answer solved your question then accept it as answer so that answer help others also..thanks...

Sounouk Over a year ago

ATException, thank you very much! It works very well.

Shivang MIttal · Accepted Answer · 2014-08-25 12:26:17Z

0

If the above answer doesn't work,Use this

    <script type="text/javascript">
$(document).ready(function(){
        $(".UserSelected").change(function () {
            alert("$(this).val() = " + $(this).val());
        });
});
</script>

answered Aug 25, 2014 at 12:26

Shivang MIttal

1,0011 gold badge17 silver badges38 bronze badges

Collectives™ on Stack Overflow

ASP.Net MVC 5: How to execute an action when the user select an item in dropdownlist html helper?

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related