PDA

View Full Version : [CLOSED] grid ColumnModel columns Javascript



PoloTheMonk
Aug 19, 2014, 10:53 AM
Hi,
I need to enumerate all rows in columnmodel in javascript



<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Test.aspx.vb" Inherits="Test" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>test moving columns</title>
<script src="Scripts/jquery-1.6.4.js"></script>
<script type="text/javascript">
$(window).load(function () {
var grid = GetExtNetObj("gridTest");
$("#ByJS").html(grid.columns.length);
});
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" ID="ResourceMng"/>
<ext:GridPanel ID="gridTest" runat="server" Title="Test moving" Border="true">
<HeaderConfig runat="server">
</HeaderConfig>
<Store>
<ext:Store ID="StoreTest" runat="server" RemoteFilter="true" AutoLoad="false">
<Model>
<ext:Model ID="ModelTest" runat="server">
<Fields>
<ext:ModelField Name="LOCK1" Type="String"></ext:ModelField>
<ext:ModelField Name="LOCK2" Type="String"></ext:ModelField>
<ext:ModelField Name="LOCK3" Type="String"></ext:ModelField>
<ext:ModelField Name="FREE1" Type="String"></ext:ModelField>
<ext:ModelField Name="FREE2" Type="String"></ext:ModelField>
<ext:ModelField Name="FREE3" Type="String"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModelTest" runat="server">
<Columns>
<ext:Column runat="server" ID="Lock1" DataIndex="LOCK1" Width="150" Text="LOCK1" Align="Left" Locked="true" Hideable="false" Sortable="true"></ext:Column>
<ext:Column runat="server" ID="Lock2" DataIndex="LOCK2" Width="150" Text="LOCK2" Align="Left" Locked="true" Hideable="false" Sortable="true"></ext:Column>
<ext:Column runat="server" ID="Lock3" DataIndex="LOCK3" Width="150" Text="LOCK3" Align="Left" Locked="true" Hideable="false" Sortable="true"></ext:Column>
<ext:Column runat="server" Text="Gruppo" DataIndex="GRUPPO">
<Columns>
<ext:Column runat="server" ID="Free1" DataIndex="FREE1" Width="150" Text="FREE1" Align="Left" Sortable="true"></ext:Column>
<ext:Column runat="server" ID="Free2" DataIndex="FREE2" Width="150" Text="FREE2" Align="Left" Sortable="true"></ext:Column>
<ext:Column runat="server" ID="Free3" DataIndex="FREE3" Width="150" Text="FREE3" Align="Left" Sortable="true"></ext:Column>
</Columns>
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
<div id="ByVB">
<%=gridTest.ColumnModel.Columns.Count %>
</div>
<div id="ByJS">
</div>
</form>
</body>
</html>


In DIV ByVB total is 4
In DIV ByJS total is 6

How can I access to gridTest.ColumnModel.Columns with javascript?
Thanks in advance
Polo

Daniil
Aug 19, 2014, 1:25 PM
Hi @PoloTheMonk,

You can access column via a headerCt of the locked and normal (not locked) parts of a locking GridPanel.

App.gridText.lockedGrid.headerCt.items.each(functi on(col) {
console.log(col.text);
});

App.gridText.normalGrid.headerCt.items.each(functi on(col) {
console.log(col.text);
})

PoloTheMonk
Aug 20, 2014, 10:08 AM
Hi @Daniil

if I try your code I get this error



Uncaught TypeError: Cannot read property 'normalGrid' of undefined

or


Uncaught TypeError: Cannot read property 'lockedGrid' of undefined


Is there a solution?
Thanks
Bye
Polo

Daniil
Aug 20, 2014, 11:18 AM
Please replace

App.gridText
with

App.gridTest

PoloTheMonk
Aug 20, 2014, 12:16 PM
Well!
Done with this



var grid = GetExtNetObj("gridTest");
grid.normalGrid.headerCt.items.each(function (col) {
console.log(col.text);
});

Good job @Daniil
Thanks!