Lightbox in Grid

by tomwilliams

HTML

<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.blueopal.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css">
<script src="https://dl.dropboxusercontent.com/u/7726084/Jquery/PicBox/picbox.js"></script>
<link rel="stylesheet" href="https://dl.dropboxusercontent.com/u/7726084/Jquery/PicBox/css/picbox.css">
  
<br/>
<br/>
<br/>


<div class="" style="width:100px">
<a href="https://dl.dropboxusercontent.com/u/7726084/Jquery/PicBox/returnImage.jpg" Title = "Rear/Bumper/Painted" rel="lightbox-group11252619"> View Image</a>
</div>
<br/>
<br/>
<br/>
<br/>

<div id="grdVehicleAttributes"></div> 

<script id="Images-template" type="text/x-kendo-template">
<div style="padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; height: 26px; width: 24px">
      <div class="" style="width:100px">
<a href="https://dl.dropboxusercontent.com/u/7726084/Jquery/PicBox/returnImage.jpg" Title = "Rear/Bumper/Painted" rel="lightbox-group11252619"> View Image</a>
</div>
 </div>
</script>​

JavaScript

$(document).ready(function() {
    GetVehicleAttributes();
});

function GetVehicleAttributes() {

var JsonAttributes = [{"AttributeCode":"","AttributeType":"Make","AttributeValue":"SEAT","ID":3378592,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Model","AttributeValue":"IBIZA          ","ID":3378593,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Derivative","AttributeValue":"Ibiza 5dr (2012) SE 1.6 TDI CR 105 PS 5-speed manu","ID":3378594,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Colour","AttributeValue":"Ice Silver","ID":3378595,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Colour Code","AttributeValue":"P5P5","ID":3378596,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Trim Code","AttributeValue":"BT","ID":3378597,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Trim Description","AttributeValue":"Aloe","ID":3378598,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Engine Size(CC)","AttributeValue":"1598","ID":3378599,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Fuel Type","AttributeValue":"DIESEL","ID":3378600,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"BHP","AttributeValue":"105","ID":3378601,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"GEARS","AttributeValue":"5","ID":3378602,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Model Year","AttributeValue":"2013","ID":3378603,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Upholstery Code","AttributeValue":"BT","ID":3798120,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"","AttributeType":"Other","AttributeValue":"Height-adjust passenger seat ","ID":3378604,"VIN":"VSSZZZ6JZDR051504"},{"AttributeCode":"RB7","AttributeType":"Other","AttributeValue":"Bluetooth + Combined USB","ID":3798121,"VIN":"VSSZZZ6JZDR051504"}];

    var ctkGridData = new kendo.data.DataSource({
        data: JsonAttributes,
        schema:...