How to display two grids in same page using jquery?

Posted by kumar on Stack Overflow See other posts from Stack Overflow or by kumar
Published on 2010-04-20T00:46:02Z Indexed on 2010/04/20 0:53 UTC
Read the original article Hit count: 386

Filed under:

hello friends,

I have this code to display jquery grid

  <div>           
        <%= Html.Trirand().JQGrid(Model.OrdersGrid, "JQGrid1") %>
    </div>

Server side I have this code..

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Trirand.Web.Mvc;
using System.Web.UI.WebControls;

namespace JQGridMVCExamples.Models
{
    public class OrdersJqGridModel
    {
        public OrdersJqGridModel()
        {            
            OrdersGrid = new JQGrid
                             {
                                 Columns = new List<JQGridColumn>()
                                 {
                                     new JQGridColumn { DataField = "OrderID", 
                                                        Width = 50 },
                                     new JQGridColumn { DataField = "OrderDate", 
                                                        Width = 100, 
                                                        DataFormatString = "{0:d}" },
                                     new JQGridColumn { DataField = "CustomerID", 
                                                        Width = 100 },
                                     new JQGridColumn { DataField = "Freight", 
                                                        Width = 75 },
                                     new JQGridColumn { DataField = "ShipName" }                                     
                                 },
                                 Width = Unit.Pixel(640)                                 
                             };

            OrdersGrid.ToolBarSettings.ShowRefreshButton = true;            
        }

        public JQGrid OrdersGrid { get; set; }
    }
}

This is displaying only one grid... I I want to display two grids that Is how to display other grid in Same page?

that is can I do like this?

<div>           
        <%= Html.Trirand().JQGrid(Model.OrdersGrid, "JQGrid1") %>
    </div>
<div>
<%= Html.Trirand().JQGrid(Model.OrdersGrid, "JQGrid2") %>
</div>

in the same page.. if yes how to handle the Sever side grid? bec Server side grid columns are differnt from jqGrid1 and Jqgrid2,,,,

On Row Click on JQGrid1 I need to display JqGrid2. Please can anyone help me out about this..

Thanks

© Stack Overflow or respective owner

Related posts about jQuery