I've set up a table in MYSQL and created a file in Knockout.js. The goal is to store the data entered into Knockout.js through the variable "pf" in the table named "PORTFOLIO". I want to establish the database connection using JavaScript. I attempted to connect MYSQL and Knockout.js but faced difficulties. Seeking assistance on this matter.
//TABLE
CREATE TABLE PORTFOLIO
(
ID INT NOT NULL,
pf VARCHAR (255)
);
File in Knockout.js
//View
<h3>Portfolio</h3>
<form data-bind="submit: addpf">
Add Portfolio: <input data-bind="value: newpf" placeholder="Who needs to be added?" />
<button type="submit">Add</button>
</form>
<ul data-bind="foreach: pf, visible: pf().length > 0">
<li>
<input type="checkbox" data-bind="checked: isDone" />
<input data-bind="value: title, disable: isDone" />
<a href="#" data-bind="click: $parent.removepf">Delete</a>
</li>
</ul>
You have <b data-bind="text: oldpf().length"> </b> New Portfolios
<span data-bind="visible: oldpf().length == 0"></span>
//ViewModel
function pf(data) {
this.title = ko.observable(data.title);
this.isDone = ko.observable(data.isDone);
}
function pfListViewModel() {
// Data
var self = this;
self.pf = ko.observableArray([]);
self.newpf = ko.observable();
self.oldpf = ko.computed(function() {
return ko.utils.arrayFilter(self.pf(), function(pf) { return !pf.isDone() });
});
// Operations
self.addpf = function() {
self.pf.push(new pf({ title: this.newpf() }));
self.newpf("");
};
self.removepf = function(pf) { self.pf.remove(pf) };
}
ko.applyBindings(new pfListViewModel());