jquery - jqGrid - 在 jquery 选项卡中打开问题(在 Firefox 和 Google Chrome 上)

标签 jquery firefox jqgrid tabs jqgrid-asp.net

我开发了一个非常简单的 MVC 应用程序来测试 trirand 的 jqGrid for MVC。

应用程序在 jquery 选项卡组中打开 jqgrid,并且 IE 一切正常。但是,当我使用 Firefox 时,jqgrid 仅偶尔在第一个选项卡中打开(但不在任何其他选项卡下),而在 Chrome 中,我的 jqgrid 似乎不会在组的任何选项卡下打开。

我是一个 MVC 新手(并且只测试了 jqgrid 几天),但我知道我的用户会想要使用不同的浏览器。 Trirand 没有返回任何答案,因此想知道其他人是否也遇到过类似的问题。

我实际上刚刚根据 Trirand 站点上的示例应用程序中的 Controller 和模型实现了 jqgrid,然后将其与简单的 jquery 选项卡组组合在一起。

我的MVC详细信息页面如下;

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<PRAMSAPP.Models.Family>" %>
<%@ Import Namespace="Trirand.Web.Mvc" %>
<%@ Import Namespace="PRAMSAPP.Controllers" %>
<%@ Import Namespace="PRAMSAPP.Models" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Details
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <link rel="stylesheet" type="text/css" href="/scripts/jquery-ui-1.7.2.custom.css" /> 
 <script type="text/javascript" src="/scripts/jquery-1.3.2.min.js"></script> 
 <script type="text/javascript" src="/scripts/jquery-ui-1.7.2.custom.min.js"></script> 

    <fieldset>
        <legend>Family</legend>

        <div class="display-field"><%= Html.Encode(Model.FamilyID) %></div>
        <div class="display-field"><%= Html.Encode(Model.FamilySurname) %></div>

    </fieldset>


    <div id="tabs">


    <ul> 
     <li>
      <%= Html.ActionLink("GridChildren", "GridDemo", new { controller = "Grid", id = Model.FamilyID })%>
     </li>


    <li>
    <%= Html.ActionLink("Children", "ShowFamiliesChildren", new { famid = Model.FamilyID, page = Page})%>
    </li>

    </ul>


    </div>

    <p>

        <%= Html.ActionLink("Edit", "Edit", new { id=Model.FamilyID }) %> |
        <%= Html.ActionLink("Back to List", "Index") %>
    </p>
<script type="text/javascript">
    $(function() { $('#tabs').tabs(); });  
         </script>
</asp:Content>

And My Controller page is as follows;

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<PRAMSAPP.Models.FamiliesChildrenJqGridModel>" %>
<%@ Import Namespace="Trirand.Web.Mvc" %>
<%@ Import Namespace="PRAMSAPP.Controllers" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <!-- The jQuery UI theme that will be used by the grid -->    
       <link rel="stylesheet" type="text/css" media="screen" href="/Content/themes/redmond/jquery-ui-1.7.1.custom.css" />    
    <!-- The Css UI theme extension of jqGrid -->
    <link rel="stylesheet" type="text/css" media="screen" href="/Content/themes/ui.jqgrid.css" />    
    <!-- jQuery library is a prerequisite for jqGrid -->
    <script type="text/javascript" src="/Scripts/jquery-1.3.2.min.js"></script>    
    <!-- language pack - MUST be included before the jqGrid javascript -->
    <script type="text/javascript" src="/Scripts/grid.locale-en.js"></script>


<script type="text/javascript" src="/Scripts/jqgrid/jquery.jqGrid.min.js"></script>



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

最佳答案

由于我没有使用过 jqGrid-ASP.NET,所以这有点摸不着头脑,但您可以在选项卡准备就绪时,通过选项卡的 show 事件尝试初始化网格:

$('#tabs').tabs({
    show: function(event, ui) {
        // Initialize your jqGrid in here
    }
});

关于jquery - jqGrid - 在 jquery 选项卡中打开问题(在 Firefox 和 Google Chrome 上),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2553751/

相关文章:

javascript - 如何在滚动上反转 css 过渡以实现飞入/飞出效果

javascript - img.onerror 似乎不适用于 IE8

firefox - Selenium Webdriver http.client.BadStatusLine : ' ' error?

jquery - 需要改变jqgrid的位置

javascript - 如果 hasClass 则将 addClass 添加到父级

当 contentType=application/json 时 Jquery JQGrid 中断?

javascript - 使用 jQuery 的目标伪类

javascript - Firefox 和 Chrome 中的 IndexedDB 错误 : Unknown error and DOMException

asp.net - jqGrid loadonce 不适用于 asp.net

javascript - jqGrid的addRowData因大量记录而挂起