Drop Down List Giving Incorrect Values

Vegeta ZA

New member
Joined
Feb 15, 2017
Messages
3
Programming Experience
Beginner
Hi everyone,
I have followed the following tutorial for my project:
https://www.youtube.com/watch?v=h_ViuyVs4AE
The issue that I have is that when I click an item in the first drop down box, it does not give the correct values in the second box, it only gives one value and it is incorrect. It should display all the Model_Name's(Vehicle_Model table) that are for each Make_Name(Vehicle_Make table).
Index.cshtml code:

PHP:
@model GoogleMap.Models.MyPageViewModel


            <script>
                $(function () {
                    $("#ContID").change(function () {
                        $.get("/Map/GetModById", { MID: $("#ContID").val() }, function (data) {
                            $("#St").empty();
                            $.each(data, function (index, row) {
                                $("#St").append(" <option value='" + row.Model_ID + "'>" + row.Model_Name + "</option>")

                            });
                        })
                    });
                });

            </script> 
  @Html.DropDownListFor(p => p.SelectedMake_Id, ViewBag.Vehicle_Make as SelectList, "Select Vehicle Make", new { id = "ContID" })
MapController.cs code:


public class MapController : Controller
{
        private GoogleMapEntities db = new GoogleMapEntities();

        //Get the select ID???
        int SelectedMake_Id = 0;              

        // GET: Map
        public ActionResult Index()
        {    
            GoogleMapEntities GE = new GoogleMapEntities();
            List<Vehicle_Details> vehList = db.Vehicle_Details.ToList();

            GoogleMapViewModel GMviewmodel = new GoogleMapViewModel();
            List<GoogleMapViewModel> GMviewmodelList = new List<GoogleMapViewModel>();

            //Populate the ViewModel
            MyPageViewModel vm = new Models.MyPageViewModel();
            vm.GoogleMapViewModelList = GMviewmodelList;
            vm.SelectedMake_Id = SelectedMake_Id;     

            ViewBag.Vehicle_Make = new SelectList(db.Vehicle_Make, "Make_ID", "Make_Name");
            
            return View(vm);               
        }

        public JsonResult GetModById(int MID)
        {
            db.Configuration.ProxyCreationEnabled = false;
            return Json(db.Vehicle_Model.Where(p => p.Model_ID == MID), JsonRequestBehavior.AllowGet);
        }

        [HttpPost]
        public ActionResult Search(string Location)
        {
            GoogleMapEntities GE = new GoogleMapEntities();
            ////SELECT Make_Name DATA FROM DB1
            // var result = GE.Vehicle_Model.Where(x => x.Model_Name.StartsWith(Location)).ToList();
            var GetVeh = db.GetMapSearch().Where(x => x.Model_Name.StartsWith(Location)).ToList();
        
            return Json(GetVeh, JsonRequestBehavior.AllowGet);

        }
}


I've used PHP code tags because my code has been getting messed up when I use the other code tag.
 
Last edited:
I've used PHP code tags because my code has been getting messed up when I use the other code tag.

I just changed your
PHP:
 tag to [xcode] and it worked exactly as it should.
 
[FONT=Segoe UI, Tahoma, Arial, Helvetica, sans-serif]I[/FONT][FONT=Segoe UI, Tahoma, Arial, Helvetica, sans-serif]fyour Model_Name is in DropDownList, i suggest that you may useonchange event to get the clicked value;[/FONT]
[FONT=Consolas, monospace]$('#ss').onchange(function(){[/FONT]

[FONT=Consolas, monospace]$(this).val();[/FONT]
[FONT=Consolas, monospace]})[/FONT]
[FONT=Segoe UI, Tahoma, Arial, Helvetica, sans-serif]Andi know a way to order ,here is my code below:[/FONT]
[FONT=Consolas, monospace]<select NAME="citys" id="city">[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"1"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]bac</>[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"2"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]abc</>[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"3"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]dddd</>[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"4"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]zzzz</>[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"5"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]ffff</>[/FONT]
[FONT=Consolas, monospace]<option[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]value[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"6"[/FONT][FONT=Consolas, monospace]>[/FONT][FONT=Consolas, monospace]eee</>[/FONT]

[FONT=Consolas, monospace]</select>[/FONT]
[FONT=Consolas, monospace]@section scripts{[/FONT]
[FONT=Consolas, monospace]<script[/FONT][FONT=Consolas, monospace] [/FONT][FONT=Consolas, monospace]LANGUAGE[/FONT][FONT=Consolas, monospace]=[/FONT][FONT=Consolas, monospace]"JavaScript"[/FONT][FONT=Consolas, monospace]>[/FONT]
[FONT=Consolas, monospace]function sortRule(a,b) {[/FONT]
[FONT=Consolas, monospace]var x = a._text;[/FONT]
[FONT=Consolas, monospace]var y = b._text;[/FONT]
[FONT=Consolas, monospace]return x.localeCompare(y);[/FONT]
[FONT=Consolas, monospace]}[/FONT]
[FONT=Consolas, monospace]function op(){[/FONT]
[FONT=Consolas, monospace]var _value;[/FONT]
[FONT=Consolas, monospace]var _text;[/FONT]
[FONT=Consolas, monospace]}[/FONT]
[FONT=Consolas, monospace]function sortOption(){[/FONT]
[FONT=Consolas, monospace]var obj = document.getElementById("city");[/FONT]
[FONT=Consolas, monospace]var tmp = new Array();[/FONT]
[FONT=Consolas, monospace]for(var i=0;i<obj.options.length;i++){[/FONT]
[FONT=Consolas, monospace]var ops = new op();[/FONT]
[FONT=Consolas, monospace]ops._value = obj.options.value;[/FONT]
[FONT=Consolas, monospace]ops._text = obj.options.text;[/FONT]
[FONT=Consolas, monospace]tmp.push(ops);[/FONT]
[FONT=Consolas, monospace]}[/FONT]
[FONT=Consolas, monospace]tmp.sort(sortRule);[/FONT]
[FONT=Consolas, monospace]for(var j=0;j<tmp.length;j++){[/FONT]
[FONT=Consolas, monospace]obj.options[j].value = tmp[j]._value;[/FONT]
[FONT=Consolas, monospace]obj.options[j].text = tmp[j]._text;[/FONT]
[FONT=Consolas, monospace]}[/FONT]
[FONT=Consolas, monospace]}[/FONT]
[FONT=Consolas, monospace]sortOption();[/FONT]
[FONT=Consolas, monospace]</script>[/FONT]
[FONT=Consolas, monospace]}[/FONT]
 
Back
Top Bottom