|
<div id="Grid"></div>
<script type="text/x-jsrender" id="gridColumnChooserTemplate">
<a class="e-toolbaricons">CC</a>
</script>
<script type="text/javascript">
$(function () {
$("#Grid").ejGrid({
dataSource: window.gridData,
toolbarSettings: { showToolbar: true, customToolbarItems: [{ templateID: "#gridColumnChooserTemplate" }] },
toolbarClick: "onToolBarClick",
showColumnChooser: true,
dataBound: function (args) {
setTimeout(ej.proxy(function (e) {
var elem = this.element.attr("id");
this.element.find(".e-ccButton").addClass("e-hide");
//add e-ccButton to the column chooser button template
//after hiding the default button
$("#" + elem + "_gridColumnChooserTemplate").addClass("e-ccButton");
this.element.css("margin-top", "0px");
$("#" + elem + "ccDiv").ejDialog({
width: '230px',
height: '309px',
showOnInit: false,
});
$("#" + elem + "liScrollerDiv").ejScroller({ height: '228', width: '228', buttonSize: 0 });
$("#" + elem + "liScrollerDiv").ejScroller('refresh');
}, this,args), 0);
},
});
});
function onToolBarClick(sender) {
. . .
. . .
else if (sender.itemName == "gridColumnChooserTemplate")
$("#" + this.element.attr("id") + "ccDiv").ejDialog("open");
else
this.refreshContent();
}
</script>
| 
