I recently had a project that made me temporarily shift from my more native c#/asp.net environment and use php on the backend instead. As by more and more asp.net developers these days I have become accustomed to doing just about everything in the front end with the JavaScript library Knockout. Of course knockout.js is completely compatible with php being that it is on the front end while php is on the back end, but in combining php with knockout there are a few things that I have found make the match just a bit smoother.
Use json_encode() to pass PHP arrays to knockout
<?php
function getOrders() {
include_once 'mysql_connect.php';
$email = $_SESSION['Email'];
$query = sprintf("SELECT * FROM `Order` WHERE `Email` = '%s' order by id desc",
mysqli_real_escape_string($con, $email));
$result = mysqli_query($con, $query);
$data = array();
while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
$data[] = $row;
}
mysqli_close($con);
return json_encode($data);//json_encode() is the key
}
?>
Then on on the front-end:
$(document).ready(function () {
//Pass JSON encoded data directly into javascript variable
var data = <?php getOrders(); ?> ;
var vm = new ViewModel(data);
ko.applyBindings(vm);
});
function ViewModel (data){
self = this;
self.Orders = ko.mapping.fromJS(data);
}
Use ko.toJS() to send data from your ViewModel to PHP
function ViewModel (){
self = this;
self.Order = {
Email:ko.observable(),
FirstName : ko.observable(),
LastName : ko.observable(),
URL : ko.observable(),
Comments : ko.observable()
};
self.CreateOrder = function() {
//Here is where you convert the data to something php can swallow
var data = ko.toJS({"Data":order});
$.ajax({
url: "CreateOrder.php",
type: 'post',
data: data,
success: function (result) {
console.log(result);
}
});
};
}
And then on the back end:
<?php
include_once 'mysql_connect.php';
//recieve raw data into php variable
$data = $_POST['Data'];
//extract each field from raw data
$email = $data['Email'];
$firstName = $data['FirstName'];
$lastName = $data['LastName'];
$comments = $data['Comments'];
...
?>
CR : http://www.romankagan.com/?p=186
