从数据库中,绑定JQuery Accordion控件---Repeater control
2014-10-17 15:02
429 查看
http://aspsnippets.com/Articles/jQuery-Accordion-example-in-ASPNet-using-C-and-VBNet.aspx
1. 添加JQuery 引用
2.在<head></head>标签里面 写JQuery代码---dvAccordian是div层的id
3.在body标签里面,添加Repeater控件,并绑定数据库字段
4.在后台添加以下的命名空间
5.构造绑定Repeater控件的方法
6.在页面加载的时候,绑定控件
1. 添加JQuery 引用
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script> <link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css" rel="stylesheet" type="text/css" />
2.在<head></head>标签里面 写JQuery代码---dvAccordian是div层的id
<script type="text/javascript"> $(function () { $("#dvAccordian").accordion(); }) </script>
3.在body标签里面,添加Repeater控件,并绑定数据库字段
<div id="dvAccordian" style="width:500px"> <asp:Repeater ID="Repeater1" runat="server"> <ItemTemplate> <h3><%# Eval("Title") %></h3> <div> <p><%# Eval("Content") %></p> </div> </ItemTemplate> </asp:Repeater> </div>
4.在后台添加以下的命名空间
using System.Data; using System.Configuration; using System.Data.SqlClient;
5.构造绑定Repeater控件的方法
private void BindRepeater() { string constr = ConfigurationManager.ConnectionStrings["DemosDatabaseConnectionString"].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand()) { cmd.CommandText = "select Title,Content from AccordionContent"; cmd.Connection = con; con.Open(); Repeater1.DataSource = cmd.ExecuteReader(); Repeater1.DataBind(); con.Close(); } } }
6.在页面加载的时候,绑定控件
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { BindRepeater(); } }
![](http://images.cnitblog.com/blog/666207/201410/171536265133959.png)
相关文章推荐
- jQuery+ajax从数据库取值和和绑定前台html控件上,然后再通过ajax把值传到后台,让后台写入到数据库
- 将数据库的值绑定到Repeater控件里面
- repeater里用户控件绑定数据库的值(记住区分Page_Init和Page_Load)
- ASP.Net中通过Jquery前端对Repeater控件绑定的数据进行操作
- jquery 实现分页绑定复选框选中状态(Repeater控件)
- 关于AjaxControlToolkit的Accordion控件在vs2008下报错的问题及解决办法
- repeater控件自定义数据源代码绑定实例
- TreeView控件绑定多个数据库表
- 关于DataGrid Web Control 动态绑定2--子控件的获取
- vb中通过picture和adodc控件给access写入图片,把绑定的图片框中的图像自动存入数据库
- ASP.NET:数据库绑定控件DataBind方法
- 我在Repeater控件中有CheckBox控件,我怎么能选中CheckBox控件后,Repeater控件重新绑定一下?
- 发布一个OutlookBar控件,支持数据库绑定(完全开源)
- 第十二篇: Ajax Control Toolkit 控件包--1. Accordion (多层折叠效果)
- 第十二篇: Ajax Control Toolkit 控件包--1. Accordion (多层折叠效果)
- ASP.NET 2.0 的数据绑定控件概述与区别(GridView、DetailsView、FormView 、Repeater、DataList)
- 数据绑定(Databind)与 repeater 控件的使用。
- ASP.NET2.0中CheckBoxList控件与数据库绑定(学习)
- CListCtrl(List Control)绑定ODBC数据库的方法。(附加:CRecordset::Open()与CRecordset::OpenEx()区别之真实体验~)
- ASP.NET 2.0 的数据绑定控件概述与区别(GridView、DetailsView、FormView 、Repeater、DataList)