【问题标题】:Jqgrid implementation in ASP.net MVC code snippet issueASP.net MVC 代码片段问题中的 Jqgrid 实现
【发布时间】:2012-12-16 02:20:59
【问题描述】:

在实现 Jqgrid 时传递参数和调用 get 方法时遇到问题。

我的应用程序是如何工作的,它有一组 .htm 文件,一个对应的 java 脚本文件。现在我想在一个选项卡中实现 jqgrid。我已经添加了所有必要的功能,但我的控制器方法本身没有被调用,请帮助。

这是我的 .htm 文件

<div id="report-tab">
<h2>My Grid Data</h2>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
</div>

这是我的report.js 文件,控制权在init 函数之前,但它不会触发我的c# 函数。 即json方法。

var ReportTab = function () {

    return {
        Init: function () {

           //Control comes till here, but it wont go inside, 
             jQuery(document).ready(function() { 
            jQuery("#list").jqGrid({
                Url: '/Home/GridData',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['Id', 'Votes', 'Title'],
                colModel: [
          { name: 'Id', index: 'Id', width: 40, align: 'left' },
          { name: 'Votes', index: 'Votes', width: 40, align: 'left' },
          { name: 'Title', index: 'Title', width: 200, align: 'left'}],
                pager: jQuery('#pager'),
                rowNum: 10,
                rowList: [5, 10, 20, 50],
                sortname: 'Id',
                sortorder: "desc",
                viewrecords: true,
                imgpath: '/scripts/themes/coffee/images',
                caption: 'My first grid'
            });
        }); 
        }
    }
} ();

这是我在 c# 中的控制器功能

public ActionResult GridData(string sidx, string sord, int page, int rows)
        {
            _logger.LogMethodAndType();

            var jsonData = new
            {
                total = 1, // we'll implement later 
                page = page,
                records = 3, // implement later 
                rows = new[]{
                new {id = 1, cell = new[] {"1", "-7", "Is this a good question?"}},
                new {id = 2, cell = new[] {"2", "15", "Is this a blatant ripoff?"}},
                new {id = 3, cell = new[] {"3", "23", "Why is the sky blue?"}}
            }
            };
            return Json(jsonData, JsonRequestBehavior.AllowGet);
        }

提前致谢。

【问题讨论】:

  • jQuery(document).ready(function() { 将仅在刷新 DOM 时调用..尝试将 jqgrid 代码放在 document.ready 之外
  • @Rajesh,它没有用,我只是按照你的建议评论了那部分,它没有用。请告诉我任何替代方式
  • 好吧,有一件事我无法理解你为什么将你的 jqgrid 初始化代码放在一个方法中?在这里 var ReportTab = function () { return { Init: function () { ... DO您希望在特定事件上显示网格吗?你能在屏幕上看到网格吗?您的问题是网格刷新或控制台上的任何错误?
  • 实际上我是这个asp的新手,在我的项目中,所有页面都是这样实现的,所以我也想以类似的方式实现它。所以请建议我如何克服这个问题
  • 您在控制台上遇到任何错误?

标签: jquery asp.net-mvc jquery-plugins asp.net-mvc-2 jqgrid


【解决方案1】:

尝试在屏幕上渲染网格

jQuery(document).ready(function() { 
            jQuery("#list").jqGrid({
                Url: '/Home/GridData',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['Id', 'Votes', 'Title'],
                colModel: [
          { name: 'Id', index: 'Id', width: 40, align: 'left' },
          { name: 'Votes', index: 'Votes', width: 40, align: 'left' },
          { name: 'Title', index: 'Title', width: 200, align: 'left'}],
                pager: jQuery('#pager'),
                rowNum: 10,
                rowList: [5, 10, 20, 50],
                sortname: 'Id',
                sortorder: "desc",
                viewrecords: true,
                imgpath: '/scripts/themes/coffee/images',
                caption: 'My first grid'
            });
        });

如果正确导入 jquery 和 jqgrid 库,网格将正确呈现。 Table Id:list 也应该存在于 dom/HTML.. 如果它没有呈现,那么你要么在萤火虫控制台上收到任何错误,要么表容器 div 被隐藏

【讨论】:

  • 如果我添加此代码,我会收到错误,我刚刚导入所有内容,我收到错误 Microsoft JScript 运行时错误:对象不支持此属性或方法
猜你喜欢
  • 2011-07-26
  • 2011-12-30
  • 2023-03-28
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-08-08
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多