如何使用带有gridview控件的fancybox [英] how to used fancybox with gridview control
本文介绍了如何使用带有gridview控件的fancybox的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
<script src="fancybox/jquery-1.2.3.pack.js" type="text/javascript"></script>
<script src="fancybox/jquery.fancybox-1.0.0.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="fancybox/fancy.css" />
<script type="text/javascript">
$(document).ready(function () {
$(".fancybox").fancybox();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<fieldset style="width:415px;">
<legend>Bind and Search records example in gridview</legend>
<table>
<tr><td>Search By:
<asp:DropDownList ID="ddlSearchBy" runat="server" AutoPostBack="True"
onselectedindexchanged="ddlSearchBy_SelectedIndexChanged">
<asp:ListItem Text="All">
<asp:ListItem Text="Emp Name">
<asp:ListItem Text="Salary">
<asp:ListItem Text="City">
</td><td>
<asp:TextBox ID="txtSearch" runat="server">
</td><td>
<asp:Button ID="btnSearch" runat="server" Text="Search"
onclick="btnSearch_Click" />
</td></tr>
</table>
<asp:GridView ID="grdEmp" runat="server" AllowSorting="True" EmptyDataText="No records found"
CssClass="rowHover" RowStyle-CssClass="rowHover" ShowHeader="true"
AutoGenerateColumns="False"
AllowPaging="True"
onpageindexchanging="grdEmp_PageIndexChanging"
PageSize="5"
CellPadding="4" ForeColor="#333333"
GridLines="None" Width="100%" onrowcancelingedit="grdEmp_RowCancelingEdit"
onrowdeleting="grdEmp_RowDeleting" onrowediting="grdEmp_RowEditing"
onrowupdating="grdEmp_RowUpdating">
<alternatingrowstyle backcolor="White" forecolor="#284775" />
<columns>
<asp:TemplateField HeaderText="ID">
<itemtemplate>
<asp:Label ID="LblStuID" runat="server" Text='<%# Bind("Emp_id")%>'>
</itemtemplate>
<footertemplate>
<asp:TextBox ID="TxtStuID" runat="server">
</footertemplate>
<asp:TemplateField HeaderText="NAME">
<itemtemplate>
<asp:Label ID="LblStuName" runat="server" Text='<%# Bind("Emp_name") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID="Txtname" runat="server" Text='<%#Bind("Emp_name") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID="Txtname" runat="server">
</footertemplate>
<asp:TemplateField HeaderText="AGE">
<itemtemplate>
<asp:Label ID="LblStuage" runat="server" Text='<%# Bind("Age") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID="Txtage" runat="server" Text='<%#Bind("Age") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID="Txtage" runat="server">
</footertemplate>
<asp:TemplateField HeaderText="SALARY">
<itemtemplate>
<asp:Label ID="Lblslry" runat="server" Text='<%# Bind("Salary") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID="Txtslry" runat="server" Text='<%#Bind("Salary") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID="Txtslry" runat="server">
</footertemplate>
<asp:TemplateField HeaderText="CITY">
<itemtemplate>
<asp:Label ID="Lblcity" runat="server" Text='<%# Bind("City") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID="Txtcity" runat="server" Text='<%#Bind("City") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID="Txtcity" runat="server">
</footertemplate>
<asp:TemplateField HeaderText="ADDRESS">
<itemtemplate>
<asp:Label ID="Lbladd" runat="server" Text='<%# Bind("Address") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID="Txtadd" runat="server" Text='<%#Bind("Address") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID="Txtadd" runat="server">
</footertemplate>
<asp:TemplateField HeaderText=" OPERATION">
<itemtemplate>
<asp:LinkButton ID="BtnEdit" CssClass="fancybox" runat="server" CommandName="Edit" Text="Edit" />
<asp:LinkButton ID="BtnDelete" runat="server" CommandName="Delete" Text="Delete" />
</itemtemplate>
<edititemtemplate>
<asp:LinkButton ID="BthUpdate" runat="server" CommandName="Update" Text="Update" />
<asp:LinkButton ID="BtnCancel" runat="server" CommandName="Cancel" Text="Cancel" />
</edititemtemplate>
</columns>
<%--<columns>
<asp:TemplateField HeaderText=>
<asp:BoundField HeaderText="Emp Name" DataField="Emp_name" ItemStyle-HorizontalAlign="Center" />
<asp:BoundField HeaderText="Age" DataField="Age" ItemStyle-HorizontalAlign="Center" />
<asp:BoundField HeaderText="Salary" DataField="Salary" ItemStyle-HorizontalAlign="Center" />
<asp:BoundField HeaderText="City" DataField="City" ItemStyle-HorizontalAlign="Center" />
<asp:BoundField HeaderText="Address" DataField="Address" ItemStyle-HorizontalAlign="Center" />
</columns> --%>
<editrowstyle backcolor="#999999" />
<footerstyle backcolor="#ffffff" font-bold="True" forecolor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<pagerstyle backcolor="#284775" forecolor="White" horizontalalign="Center" />
<rowstyle cssclass="rowHover" backcolor="#F7F6F3" forecolor="#333333"></rowstyle>
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<sortedascendingcellstyle backcolor="#E9E7E2" />
<sortedascendingheaderstyle backcolor="#506C8C" />
<sorteddescendingcellstyle backcolor="#FFFDF8" />
<sorteddescendingheaderstyle backcolor="#6F8DAE" />
<emptydatarowstyle width="550px" forecolor="Red" font-bold="true">
HorizontalAlign = "Center"/>
</emptydatarowstyle></fieldset>
Hello World!
<div>
<a href="CS.aspx" class="fancybox"> ADD NEW RECORD</a>
<a href="Default4.aspx" class="fancybox">new</a>
<a href="pictures.aspx"></a>
</div>
<div>
<a class="fancybox" href="<%#Eval("Emp_id")%>"></a>
<a class="fancybox" href="<%#Eval("Emp_name")%>"></a>
<a class="fancybox" href="<%#Eval("Age")%>"></a>
<a class="fancybox" href="<%#Eval("Salary")%>"></a>
<a class="fancybox" href="<%#Eval("City")%>"></a>
<a class="fancybox" href="<%#Eval("Address")%>"></a>
</div>
</form>
</body>
</html></div>推荐答案
(document).ready(function () {
(document).ready(function () {
(\".fancybox\").fancybox();
});
</script>
</head>
<body>
<form id=\"form1\" runat=\"server\">
<div>
<fieldset style=\"width:415px;\">
<legend>Bind and Search records example in gridview</legend>
<table>
<tr><td>Search By:
<asp:DropDownList ID=\"ddlSearchBy\" runat=\"server\" AutoPostBack=\"True\"
onselectedindexchanged=\"ddlSearchBy_SelectedIndexChanged\">
<asp:ListItem Text=\"All\">
<asp:ListItem Text=\"Emp Name\">
<asp:ListItem Text=\"Salary\">
<asp:ListItem Text=\"City\">
</td><td>
<asp:TextBox ID=\"txtSearch\" runat=\"server\">
</td><td>
<asp:Button ID=\"btnSearch\" runat=\"server\" Text=\"Search\"
onclick=\"btnSearch_Click\" />
</td></tr>
</table>
<asp:GridView ID=\"grdEmp\" runat=\"server\" AllowSorting=\"True\" EmptyDataText< span class=\"code-keyword\">=\"No records found\"
CssClass=\"rowHover\" RowStyle-CssClass=\"rowHover\" ShowHeader=\"true\"
AutoGenerateColumns=\"False\"
AllowPaging=\"True\"
onpageindexchanging=\"grdEmp_PageIndexChanging\"
PageSize=\"5\"
CellPadding=\"4\" ForeColor=\"#333333\"
GridLines=\"None\" Width=\"100%\" onrowcancelingedit=\"grdEmp_RowCancelingEdit\"
onrowdeleting=\"grdEmp_RowDeleting\" onrowediting=\"grdEmp_RowEditing\"
onrowupdating=\"grdEmp_RowUpdating\">
<alternatingrowstyle backcolor=\"White\" forecolor=\"#284775\" />
<columns>
<asp:TemplateField HeaderText=\"ID\">
<itemtemplate>
<asp:Label ID=\"LblStuID\" runat=\"server\" Text='<%# Bind(\"Emp_id\")%>'>
</itemtemplate>
<footertemplate>
<asp:TextBox ID=\"TxtStuID\" runat=\"server\">
</footertemplate>
<asp:TemplateField HeaderText=\"NAME\">
<itemtemplate>
<asp:Label ID=\"LblStuName\" runat=\"server\" Text='<%# Bind(\"Emp_name\") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID=\"Txtname\" runat=\"server\" Text='<%#Bind(\"Emp_name\") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID=\"Txtname\" runat=\"server\">
</footertemplate>
<asp:TemplateField HeaderText=\"AGE\">
<itemtemplate >
<asp:Label ID=\"LblStuage\" runat=\"server\" Text='<%# Bind(\"Age\") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID=\"Txtage\" runat=\"server\" Text='<%#Bind(\"Age\") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID=\"Txtage\" runat=\"server\">
</footertemplate>
<asp:TemplateField HeaderText=\"SALARY\" >
<itemtemplate>
<asp:Label ID=\"Lblslry\" runat=\"server\" Text='<%# Bind(\"Salary\") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID=\"Txtslry\" runat=\"server\" Text='<%#Bind(\"Salary\") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID=\"Txtslry\" runat=\"server\">
</footertemplate>
< ;asp:TemplateField HeaderText=\"CITY\">
<itemtemplate>
<asp:Label ID=\"Lblcity\" runat=\"server\" Text='<%# Bind(\"City\") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID=\"Txtcity\" runat=\"server\" Text='<%#Bind(\"City\") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID=\"Txtcity\" runat=\"server\">
</footertemplate>
<asp:TemplateField HeaderText=\"ADDRESS\">
<itemtemplate>
<asp:Label ID=\"Lbladd\" runat=\"server\" Text='<%# Bind(\"Address\") %>'>
</itemtemplate>
<edititemtemplate>
<asp:TextBox ID=\"Txtadd\" runat=\"server\" Text='<%#Bind(\"Address\") %>'>
</edititemtemplate>
<footertemplate>
<asp:TextBox ID=\"Txtadd\" runat=\"server\">
</footertemplate>
<asp:TemplateField HeaderText=\" OPERATION\">
<itemtemplate>
<asp:LinkButton ID=\"BtnEdit\" CssClass=\"fancybox\" runat=\"server\" CommandName=\"Edit\" Text=\"Edit\" />
<asp:LinkButton ID=\"BtnDelete\" runat=\"server\" CommandName=\"Delete\" Text=\"Delete\" />
</itemtemplate>
<edititemtemplate>
<asp:LinkButton ID=\"BthUpdate\" runat=\"server\" CommandName=\"Update\" Text=\"Update\" />
<asp:LinkButton ID=\"BtnCancel\" runat=\"server\" CommandName=\"Cancel\" Text=\"Cancel\" />
</edititemtemplate>
</columns >
<%--<columns>
<asp:TemplateField HeaderText=>
<asp:BoundField HeaderText=\"Emp Name\" DataField=\"Emp_name\" ItemStyle-HorizontalAlign=\"Center\" />
<asp:BoundField HeaderText=\"Age\" DataField=\"Age\" ItemStyle-HorizontalAlign=\"Center\" />
<asp:BoundField HeaderText=\"Salary\" DataField=\"Salary\" ItemStyle-HorizontalAlign=\"Center\" />
<asp:BoundField HeaderText=\"City\" DataField=\"City\" ItemStyle-HorizontalAlign=\"Center\" />
<asp:BoundField HeaderText=\"Address\" DataField=\"Address\" ItemStyle-HorizontalAlign=\"Center\" />
</columns> --%>
<editrowstyle backcolor=\"#999999\" />
<footerstyle backcolor=\"#ffffff\" font-bold=\"True\" forecolor=\"White\" />
<HeaderStyle BackColor=\"#5D7B9D\" Font-Bold=\"True\" ForeColor=\"White\" />
< pagerstyle backcolor=\"#284775\" forecolor=\"White\" horizontalalign=\"Center\" />
<rowstyle cssclass=\"rowHover\" backcolor=\"#F7F6F3\" forecolor=\"#333333\"></rowstyle>
<SelectedRowStyle BackColor=\"#E2DED6\" Font-Bold=\"True\" ForeColor=\"#333333\" />
<sortedascendingcellstyle backcolor=\"#E9E7E2\" />
<sortedascendingheaderstyle backcolor=\"#506C8C\" />
<sorteddescendingcellstyle backcolor=\"#FFFDF8\" />
<sorteddescendingheaderstyle backcolor=\"#6F8DAE\" />
<emptydatarowstyle width=\"550px\" forecolor=\"Red\" font-bold=\"true\">
HorizontalAlign = \"Center\"/>
</emptydatarowstyle></fieldset>
Hello World!
<div>
<a href=\"CS.aspx\" class=\"fancybox\"> ADD NEW RECORD</a>
<a href=\"Default4.aspx\" class=\"fancybox\">new</a>
<a href=\"pictures.aspx\"></a>
</div>
<div>
<a class=\"fancybox\" href=\"<%#Eval(\"Emp_id\")%>\"></a>
<a class=\"fancybox\" href=\"<%#Eval(\"Emp_name\")%>\"></a>
<a class=\"fancybox\" href=\"<%#Eval(\"Age\")%>\"></a>
<a class=\"fancybox\" href=\"<%#Eval(\"Salary\")%>\"></a>
<a class=\"fancybox\" href=\"<%#Eval(\"City\")%>\"></a>
<a class=\"fancybox\" href=\"<%#Eval(\"Address\")%>\"></a>
</div>
</form>
</body>
</html></div>
(".fancybox").fancybox(); }); </script> </head> <body> <form id="form1" runat="server"> <div> <fieldset style="width:415px;"> <legend>Bind and Search records example in gridview</legend> <table> <tr><td>Search By: <asp:DropDownList ID="ddlSearchBy" runat="server" AutoPostBack="True" onselectedindexchanged="ddlSearchBy_SelectedIndexChanged"> <asp:ListItem Text="All"> <asp:ListItem Text="Emp Name"> <asp:ListItem Text="Salary"> <asp:ListItem Text="City"> </td><td> <asp:TextBox ID="txtSearch" runat="server"> </td><td> <asp:Button ID="btnSearch" runat="server" Text="Search" onclick="btnSearch_Click" /> </td></tr> </table> <asp:GridView ID="grdEmp" runat="server" AllowSorting="True" EmptyDataText="No records found" CssClass="rowHover" RowStyle-CssClass="rowHover" ShowHeader="true" AutoGenerateColumns="False" AllowPaging="True" onpageindexchanging="grdEmp_PageIndexChanging" PageSize="5" CellPadding="4" ForeColor="#333333" GridLines="None" Width="100%" onrowcancelingedit="grdEmp_RowCancelingEdit" onrowdeleting="grdEmp_RowDeleting" onrowediting="grdEmp_RowEditing" onrowupdating="grdEmp_RowUpdating"> <alternatingrowstyle backcolor="White" forecolor="#284775" /> <columns> <asp:TemplateField HeaderText="ID"> <itemtemplate> <asp:Label ID="LblStuID" runat="server" Text='<%# Bind("Emp_id")%>'> </itemtemplate> <footertemplate> <asp:TextBox ID="TxtStuID" runat="server"> </footertemplate> <asp:TemplateField HeaderText="NAME"> <itemtemplate> <asp:Label ID="LblStuName" runat="server" Text='<%# Bind("Emp_name") %>'> </itemtemplate> <edititemtemplate> <asp:TextBox ID="Txtname" runat="server" Text='<%#Bind("Emp_name") %>'> </edititemtemplate> <footertemplate> <asp:TextBox ID="Txtname" runat="server"> </footertemplate> <asp:TemplateField HeaderText="AGE"> <itemtemplate> <asp:Label ID="LblStuage" runat="server" Text='<%# Bind("Age") %>'> </itemtemplate> <edititemtemplate> <asp:TextBox ID="Txtage" runat="server" Text='<%#Bind("Age") %>'> </edititemtemplate> <footertemplate> <asp:TextBox ID="Txtage" runat="server"> </footertemplate> <asp:TemplateField HeaderText="SALARY"> <itemtemplate> <asp:Label ID="Lblslry" runat="server" Text='<%# Bind("Salary") %>'> </itemtemplate> <edititemtemplate> <asp:TextBox ID="Txtslry" runat="server" Text='<%#Bind("Salary") %>'> </edititemtemplate> <footertemplate> <asp:TextBox ID="Txtslry" runat="server"> </footertemplate> <asp:TemplateField HeaderText="CITY"> <itemtemplate> <asp:Label ID="Lblcity" runat="server" Text='<%# Bind("City") %>'> </itemtemplate> <edititemtemplate> <asp:TextBox ID="Txtcity" runat="server" Text='<%#Bind("City") %>'> </edititemtemplate> <footertemplate> <asp:TextBox ID="Txtcity" runat="server"> </footertemplate> <asp:TemplateField HeaderText="ADDRESS"> <itemtemplate> <asp:Label ID="Lbladd" runat="server" Text='<%# Bind("Address") %>'> </itemtemplate> <edititemtemplate> <asp:TextBox ID="Txtadd" runat="server" Text='<%#Bind("Address") %>'> </edititemtemplate> <footertemplate> <asp:TextBox ID="Txtadd" runat="server"> </footertemplate> <asp:TemplateField HeaderText=" OPERATION"> <itemtemplate> <asp:LinkButton ID="BtnEdit" CssClass="fancybox" runat="server" CommandName="Edit" Text="Edit" /> <asp:LinkButton ID="BtnDelete" runat="server" CommandName="Delete" Text="Delete" /> </itemtemplate> <edititemtemplate> <asp:LinkButton ID="BthUpdate" runat="server" CommandName="Update" Text="Update" /> <asp:LinkButton ID="BtnCancel" runat="server" CommandName="Cancel" Text="Cancel" /> </edititemtemplate> </columns> <%--<columns> <asp:TemplateField HeaderText=> <asp:BoundField HeaderText="Emp Name" DataField="Emp_name" ItemStyle-HorizontalAlign="Center" /> <asp:BoundField HeaderText="Age" DataField="Age" ItemStyle-HorizontalAlign="Center" /> <asp:BoundField HeaderText="Salary" DataField="Salary" ItemStyle-HorizontalAlign="Center" /> <asp:BoundField HeaderText="City" DataField="City" ItemStyle-HorizontalAlign="Center" /> <asp:BoundField HeaderText="Address" DataField="Address" ItemStyle-HorizontalAlign="Center" /> </columns> --%> <editrowstyle backcolor="#999999" /> <footerstyle backcolor="#ffffff" font-bold="True" forecolor="White" /> <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" /> <pagerstyle backcolor="#284775" forecolor="White" horizontalalign="Center" /> <rowstyle cssclass="rowHover" backcolor="#F7F6F3" forecolor="#333333"></rowstyle> <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" /> <sortedascendingcellstyle backcolor="#E9E7E2" /> <sortedascendingheaderstyle backcolor="#506C8C" /> <sorteddescendingcellstyle backcolor="#FFFDF8" /> <sorteddescendingheaderstyle backcolor="#6F8DAE" /> <emptydatarowstyle width="550px" forecolor="Red" font-bold="true"> HorizontalAlign = "Center"/> </emptydatarowstyle></fieldset> Hello World! <div> <a href="CS.aspx" class="fancybox"> ADD NEW RECORD</a> <a href="Default4.aspx" class="fancybox">new</a> <a href="pictures.aspx"></a> </div> <div> <a class="fancybox" href="<%#Eval("Emp_id")%>"></a> <a class="fancybox" href="<%#Eval("Emp_name")%>"></a> <a class="fancybox" href="<%#Eval("Age")%>"></a> <a class="fancybox" href="<%#Eval("Salary")%>"></a> <a class="fancybox" href="<%#Eval("City")%>"></a> <a class="fancybox" href="<%#Eval("Address")%>"></a> </div> </form> </body> </html></div>
这篇关于如何使用带有gridview控件的fancybox的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
