单击编辑链接时,具有响应式FooTable插件的GridView会中断

时间:2017-05-29 12:45:01

标签: javascript c# asp.net gridview footable

我正在尝试使用footable插件使gridview响应。在移动视图中的页面加载中,页面正确加载,将列隐藏在加号中,但是当单击特定行的编辑链接时,页面将被加载但是加号的加号被禁用。这是我的代码:

MasterPage.Master

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Surveillance.master.cs" Inherits="Surviellance_Surveillance" %>

<!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 runat="server">
<title></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1, user-scalable=no" />
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<link href="../Style/StyleSheet.css" rel="stylesheet" />
<link href="../Content/font-awesome.min.css" rel="stylesheet" />
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/0.1.0/css/footable.min.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/jquery-1.9.1.min.js"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div id="header">

    <form id="frm" runat="server">
        <header>
        </header>
        <div class="container-fluid" id="body">
            <asp:ContentPlaceHolder ID="BodyContentPlaceHolder" runat="server">
            </asp:ContentPlaceHolder>
            <div id="blankDiv" class="overlay">
                <div class="messagealert " id="alert_container">
                </div>
            </div>
        </div>
        <footer class="panel-footer white">
            <div class="row">
            </div>
        </footer>
    </form>
</div>
<script src="../Scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/0.1.0/js/footable.min.js"></script>
<script>
    $(function () {
         $('.AspGridview').footable({
             breakpoints: {
                phone: 480,
                tablet: 1024
            }
        });
    });
</script>
</body>
</html>

ChildPage.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Surviellance/Surveillance.master" AutoEventWireup="true" CodeFile="GSMFlagMaster.aspx.cs" Inherits="Surviellance_GSMMaker" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="BodyContentPlaceHolder" runat="Server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true">
    <ContentTemplate>
         <div class="panel-body">
            <fieldset>
                <legend class="legend">

                </legend>
                <div class="panel panel-default">
                    <div class="panel-body table-responsive">

                        <div class="table table-borderless">
                           <asp:GridView ID="grdGMasterDetails" runat="server"
                                AutoGenerateColumns="False"
                                AllowSorting="true" AllowPaging="true" PageSize="7"
                                CssClass="table table-responsive table-bordered table-hover AspGridview footable"
                                OnPageIndexChanging="grdGMasterDetails_PageIndexChanging"
                                OnRowDataBound="grdGMasterDetails_RowDataBound"
                                OnSorting="grdGMasterDetails_Sorting">
                                <Columns>
                                    <asp:BoundField DataField="G_FLAG_CODE" SortExpression="G_FLAG_CODE" HeaderText="Flag Code"></asp:BoundField>
                                    <asp:BoundField DataField="G_FLAG_DESCRIPTION" SortExpression="G_FLAG_DESCRIPTION" HeaderText="Flag Description"></asp:BoundField>
                                    <asp:TemplateField HeaderText="Trade to Trade Flag" SortExpression="TRADE_TO_TRADE_FLAG">
                                        <ItemTemplate>
                                            <asp:CheckBox ID="chkTtoT" runat="server" Enabled="false" />
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:BoundField DataField="ASD_PER" SortExpression="ASD_PER" HeaderText="ASD"></asp:BoundField>
                                    <asp:TemplateField HeaderText="Weekly Trading" SortExpression="WEEK_TRADING_ALLOWED">
                                        <ItemTemplate>
                                            <asp:CheckBox ID="ChkWeek" runat="server" Enabled="false" />
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Monthly Trading" SortExpression="MONTH_TRADING_ALLOWED">
                                        <ItemTemplate>
                                            <asp:CheckBox ID="ChkMonth" runat="server" Enabled="false" />
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:BoundField DataField="EFFECTIVE_FROM" SortExpression="EFFECTIVE_FROM" HeaderText="Effective From" DataFormatString="{0:d}"></asp:BoundField>
                                    <asp:BoundField DataField="EFFECTIVE_TO" SortExpression="EFFECTIVE_TO" HeaderText="Effective To" DataFormatString="{0:d}"></asp:BoundField>
                                    <asp:BoundField DataField="STATUS" SortExpression="STATUS" HeaderText="Status"></asp:BoundField>
                                    <asp:BoundField DataField="ENTRY_BY" SortExpression="ENTRY_BY" HeaderText="Entry By"></asp:BoundField>
                                    <asp:BoundField DataField="ENTRY_DATE" SortExpression="ENTRY_DATE" HeaderText="Entry Date" DataFormatString="{0:d}"></asp:BoundField>
                                    <asp:TemplateField>
                                        <ItemTemplate>
                                            <asp:LinkButton ID="LnkButton" runat="server" CommandName="CMDEdit" CausesValidation="false" Font-Underline="true" OnClick="LnkButton_Click">Edit</asp:LinkButton>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                </Columns>
                                <AlternatingRowStyle BackColor="#c0e6fa" />
                                <HeaderStyle BackColor="#0089d0" ForeColor="White" HorizontalAlign="Left" />
                                <PagerStyle BackColor="#0089d0" Font-Bold="true" ForeColor="White" />
                            </asp:GridView>
                        </div>
                    </div>
                </div>
            </fieldset>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

childpage.aspx.cs

//binding data to gridview
protected DataTable BindGrid()
{
    using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["AppConn"].ToString()))
    {
        con.Open();
        string query = "SELECT * FROM DBO.WEB_SURV_G_FLAG_MASTER ORDER BY [G_FLAG_CODE]";
        SqlCommand cmd = new SqlCommand(query, con);
        cmd.CommandType = CommandType.Text;
        cmd.Connection = con;
        SqlDataAdapter adapter = new SqlDataAdapter(cmd);
        DataTable dt = new DataTable();
        adapter.Fill(dt);
        dt.DefaultView.Sort = "G_FLAG_CODE ASC";
        grdGMasterDetails.DataSource = dt;
        grdGMasterDetails.DataBind();
        grdGMasterDetails.HeaderRow.TableSection = TableRowSection.TableHeader;

        grdGMasterDetails.HeaderRow.Cells[0].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[1].Attributes["data-class"] = "expand";
        grdGMasterDetails.HeaderRow.Cells[2].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[3].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[4].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[5].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[6].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[7].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[8].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[9].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[10].Attributes["data-hide"] = "phone";
        grdGMasterDetails.HeaderRow.Cells[11].Attributes["data-hide"] = "phone";
        int count = grdGMasterDetails.Rows.Count;
        lblRecordsCount.Text = count.ToString();
        con.Close();
        return dt;            
    }
}

1 个答案:

答案 0 :(得分:0)

在pageLoad函数下加载Footable之类的

function pageLoad()
{
    $(".table").footable();
}