javascript - KnockoutJS with MVC, Model and functions -
i working on project includes mvc , knockoutjs. first time i'm working knockoutjs i'm running lot of issues. want put mvc viewmodel on webpage in tabbed interface. interface want call functions depending on button press.
currently getting model load , show fine, cannot call functions trying create. have no clue way creating @ moment correct one.
i have following model:
public partial class ssosearchmodel { public string searchparameter { get; set; } public string searchvalue { get; set; } public string searchlabel { get; set; } public iqueryable<ssorecordresultviewmodel> searchresults { get; set; } public list<selectlistitem> parameterlist { get; set; } public list<selectlistitem> labellist { get; set; } }
the searchresults this
public partial class ssorecordresultviewmodel { [jsonproperty(propertyname = "first_name")] public string firstname { get; set; } [jsonproperty(propertyname = "last_name")] public string lastname { get; set; } [jsonproperty(propertyname = "email_address"), defaultvalue(propertyname = "email_addresses")] public string emailaddress { get; set; } [jsonproperty(propertyname = "phone_number"), defaultvalue(propertyname = "phone_numbers")] public string phonenumber { get; set; } [jsonproperty(propertyname = "klantnummer"), customattribute(propertyname = "klantnummer")] public string klantnummer { get; set; } [jsonproperty(propertyname = "verzekerdenummer"), customattribute(propertyname = "verzekerdennummer")] public string verzekerdenummer { get; set; } [jsonproperty(propertyname = "person_id")] public string ssoid { get; set; } [jsonproperty(propertyname = "initials")] public string initialen { get; set; } }
and loaded in index function of controller dummy data
public actionresult index() { list<ssorecordresultviewmodel> temp = new list<ssorecordresultviewmodel>(); temp.add(new ssorecordresultviewmodel { ssoid = "ea373d27-142d-48f6-86c9-dcdb15e316d2", emailaddress = "a", firstname = "a", klantnummer = "1", verzekerdenummer = "1", phonenumber = "1", initialen = "a", lastname = "a" }); temp.add(new ssorecordresultviewmodel { ssoid = "2d613aba-3f89-43b0-919a-1aa615086ff3", emailaddress = "b", firstname = "b", klantnummer = "2", verzekerdenummer = "2", phonenumber = "2", initialen = "b", lastname = "b" }); temp.add(new ssorecordresultviewmodel { ssoid = "c142f22e-7664-4a9c-9303-293b48acbf65", emailaddress = "c", firstname = "c", klantnummer = "3", verzekerdenummer = "3", phonenumber = "3", initialen = "c", lastname = "c" }); ssosearchmodel model = new ssosearchmodel(); model.searchresults = temp.asqueryable(); //enumerable.empty<ssorecordresultviewmodel>().asqueryable(); //zoekopties model.parameterlist = new list<selectlistitem>(); model.parameterlist.add(new selectlistitem { text = "zoek op klantnummer", value = "klantnummer" }); model.parameterlist.add(new selectlistitem { text = "zoek op verzekerdenummer", value = "verzekerdenummer" }); model.parameterlist.add(new selectlistitem { text = "zoek op e-mail adres", value = "email" }); model.parameterlist.add(new selectlistitem { text = "zoek op sso id", value = "ssoid" }); model.parameterlist.add(new selectlistitem { text = "zoek op telefoonnummer", value = "telefoonnummer" }); //labels model.labellist = new list<selectlistitem>(); model.labellist.add(new selectlistitem { text = "rel1", value = "rel1" }); model.labellist.add(new selectlistitem { text = "rel2", value = "rel2" }); return view(model); }
now on index.cshtml offcourse have markup shows data great @ moment, knockoutjs issue.
the javascript looks following:
<script> function viewmodel() { var self = this; self.search = ko.observablearray(searchresults); self.save = function(ssoid){ //ajax hier }; }; var rawdata = @html.raw(new system.web.script.serialization.javascriptserializer().serialize(model)); var data = ko.mapping.fromjs(rawdata,viewmodel); ko.applybindings(data); </script>
this shows me data, not know how can call save function. have not work:
<button type="button" class="btn btn-default" aria-label="bewaren" data-toggle="tooltip" data-placement="top" title="bewaar de gegevens" data-bind="click: function() { $data.save(ssoid()); }"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span></button>
also when swap values in ko.mapping.fromjs(rawdata,viewmodel); data not shown anymore. here can me driving me crazy.
Comments
Post a Comment