Grid -in Panel which has layout- couldnt show records

  1. #1

    Grid -in Panel which has layout- couldnt show records

    Hi all,
    I have used FormPanel in GridPanel's TopBar for user can select parameter values, on Ext.Net
    in Ext.Net.Mobile there is no TopBar, so i try to use panel which has VBox layout as container, FormPanel and Grid in it.
    but if panel has layout config, grid couldnt show records.


    @using Ext.Net.Mobile;
    @using Ext.Net.Mobile.MVC;
    @{
        Layout = null;
        var X = Html.X();
    }
    <!DOCTYPE html>
    <html>
    <head>
        <title>Ext.NET Mobile MVC Sample</title>
    </head>
    <body>
        @Html.X().ResourceManager()
    
        @(Html.X().Panel()
            .Layout(LayoutType.VBox)
            .Padding(10)
            .Items(
              X.FormPanel()
               .Items(
                  X.NumberField().Label("Number")
               ),
              X.Grid().Height(500)
                 .Title("Simpsons")
                 .Store(X.Store()
                    .Fields("name", "email", "phone")
                    .Proxy(p =>
                    {
    
                        var proxy = new AjaxProxy();
                        proxy.Reader.Add(new JsonReader() { RootProperty = "data" });
                        proxy.Url = Url.Action("GetData");
                        p.Add(proxy);
                    })
                    .AutoLoad(true)
                 )
                    .Columns(
                        X.Column().Text("Name").DataIndex("name").Width(200),
                        X.Column().Text("Email").DataIndex("email").Width(250),
                        X.Column().Text("Phone").DataIndex("phone").Width(150)
                    )
               )
        )
    </body>
    </html>
    using Ext.Net.Mobile.MVC;
    using System.Collections.Generic;
    using System.Web.Mvc;
    
    public class ExtNetMobileController : Controller
    {
        public ActionResult Index()
        {
            return this.View();
        }
     
    
        public ActionResult GetData()
        {
            var data = new List<object>
                {
                    new
                    {
                        name = "Lisa",
                        email = "lisa@simpsons.com",
                        phone = "555-111-1224"
                    },
    
                    new
                    {
                        name = "Bart",
                        email = "bart@simpsons.com",
                        phone = "555-222-1234"
                    },
    
                    new
                    {
                        name = "Homer",
                        email = "homer@simpsons.com",
                        phone = "555-222-1244"
                    },
    
                    new
                    {
                        name = "Marge",
                        email = "marge@simpsons.com",
                        phone = "555-222-1254"
                    }
                };
            return this.Store(data);
        }
    }
  2. #2
    Hello @unicorn64!

    You want to use toolbars, and dock them to the desired side of the panel!

    - Ext.NET Mobile examples - Toolbars

    For best experience browsing the mobile examples explorers on desktop, please use chrome and enable device emulation mode (in Firefox, the corresponding feature would be 'responsive design mode' and enable touch events -- little hand that is then shown).

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    thanks @fabricio.murta,

    ok, i will look this example,
    but the real problem is, grid doesnt show records if it is in a panel and panel's layout is VBox or HBox
  4. #4
    Hello again, @unicorn64!

    The idea would be to keep just the panel, Fullscreen="true" on the page (constrained viewport, mobile devices small, right?)

    Besides, I'm missing in your example either:
    - giving the outer panel dimensions (width/height)
    - telling the panel it must occupy all viewport (Fullscreen="true")
    - wrapping the page to an explicit viewport in a similar way to Ext.NET for desktop/tablet

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. grid panel does not clear the records
    By danillofratta in forum 2.x Help
    Replies: 2
    Last Post: Sep 26, 2013, 4:32 PM
  2. Replies: 6
    Last Post: Nov 13, 2012, 5:07 PM
  3. Sorting within Grid panel grouped records
    By ssenthil21 in forum 1.x Help
    Replies: 1
    Last Post: Jul 04, 2011, 8:42 AM
  4. Replies: 4
    Last Post: May 14, 2010, 3:29 PM
  5. [CLOSED] How to add the records to grid panel dynamically?
    By Etisbew in forum 1.x Premium Help
    Replies: 9
    Last Post: Oct 02, 2009, 7:41 AM

Posting Permissions