JSON Function - cascading DropDownList - update the model

Question

Premise: I'm new with MVC, and my english is not perfect, I hope you'll understand my post, otherwise I'm here for explainations.

I'm working on a project created by another developer in ASP.Net MVC and I have this problem:

In a View I have two cascading DropDownList: one with the Distributors and the other with the Vendors of the Distributor selected in the first DropDownList.

This is the code:

In the Body:

<tr>
    <td>
       <span>Distributor</span>
    </td>
    <td>
       @Html.DropDownList("DistributorID")
       @Html.ValidationMessageFor(model => model.DistributorID)
    </td>
 </tr>
 <tr>
    <td>
       <span>Vendor</span>
    </td>
    <td class="tdAlignLeft">
       @Html.DropDownList("VendorCode")
       @Html.ValidationMessageFor(model => model.ClientHeaderInformation.VendorCode)
    </td>
 </tr>

In the Script:

$("#DistributorID").change(function (e) {

   var SelectGroupId =$(this).val();

   $.getJSON('@Url.Action("VendorByDistributor", "ClientInfo")', { VendorGroup: DistributorID }, function (param) {
       var vendorCodes = $('#VendorCode');
       vendorCodes.empty();
       $.each(param, function (index, param) {
          vendorCodes.append(
             $('<option/>')
                .attr('value', param.vendorCode)
                .text(param.vendorName)
          );
       });
    });
 });

In the Controller:

public ActionResult VendorByDistributor(int _DistributorID)
 {
    var Vendors = db.View_Vendors.Where(n => n.DistributorID.Equals(_DistributorID)).Select(
       x => new
       {
          vendorCode = x.VendorCode,
          vendorName = x.VendorName
       });
    return Json(Vendors, JsonRequestBehavior.AllowGet);
 }

'View_Vendors' is a SQL Server view, mapped with Entity Framework, this is the SQL:

SELECT A.DistributorID, A.DistributorName, B.VendorName, B.VendorCode
 FROM dbo.Distributors AS A LEFT OUTER JOIN dbo.Vendors AS B ON 
 A.VendorCode = dbo.Vendor.VendorCode

All seems to work well, but when I save the view sometimes the VendorCode property of the ClientInfo class hasn't the last selected value. This happens if I change The Distributor on the first DropDownList, in this case the second DropDownList (Vendors) gets the right values, but if I select a Vendor and then I save the model, the property VendorCode has still the first value.

I also tried to create a function to test the event 'change' of the Vendors DropDownList ...

$ ("# VendorCode.") Change (function (e) {
     SelectId var = $ (this). val ();
     $. getJSON ('@ Url.Action ("updateVendorCode", "ClientInfo")', {VendorCodePass: SelectId});
  });

... and in fact the event fires correctly only if I not change the Distributor and the Vendor items are not reloaded, in that case the event fires only the first time.

Sounds like a refresh problem of the second DropDownList Vendors, but I can't find the solution ...

Pileggi

sorry, the text were duplicated, now I have cutted it.

lamarmora
– lamarmora

2013-04-12 13:20:58 +00:00
Commented Apr 12, 2013 at 13:20 — lamarmora
– lamarmora, Commented Apr 12, 2013 at 13:20

Johannes Setiabudi · Accepted Answer · 2013-04-12 14:30:16Z

I wrote a blog post about this here . Here is the relevant code that is similar to your case.

$("#ClientId").change(function () {
    var clientId = "";
    $("#ClientId option:selected").each(function () {
        clientId += $(this)[0].value;
    });
    var url = '<%:Url.Action("ProjectList", "Client") %>' + "/" + clientId;
    $.getJSON(url, null, function (data) {
        var selectedValue = '<%:Model.ProjectId %>';
        $("#ProjectId").empty();
        $.each(data, function (index, optionData) {
            if (optionData.OBJID == parseInt(selectedValue))
                $("#ProjectId").append("<option value='" + optionData.ObjId+ "' selected='true'>" + optionData.Name + "</option>");
            else 
                $("#ProjectId").append("<option value='" + optionData.ObjId + "'>" + optionData.Name + "</option>");
        });
    });
}).change();

lamarmora · Accepted Answer · 2013-04-12 14:33:16Z

0

Ok, sorry, it was a very trivial problem. The code is right, simply a field was wrong: VendorCode in the place of VendorNumber... :-)

Sometimes you can't see the simplest solution ...

I don't delete the post, because the code is right and it could be useful for others.

Regards!

Pileggi

answered Apr 12, 2013 at 14:33

lamarmora

1,1264 gold badges17 silver badges34 bronze badges

Collectives™ on Stack Overflow

JSON Function - cascading DropDownList - update the model

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related