单击编辑链接时，带有响应式FooTable插件的GridView中断
[英]GridView with responsive FooTable plugin breaks when clicked on edit link
问题描述
I am trying to make gridview responsive using footable plugin. 
我正在尝试使用footable插件使Gridview响应。 On page load in mobile view the page gets loaded properly hiding the columns in plus sign but when clicked on edit link of particular row the page gets loaded but plus sign of footable gets disabled. 在移动视图中加载页面时，页面将正确加载，从而隐藏加号中的列，但是当单击特定行的编辑链接时，页面将被加载，但页脚的正号被禁用。 here is my code: 这是我的代码：
MasterPage.Master 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 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 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 个解决方案
解决方案1
0 2019-03-12 06:38:48
Load Footable under the pageLoad function like 在pageLoad函数下加载Footable之类的
function pageLoad()
{
$(".table").footable();
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
单击链接时弹出带有gridview的窗口 - Popup with a gridview when a link is clicked
FooTable的分页：用于响应数据表的jQuery插件 - Pagination for FooTable: a jQuery Plugin for Responsive Data Tables
FooTable插件日期时间问题 - FooTable plugin datetime issue
稳定的内存插件 - Footable Memory Plugin
FooTable版本3，添加链接 - FooTable Version 3, Add Link
单击工具提示中的链接时，Tooltipster插件不会触发jquery函数 - Tooltipster plugin not firing jquery function when link in in the tooltip is clicked
响应式多级菜单-单击链接时如何关闭菜单？ - Responsive Multi-Level Menu - How to close menu when link is clicked?
单击链接时弹出 - Popup when a link is clicked
单击时隐藏链接 - Hide a link when clicked on
使用LocalScroll插件的点击链接的Need属性 - Need attribute of clicked link, using LocalScroll plugin
相关标签