TileGrid Template

index.html

<script type="text/javascript">
{literal}
isc.RestDataSource.create({
    ID:"menuItemsDS",
    fields:
        [
            {name:"id",primaryKey:"true",type:"integer", hidden:"true"},
            {name:"Title",type:"string",title:"نام"},
            {name:"Icon",type:"string",title:"شمایل", length:1500},
            {name:"Command",type:"string",title:"فرمان",length:500, hidden:"true"},
            {name:"ParentId", type:"integer", title:"منوی پدر"}
        ],
    dataFormat:"json",
    operationBindings:[
     {operationType:"fetch", dataProtocol:"getParams"},
     {operationType:"add", dataProtocol:"postParams"},
     {operationType:"remove", dataProtocol:"postParams", requestProperties:{httpMethod:"DELETE"}},
     {operationType:"update", dataProtocol:"postParams", requestProperties:{httpMethod:"PUT"}}
    ],
    {/literal}
    fetchDataURL :"{$this->baseUrl}/{$this->uniqueId}/",
    addDataURL   :"{$this->baseUrl}/{$this->uniqueId}/",
    updateDataURL:"{$this->baseUrl}/{$this->uniqueId}/",
    removeDataURL:"{$this->baseUrl}/{$this->uniqueId}/"
});

{literal}
var initialCrit = {ParentId:'null'};
var crit = {
    criteria:{ fieldName:"ParentId", operator:"isNull"}
};

isc.TileGrid.create({
    autoDraw:true,
    ID:"MenuItems",
    tileWidth:150,
    tileHeight:150,
    height:400,
    width:"100%",
    showAllRecords:true,
    dataSource:"menuItemsDS",
    autoFetchData:true,
    animateTileChange:true,
    initialCriteria:crit,
    fields: [
        {name:'Title'},
        {name:'IconPath', type:'image', imageURLPrefix:"{/literal}{$imageURLPrefix}{literal}"},
        {name:'ParentId', type:'integer'}
    ]
});
menuItemsDS.fetchData(crit);

{/literal}
</script>