igGrid - object column template

by georgianastasov

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://igniteui.com/js/external/jsrender.js"></script>
<script src="https://igniteui.com/data-files/adventureworks.min.js"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>

<table id="grid"></table>
<!-- make the conditional template -->
<script id="MakeFlagTmpl" type="text/template">
        {{if (${MakeFlag}) === false}}
        <span style='color: black; font-weight: bold;'>&#10005</span>
        {{else}}
        <span style='color: blue; font-weight: bold;'>&#10003</span>
        {{/if}}
</script>

JavaScript

$(function () {
var adventureWorks = [
    		{
            "ProductID": 321,
            "Name": "Chainring Nut",
            "ProductNumber": "CN-6137",
            "FinishedGoodsFlag": true,
            "MakeFlag": false,
        },
        {
            "ProductID": 322,
            "Name": "Chainring",
            "ProductNumber": "CR-7833",
            "FinishedGoodsFlag": false,
            "MakeFlag": false,
        },
        {
            "ProductID": 323,
            "Name": "Crown Race",
            "ProductNumber": "CR-9981",
            "FinishedGoodsFlag": false,
            "MakeFlag": true,
        },
        {
            "ProductID": 324,
            "Name": "Chain Stays",
            "ProductNumber": "CS-2812",
            "FinishedGoodsFlag": true,
            "MakeFlag": false,
        },
        {
            "ProductID": 325,
            "Name": "Decal 1",
            "ProductNumber": "DC-8732",
            "FinishedGoodsFlag": false,
            "MakeFlag": true,
        },
        {
            "ProductID": 326,
            "Name": "Coreal",
            "ProductNumber": "DC-9824",
            "FinishedGoodsFlag": true,
            "MakeFlag": true,
        },
        {
            "ProductID": 327,
            "Name": "Down Tube",
            "ProductNumber": "DT-2377",
            "FinishedGoodsFlag": false,
            "MakeFlag": false,
        },
        {
            "ProductID": 328,
            "Name": "Mountain End Caps",
            "ProductNumber": "EC-M092",
            "FinishedGoodsFlag": true,
            "MakeFlag": true,
        },
        {
            "ProductID": 329,
            "Name": "Road End Caps",
            "ProductNumber": "EC-R098",
            "FinishedGoodsFlag": false,
            "MakeFlag": false,
        },
        {
            "ProductID": 330,
            "Name": "Touring End Caps",
            "ProductNumber": "EC-T209",
            "FinishedGoodsFlag": false,
            "MakeFlag": true,
       ...