PHP and Kendo UI

If you've been following me on Twitter you've probably watched a few of my trials and successes in getting PHP up and running on my computer. It's been fun digging in to something that I haven't used in 13+ years. PHP has certainly changed a lot since then, and the community of PHP developers has gone above my expectations in helping me get back in to it.

But more importantly than my own curiosity and love of working with great communities, I'm digging in to PHP this for a reason related to Kendo UI.

A Sneak Peak At Our DataSource Wrappers

The engineering team has been hard at work on building out the PHP wrappers for Kendo UI, and I want to show you a sneak peak of what this is shaping up to be. The gist of it is that they will allow you to use server-side PHP code to generate your client-side JavaScript for Kendo UI, much the same way that our ASP.NET MVC and JSP (beta) wrappers work.

Here, for example, is a snippet of what it will look like to create a kendo.data.DataSource using our new PHP wrappers:

$model
  ->id('ProductID')
  ->addField(
    $productIDField, 
    $productNameField, 
    $unitPriceField, 
    $unitsInStockField, 
    $discontinuedField
  );

$schema = new \Kendo\Data\DataSourceSchema();
$schema
  ->data('data')
  ->errors('errors')
  ->model($model)
  ->total('total');

$dataSource = new \Kendo\Data\DataSource();

$dataSource->transport($transport)
  ->batch(true)
  ->pageSize(30)
  ->schema($schema);

This, along with a few details I’ve left out, and combined with the Kendo UI Grid wrapper, will produce the following JavaScript in your page:

jQuery("#grid").kendoGrid({
  "columns": [
    // ...
  ],
  "dataSource": {
    "transport": {
      // ...
    },
    "batch": true,
    "pageSize": 30,
    "schema": {
      "data": "data",
      "errors": "errors",
      "model": {
        "id": "ProductID",
        "fields": [ /* ... */ ]
      },
      "total": "total"
    }
  },
  "toolbar": [
    { "name": "create" }, 
    { "name": "save" }, 
    { "name": "cancel" }
  ],
  "height": 400,
  "navigatable": true,
  "editable": true,
  "pageable": true
});

I've omitted a few of the lengthier details here, to keep the code more readable. The result, though, is a fully functioning Kendo UI Grid. It's the same grid we all know and love, still running in the browser. The difference is that we're building the resulting JavaScript with server side PHP.

More PHP, Please!

Now I know the DataSource may not be the most exciting piece of our framework, but it is a critical one. Nearly every Kendo UI widget and control can take advantage of the DataSource to provide 2-way binding in and out of a backing data store. This makes it a foundation for many other PHP wrappers that we will be providing.

Ultimately, this is just a quick preview of what's to come, using an early version of what has been built. There's a good chance that the details I'm showing here will change before the final release, so don't take this blog post as the gospel of what will be. There is also a lot more to the PHP side of things than I'm able to show at this time, and a lot more to come!

If you want to know more, if you want to see the suite of PHP wrappers in action and possibly get a discount on them when they are released, sign up for the 2013 Spring Release keynote!