Pass Kendoui datagrid variable to template that uses Zend Url

Passing a variable from a Kendo Ui datagrid to a custom template on things like edit/delete can be a little tricky, and it gets even harder when Zend encodes the url too.

Basically I had a Kendo Ui Data Grid.

I wanted to create my own edit/delete links for each field rather than make the grid editable.
The trick was to to create a template for the field I wanted to add the links in, then to pass the id of the field to the template.

dataSource: {
  transport: {
   read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
 },
  schema: {
     model: {
        fields: {
          field1:{},
          field2:{},
          field3:{}
        }
    }
},

EDIT: All fields you define in the data-source model will also be available to the template

Here is how I did it

The data grid looked like this:

 $(document).ready(function() {
                $("#grid2").kendoGrid({
                    dataSource: {
                        type: "odata",
                        serverPaging: true,
                        serverSorting: true,
                        pageSize: 100,
                        transport: {
                            read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
                        }
                    },
                    height: 280,
                    scrollable: {
                        virtual: true
                    },
                    sortable: true,
                    columns: ["OrderID", 
"CustomerID", 
"ShipName", 
"ShipCity",
{ title: "Manage", 
  field: "OrderID", 
  template: kendo.template($("#template").html())
} ]
                });
            });

The bit that stumped me initially until I realised how obvious it was. Pass the field you want to the template by specifying the “field” (in this case its OrderID) , for some reason I thought it would magically inherit the fields already defined previously, that is not the case.

And here is the template itself: this is all in the view page of the Zend app.
the trick here was to ensure you decode the URL else the id does not get picked up by the javascript

      <script type="text/x-kendo-template" id="template">
       	<a href="<?php echo urldecode($this->url(array('controller'=>'product-type', 'action'=>'edit','id'=>'#= OrderID#')));?>">Edit</a> | 
	<a href="<?php echo urldecode($this->url(array('controller'=>'product-type', 'action'=>'delete','id'=>'#= OrderID#')));?>">Delete</a>

      </script>

Zend greaterThan validation and message changes

Adding the greaterThan Validator to an elements, setting its min value AND changing its return message was a little tricky.

The main problem is finding the actual valid/invalid declaration, for each type of validator its different, so you need to look at the actual class and find it in there:

Here is how I did it in Zend Framework

$projectModel = new App_Model_DbTable_Project();
   $projects = $projectModel->getProjectList();
   array_unshift($projects,'-----Select Project ----');

   $project = new Zend_Form_Element_Select('projects');
   $project->setLabel('Project')
   ->addMultiOptions($projects)
   ->addValidator('greaterThan',true,array('messages'=>array('notGreaterThan' =>'Please select a project'),'min'=>0));

Zend Yes/No Checkbox Decorator

The problem with Yes/No Check boxes is you need a description of the item you are saying yes/no too, you also need the label yes/no

Here is how I did it in Zend Framework

$status = new Zend_Form_Element_Checkbox('proj_status');
$status->setLabel('Yes')
->setDescription('Project Status')
->setDecorators(array(
array('ViewHelper',
array('helper'=> 'formCheckbox')),
array('description',
array('tag' => 'dt', 'placement' =>'PREPEND')), // Change this to be any tag you want
array('label',
array('placement' =>'APPEND')), // Could add a tag here too
)
);