1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    11
    Vote Rating
    0
    meena.chauhan is on a distinguished road

      0  

    Default Issue in populating data in EXTJS grid

    Issue in populating data in EXTJS grid


    I have an html page with a button and on click of this button ajax call is made I add a grid inside the div.

    The problem I am facing is placing the data of the JSONArray in the extjs grid.

    What is the right way of creating a store with the JSON data for a EXTJS grid.

    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="../../css/ext-all.css">
    <script type="text/javascript" src="../../js/ext-base.js"></script>
    <script type="text/javascript" src="../../js/ext-all.js"></script>
    <script type="text/javascript" src="extjs-grid.js"></script>
    <script type="text/javascript" src="main.js"></script>
    </head>
    <body>
    <button type="button" onclick="loadJsonData()">Get Data</button>
    <div id="table"/>
    </body>
    </html
    <!------------------------------------------------------------------------>
    function loadJsonData()
    {
    var xmlhttp;
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    alert("JSON Response recieved...");
    var jsonData = Ext.decode(xmlhttp.responseText);
    populateDatagrid(jsonData);
    }
    }

    xmlhttp.open("GET","http://localhost:8080/EXTJS-POC/controller",true);
    xmlhttp.send();
    }

    <!------------------------------------------------------------->
    Below is the Servlet code

    public class ControllerServlet extends HttpServlet{
    /**
    *
    */
    private static final long serialVersionUID = 1L;
    public void doGet (HttpServletRequest req, HttpServletResponse res)
    throws ServletException, IOException
    {
    try{
    Class.forName("net.sourceforge.jtds.jdbc.Driver");
    Connection theConnection = DriverManager.getConnection("jdbc:jtdsqlserver://localhost:1433/aa;instance=MYSQLSERVER2008", "sa", "clienta");
    Statement theStatement=theConnection.createStatement();
    ResultSet theResult=theStatement.
    executeQuery("SELECT subdma_cd,period_id ,SUM(CLTV) as CLTV FROM [aa_clienta_d04].[dbo].[_Fact_Gross_Adds_Inwards] group by subdma_cd,period_id");
    JSONArray jsonArray = convertResultSetToJSON(theResult);
    res.setContentType("application/json");
    res.getWriter().write(jsonArray.toString());
    theConnection.close();
    }catch(ClassNotFoundException cex){
    cex.printStackTrace();
    }
    catch(SQLException ex){
    ex.printStackTrace();
    }
    }

    <!------------------------------------------------------------->
    Ext.require([
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.util.*',
    'Ext.state.*'
    ]);
    function populateDatagrid(jsonData) {
    Ext.QuickTips.init();

    // setup the state provider, all state information will be saved to a cookie
    Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

    alert("testing json");
    var length = jsonData.length;

    alert(jsonData[0].subdma_cd+","+ jsonData[0].period_id+"'"+jsonData[0].CLTV+","+length);;
    var myStore = Ext.create('Ext.data.ArrayStore', {
    fields: [
    {name: 'subdma_cd'},
    {name: 'period_id'},
    {name: 'CLTV'}

    ],
    data: jsonData
    });
    // create the Grid
    var grid = Ext.create('Ext.grid.Panel', {
    store: myStore,
    stateful: true,
    stateId: 'stateGrid',
    columns: [
    {
    text : 'subdma_cd',
    sortable : false,
    dataIndex: 'subdma_cd'
    },
    {
    text : 'period_id',
    width : 75,
    sortable : true,
    dataIndex: 'period_id'
    },
    {
    text : 'CLTV',
    width : 75,
    sortable : true,
    dataIndex: 'CLTV'
    }
    ],
    height: 350,
    width: 600,
    title: 'Array Grid',
    renderTo: 'table',
    viewConfig: {
    stripeRows: true
    }
    });

    };

  2. #2
    Sencha User
    Join Date
    Mar 2012
    Posts
    11
    Vote Rating
    0
    meena.chauhan is on a distinguished road

      0  

    Default


    I got the solution to this problem, I should use JSONStore instead of ArrayStore.

  3. #3
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,639
    Vote Rating
    103
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Sweet... And next time please post in Help section and use CODE tags.

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar