gridview with javascript
Karim Segura Jul 26, 2012 3:24 PMHi, community.
I read the beginners guide to qlikview extension, and I have the concernt to extend a javascript grid view.
I've been searchingh in internet tutorials, qlikview questions and answers, without full success.
I can't integrate the scripts into my extension object.
I am attaching my code, may be I am doing something wrong.
The basic goal for this stuff, is get a gridview with full navigation in the cells.
I will appreciate any kind of help to get this working.
Thanks in advance.
Karim.
function BasicTable_Init() { Qva.LoadScript("/QvAjaxZfc/QvsViewClient.aspx?public=only&name=Extensions/ksb/BasicTable/scripts/prototype/1.6.1/prototype.js", function(){ Qva.LoadScript("/QvAjaxZfc/QvsViewClient.aspx?public=only&name=Extensions/ksb/BasicTable/scripts/scriptaculous/scriptaculous.js", function(){ Qva.LoadScript("/QvAjaxZfc/QvsViewClient.aspx?public=only&name=Extensions/ksb/BasicTable/scripts/myui/myui.js",BasicTable_Done); }); }); } function BasicTable_Done() { Qva.AddExtension('ksb/BasicTable', function() { Qva.LoadCSS("/QvAjaxZfc/QvsViewClient.aspx?public=only&name=Extensions/ksb/BasicTable/scripts/css/main.css"); // Local variable to hold the reference to QlikView var _this = this; var iFrameWidth = _this.GetWidth(); var iFrameHeight = _this.GetHeight(); // function to handle users clicking on a row window.oncvlrowclick = function(rowIx) { _this.Data.SelectRow(rowIx); } var main = '<div id="mytable" style="position:relative; width: '+iFrameWidth+'px; height: '+iFrameHeight+'px;">lets see</div>'; this.Element.innerHTML = main; var tableModel = { options : { title: 'INBOX: john', pager: { total: 200, pages: 0, currentPage: 1, from: 1, to: 100 }, rowClass : function(rowIdx) { var className = ''; if (rowIdx % 2 == 0) { className = 'hightlight'; } return className; } }, columnModel : [ { id : 'id', title : '#', width : 30, sortable : false }, { id : 'from_name', title : 'From', width : 140 }, { id : 'subject', title : 'Subject', width : 205 }, { id : 'received_date', title : 'Date', width : 100 }, { id: 'comments', title: 'Comments', width: 100 }, { id: 'assigned_to', title: 'Assigned To', width: 100 } ], rows : [ [1,'jim@theshadestore.com', '8990280', '11/05/09', 'test of how long an edit box can be...i hope really long.',''], [2,'jim@theshadestore.com', 'Re: Order # 8881804', '11/06/11', 'test of how long an edit box can be...i hope really long.','zach'], [3,'jim@theshadestore.com', 'RE: 8951062/ 4372288', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [4,'jim@theshadestore.com', 'RE: 7920610 / 4297576', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [5,'jim@theshadestore.com', 'Re: segal GBR shade', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [6,'jim@theshadestore.com', 'RE: 6654030', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [7,'jim@theshadestore.com', 'Re: Fwd: Faulty Shade', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [8,'ann@theshadestore.com', 'Re: IN BIN 11/5', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [9,'support@theshadestore.com', 'Re: Frances Herrera -- 9152309', '11/06/11', 'test of how long an edit box can be...i hope really long.',''], [10,'jim@theshadestore.com', 'RE: Order # 2987393', '11/06/11', 'test of how long an edit box can be...i hope really long.',''] ] }; fd var tableGrid = null; Event.observe(document, 'dom:loaded', function() { tableGrid = new MY.TableGrid(tableModel); tableGrid.show('mytable'); }); },true); } BasicTable_Init();