Hello,
i'm creating a simple page with listing data from database and I would like to create the option of editing a selected row by transferring the row data into a form.
Then the user can update the data and submit the form.
The problem might be that i'm using the same form for inserting and editing data (depending whether objectID is null or not).
I managed to refresh both parts of the page by using ko.applyBindings(PAGMODEL, DOM_ELEMENT), but i'm having trouble displaying data when user needs to find and load data with 'livesearch'/'autocomplete' (I get the data, it just won't show on html)
Code:
function MedicalCentersPM(parameters) {
var self = this;
self.MyModelArray = ko.observableArray();
self.MyModelToManipulate = new MyModel();
self.SearchQuery = ko.observable('');
self.loadData = function () {
loadDataRowsSync(
parameters.filter,
self.SearchQuery(),
'',
function () {
self.MyModelArray.removeAll();
},
function (jsonData) {
$.each(jsonData, function (i, mc) {
self.MyModelArray.push(new MyModel(mc));
});
}
);
try {
ko.applyBindings(self, parameters.dataDOM);
} catch (exc) { }
};
self.manipulateRow = function () {
axaxManipulationCall(
parameters.manipulationUrl,
ko.toJSON(self.MyModelToManipulate),
function () {
self.resetForm();
self.loadData();
},
function (message) {
alert(message);
}
);
};
self.selectRow = function (row) {
self.MyModelToManipulate(MyModel(ko.toJS(row)));
ko.cleanNode(parameters.formDOM);
ko.applyBindings(self, parameters.formDOM);
};
self.resetForm = function () {
self.MyModelToManipulate = new MyModel(JSON.parse(parameters.defaultModel));
ko.cleanNode(parameters.formDOM);
ko.applyBindings(self, parameters.formDOM);
};
self.messageRow = function () {
alert(ko.toJSON(self.MyModelToManipulate));
return false;
};
self.loadData();
self.resetForm();
};
JSFiddle:
link
I might be doing something very wrong or I missed some small detail.... so...
Could anyone please point me in the right direction?
Thank you