GithubHelp home page GithubHelp logo

jq.grid's People

Contributors

aiska avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

jq.grid's Issues

Sub grid NOT working - DataURL method not called and sub grid not displayed

Hi Aiska,

I picked up the latest version 1.1.3 and most of it seems to work except for Sub-Grids. The sub-grid Json DataURL method in NOT invoked, when a row is expanded the subgrid is not displayed (no table, header or rows).

I modified your Jq.Grid.Sample retaining the InvoiceHeader model as follows, any help to get this working would be appreciated.

Thanks

MODEL:

  public class SubGridExample
  {
      public JQGrid Grid { get; set; }
      public JQGrid SubGrid { get; set; }

      public SubGridExample()
      {
        Grid = new JQGrid()
        {
          ID = "MainGrid",
          Columns = new List<JQGridColumn>()
          {
              new JQGridColumn()
              {
                  DataField = "id", PrimaryKey = true, Visible = false,
              },
              new JQGridColumn()
              {
                  DataField = "invdate", HeaderText = "Invoice Date", 
                  DataFormatString = "{0:MM/dd/yyyy}",
              },
              new JQGridColumn()
              {
                  DataField = "name", HeaderText = "Customer Name",
              },
          },
        };

        Grid.ClientSideEvents.SubGridRowExpanded = "OnSubGridRowExpanded";
        Grid.HierarchySettings.HierarchyMode = HierarchyMode.Parent;

        SubGrid = new JQGrid()
        {
          ID = "SubGrid",
          Columns = new List<JQGridColumn>()
          {
              new JQGridColumn()
              {
                  DataField = "amount", DataFormatString = "{0:C}",
              },
              new JQGridColumn()
              {
                  DataField = "tax", DataFormatString = "{0:0.00\\%}",
              },
              new JQGridColumn()
              {
                  DataField = "total", DataFormatString = "{0:C}",
              },
          },
        };
        SubGrid.HierarchySettings.HierarchyMode = HierarchyMode.Child;
      }
  }

CONTROLLER:

    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            JQGridModel<invheader> model = new JQGridModel<invheader>("JsonExample");
            model.Grid.DataUrl = Url.Action("Data");
            return View(model);
        }

        [HttpPost]
        public JsonResult Data()
        {
            JQGridModel<invheader> model = new JQGridModel<invheader>();
            using (DataContext ctx = new DataContext())
            {
                return model.Grid.DataBind(ctx.InvoiceHeader.AsQueryable());
            }
        }

        public ActionResult SubGrid()
        {
          SubGridExample model = new SubGridExample();
          model.Grid.DataUrl = Url.Action("MainGridData");
          model.SubGrid.DataUrl = Url.Action("SubGridData");
          return View(model);
        }

        [HttpPost]
        public JsonResult MainGridData()
        {
          SubGridExample model = new SubGridExample();
          model.Grid.DataUrl = Url.Action("MainGridData");
          model.SubGrid.DataUrl = Url.Action("SubGridData");
          using (DataContext ctx = new DataContext())
          {
            return model.Grid.DataBind(ctx.InvoiceHeader.AsQueryable());
          }
        }

        [HttpPost]
        public JsonResult SubGridData(string parentRowID)
        {
          int id = Convert.ToInt32(parentRowID);
          SubGridExample model = new SubGridExample();
          model.Grid.DataUrl = Url.Action("MainGridData");
          model.SubGrid.DataUrl = Url.Action("SubGridData");
          using (DataContext ctx = new DataContext())
          {
            return model.Grid.DataBind(ctx.InvoiceHeader.AsQueryable());
          }
        }
    }

VIEW:

  @model Jq.Grid.Sample.Models.SubGridExample

  @section Scripts {
    @Styles.Render("~/Content/themes/base/css")
    @Styles.Render("~/Content/ui.jqgrid.css")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/Scripts/i18n/grid.locale-en.js")
    @Scripts.Render("~/Scripts/jquery.jqGrid.src.js")
    <!-- The Grid Script client-side javascript -->
    @Html.Grid().JQGridScript(Model.Grid)
    @Html.Grid().JQGridScript(Model.SubGrid)
  }

  @{ ViewBag.Title = "SubGrid"; }

  @Html.Grid().JQGridPartial(Model.Grid)
  @Html.Grid().JQGridPartial(Model.SubGrid)

  <p> 
    @Html.ActionLink("MainGrid Example", "Index")
  </p>

  <script type="text/javascript">
    function OnSubGridRowExpanded(subgrid_id, row_id) {
      showSubGrid_SubGrid(subgrid_id, row_id);
    }
  </script>

