Share via


Passing dropdown selected value to controller using ajax call

Question

Friday, May 9, 2014 1:58 AM

Hi devs, i am working with mvc 4 dropdown list, i want to pass the dropdown selected value to my controller on change event, which is not working. kindly do help me to resolve the same, for ur reference i have attached my code here following.

<script type="text/javascript">
    $(document).ready(function () {
        $("#productitem").change(function () {
            debugger;
            event.preventDefault();

            var $url = '/Home/getManufacturer';
            $.ajax({
                url: $url,
                type: 'POST',
                datatype: "json",
                data: "Item=" + $("#

productitem

").val(), data: { item: selectedValue }, success: function (response) { }, error: function (xhr, status, error) { // alert(error); } }); }); }); </script> <td> @Html.DropDownList("Items", null, new { @id = "productitem" }) </td>



 [HttpPost]
        public JsonResult getManufacturer(string item)
        {

            ItemStock obj = new ItemStock();
            Processor biz = new Processor();
            List<SelectListItem> itemManufacturer = new List<SelectListItem>();
            DataSet ds = new DataSet();
            ds = biz.getManufacturer();
            int row = ds.Tables[0].Rows.Count;
            itemManufacturer.Add(new SelectListItem { Text = "--Select Manufacturer--", Value = "0" });
            for (int i = 0; i < row; i++)
            {
                itemManufacturer.Add(new SelectListItem { Text = ds.Tables[0].Rows[i].Field<string>("manufacturer"), Value = Convert.ToString(i + 1) });
            }

            return Json(itemManufacturer, JsonRequestBehavior.AllowGet);
        }

All replies (3)

Friday, May 9, 2014 2:17 AM âś…Answered

Got the solution, now its working. its my fault have used the id wrongly in data: call


Friday, May 9, 2014 2:09 AM

sorry for the inconvenience, something went wront, i ll post the formatted coding here,

<script type="text/javascript">
    $(document).ready(function () {
        $("#productitem").change(function () {
            debugger;
            event.preventDefault();
            var selectedValue = $("#productitem").select();
            var $url = '/Home/getManufacturer';
            //alert($url);

            $.ajax({
                url: $url,
                type: 'POST',
                datatype: "json",
                data: "Item=" + $("#Items").val(),
                success: function (response) {

                },
                error: function (xhr, status, error) {
                    //                                  
                    alert(error);
                }
            });
        });
    });
</script>

 <td>
     @Html.DropDownList("Items", null, new { @id = "productitem" })
 </td>

 [HttpPost]
        public JsonResult getManufacturer(string item)
        {

            ItemStock obj = new ItemStock();
            Processor biz = new Processor();
            List<SelectListItem> itemManufacturer = new List<SelectListItem>();
            DataSet ds = new DataSet();
            ds = biz.getManufacturer();
            int row = ds.Tables[0].Rows.Count;
            itemManufacturer.Add(new SelectListItem { Text = "--Select Manufacturer--", Value = "0" });
            for (int i = 0; i < row; i++)
            {
                itemManufacturer.Add(new SelectListItem { Text = ds.Tables[0].Rows[i].Field<string>("manufacturer"), Value = Convert.ToString(i + 1) });
            }

            return Json(itemManufacturer, JsonRequestBehavior.AllowGet);
        }

Wednesday, May 14, 2014 10:08 AM

Hi,

For passing dropdown selected values(list) as a parameter via Ajax to controller, please refer to below similar threads.

http://stackoverflow.com/questions/8743193/pass-dropdown-selected-valueslist-as-a-parameter-via-ajax-to-controller

http://stackoverflow.com/questions/21046716/sending-selected-value-of-drop-down-list-back-to-a-controller-action-using-jquer

Hope that helps to others.

Thanks.