javascript - MVC append partial view to existing kendo pop up window -
javascript - MVC append partial view to existing kendo pop up window -
i created kendo pop window loads dropdown selection controller in contents. added alter event gets id of selected index , pass controller , returns partial view textboxes might alter based on selection, creation of textboxes needs dynamic. tried adding html.partial(_mypartialview), results not rendering. doing wrong?
@(html.kendo().window() .name("usersetupwindow") .appendto("#useacct") .width(600) .height(600) .scrollable(false) .modal(true) .title("new setup") .actions(actions => actions.refresh().close()) .draggable() .content("<section id='createlink' class = 'savenewdialog-screen'>" + "<div class='savenewlinkdialog' style='border: none;' >" + "<div style='border: none;'>" + "<table>" + "<tr style='height: 30px;'>" + "<td style='width: 30%; vertical-align: top;'>" + "<div id='divaccounts' class ='createnew'> " + "<label id='lblist' for='createnew' class='createnew-label'>select new</label> " + html.kendo().dropdownlist() .name("userlist") .datasource(source => source.read(read => read.action("getusers", "useracctmgmt") .data("getselectedid") .type(httpverbs.post))) .datatextfield("username") .datavaluefield("id") .value("id") .selectedindex(0) .events(events => events.databound("ondropdowndatabound")) .events(events => events.change("onselect")) + "</div>" + "</td>" + "</tr>" + "<tr style='height: 30px;'>" + "<td> </td>" + "<td>" + "<div id='divbuttons' class='createnew-buttoncontainer'>" + "<button id='createnewlink-cancel' class='k-button savenewbuttons' >cancel</button> " + "<button id='createnewlink-save' class='k-button savenewbuttons'>save</button>" + "</div>" + "</td>" + "</tr>" + "<tr style='height: 80px;>" + "<td>" + "<div id='div-textboxes'>" + html.partial(_dynamicpartialview) "</div>" + "</td>" + "</tr>" + "</table>" + "</div>" + "</div>" + "</section>'" ).events(events => events.close("onpopupclose"))
in controller:
[httppost] public actionresult getuserfields(string id) { if (!string.isnullorwhitespace(id)) { var fields = getuserfields(int.parse(id)); var model = new fieldmodel { fields = fields }; homecoming partialview("_dynamicpartialview", model); } homecoming null; }
jquery works, , takes me partial view
function onselect(e) { e.preventdefault(); var selectedid = this.dataitem(e.item).id; $.ajax({ url: "@url.action("getuserfields", "usermodel")", type: 'post', cache: false, data: json.stringify({ id: selectedid }), contenttype: "application/json; charset=utf-8", datatype: "json" }); }
here partial view (_dynamicpartialview)
@model models.userfieldmodel @using kendo.mvc.ui @if (model != null) { foreach (var item in model.userfields) { <p>@item.fieldname</p> if (item.fieldtype.tostring().toupper() == "textbox") { if (item.iscasesensitivefield) { @(html.kendo().textbox() .name("casesensitive") ) } else { @(html.kendo().textbox() .name("textinput") ) } } } }
i haven't implemented code, guess interpreting have. looks you're not doing response phone call partial view. in javascript onselect method, there nil happening when phone call succeeded. means calling getuserfields action on controller, , returning rendered partial view, javascript onselect method ignoring result.
you need add together logic in success part of ajax call.
function onselect(e) { e.preventdefault(); var selectedid = this.dataitem(e.item).id; $.ajax({ url: "@url.action("getuserfields", "usermodel")", type: 'post', cache: false, data: json.stringify({ id: selectedid }), contenttype: "application/json; charset=utf-8", datatype: "json" success: function(){ // attach response existing dom } }); }
javascript jquery asp.net-mvc kendo-ui-mvc kendo-window
Comments
Post a Comment