RESULT: On expanding first row the sub-grid is empty and Json method
public JsonResult SubGridData(string parentRowID)
is not invoked in debugger

image

Firebug Subgrid Script

 <!-- The Grid Script client-side javascript -->
<script type="text/javascript">
$(document).ready(function() {$('#MainGrid').jqGrid({url: '/Home/MainGridData?jqGridID=MainGrid',mtype: 'POST',datatype: 'json',page: 1,colNames: ["id","Invoice Date","Customer Name"],colModel: [{"searchoptions":{"searchhidden":true},"index":"id","hidden":true,"key":true,"name":"id"},{"width":75,"index":"invdate","searchoptions":{},"name":"invdate"},{"index":"name","searchoptions":{},"name":"name"}],viewrecords: true,scrollrows: false,prmNames: { id: "id" },headertitles: true,autowidth: true,pager: $('#MainGrid_pager'),subGrid: true,subGridOptions: {},subGridRowExpanded: OnSubGridRowExpanded,loadError: jqGrid_aspnet_loadErrorHandler,hoverrows: false,rowNum: 10,rowList: [10,20,30],editDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },editData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},addDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },editData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},delDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },delData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},searchDialogOptions: {"resize":false,"recreateForm":true},jsonReader: { id: "id" },sortorder: 'asc',height: '100%',viewsortcols: [false,'vertical',true]})
.bindKeys();
function jqGrid_aspnet_loadErrorHandler(xht, st, handler) {$(document.body).css('font-size','100%'); $(document.body).html(xht.responseText);};});</script>
<script type="text/javascript">
function showSubGrid_SubGrid(subgrid_id, row_id, message, suffix) {var subgrid_table_id, pager_id;
subgrid_table_id = subgrid_id+'_t';
pager_id = 'p_'+ subgrid_table_id;
if (suffix) { subgrid_table_id += suffix; pager_id += suffix; }
if (message) $('#'+subgrid_id).append(message);
$('#'+subgrid_id).append('<table id=" + subgrid_table_id + " class=scroll></table><div id=" + pager_id + " class=scroll></div>');
$('#' + subgrid_table_id).jqGrid({url: '/Home/SubGridData?jqGridID=SubGrid&parentRowID=' + row_id + '',mtype: 'POST',datatype: 'json',page: 1,colNames: ["amount","tax","total"],colModel: [{"index":"amount","searchoptions":{},"name":"amount"},{"index":"tax","searchoptions":{},"name":"tax"},{"index":"total","searchoptions":{},"name":"total"}],viewrecords: true,scrollrows: false,prmNames: { id: "amount" },headertitles: true,pager: $('#' + pager_id),loadError: jqGrid_aspnet_loadErrorHandler,hoverrows: false,rowNum: 10,rowList: [10,20,30],editDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },editData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},addDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },editData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},delDialogOptions: {"recreateForm":true,errorTextFormat:function(data) { return 'Error: ' + data.responseText },delData:{ __RequestVerificationToken: $('input[name=__RequestVerificationToken]').val() }},searchDialogOptions: {"resize":false,"recreateForm":true},jsonReader: { id: "amount" },sortorder: 'asc',viewsortcols: [false,'vertical',true]})
.bindKeys();
function jqGrid_aspnet_loadErrorHandler(xht, st, handler) {$(document.body).css('font-size','100%'); $(document.body).html(xht.responseText);};}</script>

GridColumn data annotaion

When I download and build the project I get this error:

Error 6 The type or namespace name 'GridColumn' could not be found (are you missing a using directive or an assembly reference?) C:\Temp\VS10 Web\Jq.Grid.Sample\Jq.Grid.Sample\Models\invheader.cs 8 15 Jq.Grid.Sample

It seems to have an issue with "GridColumn"

What am I missing? Jq.Grid.dll?? is that the commercial version?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.