html - Mvc dotnet core knockout model not updating UI -


if want update model, surface not update, model already.

after save method, model updated not graphical interface.

does know how update model view takes changes.

view:

    var model = ko.mapping.fromjs(@html.raw(this.model));      var code = document.getelementbyid("editor-area");      var editor = codemirror.fromtextarea(code, {                 linenumbers: true,                 matchbrackets: true,                 mode: "text/x-csrc",                 linewrapping: true,                 theme: 'the-matrix'});              model.save = function() {                 model.currentsnippet.code(editor.getvalue());                 var url = "/snippet/save";                  $.ajax({                     url: url,                     method: "post",                     data: { viewmodel: ko.tojs(model.currentsnippet)},                     }).done(function(response) {                         model = ko.mapping.fromjs(ko.mapping.fromjson(response));                     }).fail(function( jqxhr, textstatus ) {                     alert("fail: " + textstatus);                 });             }      var bindcontainer = document.getelementbyid("editor");     ko.applybindings(model, bindcontainer);

controller: 

    public iactionresult save(viewmodelsnippet viewmodel)     {          var model = mapper.mappeviewmodelsnippetzusnippet(viewmodel);          _snippetrepository.save(model);          var returnmodel = jsonconvert.serializeobject(new viewmodelsnippets { selection = guid.newguid(), snippets = mapper.mappesnippetszuviewmodelsnippets(_snippetrepository.giballesnippets()) , currentsnippet = viewmodel});          return json(returnmodel);     }

chrome inspector/console:

model befor save:

{currentsnippet: {…}, __ko_mapping__: {…}, selection: ƒ, snippets: ƒ, save: ƒ, …} currentsnippet : {snippetid: ƒ, name: ƒ, description: ƒ, code: ƒ, modified: ƒ} selection : ƒ c() snippets : ƒ c() clear : ƒ () deploy : ƒ () load : ƒ () save : ƒ () snippetclick : ƒ (data) __ko_mapping__ : {ignore: array(0), include: array(1), copy: array(0), observe: array(0), mappedproperties: {…}, …} __proto__ : object

after save:

{currentsnippet: {…}, __ko_mapping__: {…}, selection: ƒ, snippets: ƒ} currentsnippet : {snippetid: ƒ, name: ƒ, description: ƒ, code: ƒ, modified: ƒ} selection : ƒ c() snippets : ƒ c() __ko_mapping__ : {mappedproperties: {…}, ignore: ƒ, include: ƒ, copy: ƒ, observe: ƒ, …} __proto__ : object

probably need update view model instead of recreation on ajax.done:

            }).done(function(response) {                 // created here model instance not bound ui                 model = ko.mapping.fromjs(ko.mapping.fromjson(response));             }).fail(function( jqxhr, textstatus ) {

you can described in mapping plugin documentation:

var data = {     name: 'scot',     children: [         { id : 1, name : 'alicw' }     ] }

you can map view model without problems:

var viewmodel = ko.mapping.fromjs(data);

now, let’s data updated without typos:

var data = {     name: 'scott',     children: [         { id : 1, name : 'alice' }     ] }

two things have happened here: name changed scot scott , children[0].name changed alicw typo-free alice. can update viewmodel based on new data:

ko.mapping.fromjs(data, viewmodel);

Comments

Post a Comment

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

python Tkinter Capturing keyboard events save as one single string -

is possible store keyboard events 1 string? code below stores 1 char , prints it. card reader or bar code reader, contains collection of character/ string not 1 character @ time. goal save char pressed text variable. from tkinter import * root = tk() def key(event): text= event.char text+= event.char print ("pressed", text) def callback(event): frame.focus_set() print ("clicked at", event.x, event.y) frame = frame(root, width=100, height=100) frame.bind("<key>", key) frame.bind("<button-1>", callback) frame.pack() root.mainloop() currently, creating text variable , everytime key() function gets called, , text stores last character typed. you can define text module level variable , , use module level text inside key function - text = '' def key(event): global text text+= event.char print("pressed", text)
Read more

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -

here tables: create table customer ( cid int primary key, name varchar(32) ) create table ord ( oid int primary key, cid int foreign key references customer, address varchar(20) ) here's linq-to-sql statement: var aaa = c in db.customer select new { c, o = c.ord.tolist() }; and here's inexplicable query generated linq-to-sql: select [t0].[cid] [cid], [t0].[name] [name], [t1].[oid] [oid], [t1].[cid] [cid2], [t1].[address] [address], (select count(*) [dbo].[ord] [t2] [t2].[cid] = [t0].[cid]) [value] [dbo].[customer] [t0] left outer join [dbo].[ord] [t1] on [t1].[cid] = [t0].[cid] order [t0].[cid], [t1].[oid] i want understand how rid of count(*) part. it's entirely uncalled for! linq needs count(*) in order determine number of entries returned o = c.ord.tolist() .
Read more