ashwanth ashwanth - 1 year ago 69
C# Question

how to populate the dropdown with input of another dropdown in mvc

I have 2 dropdown called medication and strength.while selecting a medication the strength dropdown should populate based on the input of medication dropdown.
HTML CODE:


<label>Medication<sup>*</sup></label> @Html.DropDownListFor( Model => Model.medication, Model.medication, htmlAttributes: new { id = "MyId" , style = "width:200px; height :30px"}) <button type="button" style="height:30px;" onclick="return openmedication()">search</button>
<label>Strength</label>@Html.DropDownListFor(Model => Model.strength, Model.strength, "Select Strength", new { style = "width:200px; height :30px" })


**when i run this code i am getting all the values of strength dropdown from the table.without sorting the values depending on medication.

MY MODEL:**

public List<ItemModel> med()//FOR MEDICATION
{

List<ItemModel> itemList = new List<ItemModel>();
connection();
SqlCommand cmd = new SqlCommand("procmedication_dropdown1", con);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@PstrOperationFlag", "S-drugname");
con.Open();
SqlDataAdapter sd = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
sd.Fill(dt);
ItemModel item = new ItemModel();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
ItemModel io = new ItemModel();
while (sdr.Read())
{
io = new ItemModel();
io.medicat = sdr["drugname"].ToString();


itemList.Add(io);

}
}
con.Close();
return itemList;
}
public List<SelectListItem> Add()// FOR STRENGTH
{

List<SelectListItem> items = new List<SelectListItem>();
connection();

SqlCommand cmd = new SqlCommand("procmedication_dropdown1", con);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@pstroperationflag", "S-strength");

con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
items.Add(new SelectListItem
{
Text = sdr["strength"].ToString(),
Value = sdr["strength"].ToString()
});
}
}
con.Close();
return items;
}

Answer Source

You can achieve this using jquery like this.

 $(document).ready(function(){
    $("#medication").on("change",function(){
       getStrengthList();
    });
 });

function getStrengthList() {
    var url = "Add" // Url of controller

    $.ajax({
        url: url,
        timeout: 500000,
        type: "GET",
        beforeSend: ShowLoader,
        success: function (data) {
            HideLoader();
            var selectList = $('#strength');
            selectList.find('option').remove().end();

            if (data.length > 0) {
                var selected = "";
                var selectedName = "";
                var i = 0;
                $.each(data, function (key, data) {
                    selectList.append('<option value="' + data.Value + '">' + data.Text + '</option>');

                    if (i == 0) {
                        selected = data.Value;
                        selectedName = data.Text;
                        i++;
                    }
                });
                selectedCategory = selected;
                selectedCategoryName = selectedName.toLowerCase();
                selectList.val(selected);
            }

        },
        complete: function () {

        },
        error:  function () {

        },
    });
}
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download