c# - MVC Dynamic content onchange of dropdownlist -

i have question on how achieve following:

i have dropdownlist activities , want on onchange event of activity, list fetched id set in model ajax

example of code following

ajax method set id

 function getselectedvalue(dropdownid, hiddenfieldid) {      $('#' + hiddenfieldid).val($('#' + dropdownid + ' option:selected').val());      $('#' + dropdownid).change(function () {         $('#' + hiddenfieldid).val($('#' + dropdownid + ' option:selected').val());          $.ajax({             url: 'afmeldingen',             type: "post",             data: json.stringify({ 'activiteitenid': $('#' + dropdownid + ' option:selected').val() }),             contenttype: "application/json; charset=utf-8",             datatype: "json",             success: function (data) {                 jquery.globaleval(data.callback);             },             error: function (error) {                 //alert(error);             }         });     }); } $(document).bind('pageinit', function () {     getselectedvalue('details', 'act_id'); }); 

the form element

@using (html.beginform()) {     <div data-role="collapsible" data-inline="true" data-content-theme="b" data-collapsed="false">         <h3>@datetime.today.toshortdatestring()</h3>         <div data-role="collapsible-set" data-inline="true" data-content-theme="b" data-collapsed="true">             <select id="details">                 @foreach (var item in models.taken.activitylist)                 {                     <option value="@item.id">@item.comments</option>                 }             </select>             @html.hidden("act_id")             @foreach (var item in talent.subscription.fetch(null, models.taken.actid ?? 1l, null, null))             {                 <div data-role="collapsible" data-content-theme="b" data-collapsed="true">                     <h3>                         @html.label("", item.participant.completename)                     </h3>                     @html.checkboxfor(m => m.deelnemeractive.hasvalue, htmlattributes: new { data_role = "checkbox" })                     @foreach (var af in talent.afmelding.fetch(null, models.tasks.actid ?? 1l, null, null))                     {                         @html.label("", "comments")                         @html.textbox("reason", af.reason);                     }                 </div>             }         </div>     </div> } 

i hope can me achieve this, or have idea how this

this best example can find you.

http://blog.krisvandermast.com/commentview,guid,b1a264ac-c48f-463e-9f55-db24e2a9b635.aspx

he loads data partial view dynamically on onclick of button. use onchange here.

-

have @ example see how cascading dropdowns work:

http://www.c-sharpcorner.com/uploadfile/abhikumarvatsa/cascading-dropdownlist-in-asp-net-mvc/

-

you consider using knockout js, described here:

http://www.dotnetexpertguide.com/2012/06/cascading-dropdown-knockoutjs-aspnet.html