http://aspsnippets.com/Articles/jQuery-Accordion-example-in-ASPNet-using-C-and-VBNet.aspx

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();
}
}

从数据库中,绑定JQuery Accordion控件---Repeater control的更多相关文章

  1. Winform开发中如何将数据库字段绑定到ComboBox控件

    最近开始自己动手写一个财务分析软件,由于自己也是刚学.Net不久,所以自己写的的时候遇到了很多问题,希望通过博客把一些印象深刻的问题记录下来. Winform开发中如何将数据库字段绑定到ComboBo ...

  2. 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.5.Accordion控件

    accordion是另一个UI控件,能允许你将一组content加入相互分隔的.能够被浏览者的交互打开或关闭的panels中.因此,它大多数的content在初始化的时候是隐藏的,很像tabs控件.每 ...

  3. 封装:WPF中可以绑定的BindPassWord控件

    原文:封装:WPF中可以绑定的BindPassWord控件 一.目的:本身自带的PassWord不支持绑定 二.Xaml部分 <UserControl x:Class="HeBianG ...

  4. jQuery树形控件zTree使用小结

    作者:Fonour 字体:[增加 减小] 类型:转载 时间:2016-08-02我要评论 这篇文章主要为大家详细介绍了jQuery树形控件zTree使用方法,zTree树插件的基本使用方法,感兴趣的小 ...

  5. jquery 分页控件2

    jquery 分页控件(二) 上一章主要是关于分页控件的原理,代码也没有重构.在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释.为了测试这个插件是能用的 ...

  6. WPF 将数据源绑定到TreeView控件出现界面卡死的情况

    首先来谈一下实现将自定义的类TreeMode绑定到TreeView控件上的一个基本的思路,由于每一个节点都要包含很多自定义的一些属性信息,因此我们需要将该类TreeMode进行封装,TreeView的 ...

  7. Atitit  项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx

    Atitit  项目界面h5化静态html化计划---vue.js 把ajax获取到的数据 绑定到表格控件 v2 r33.docx 1. 场景:应用在项目列表查询场景下1 1.1. 预计初步掌握vue ...

  8. Jquery树形控件 $.fn.zTree.init

    https://www.cnblogs.com/jin-/p/4646202.html asp.net 树形控件 $.fn.zTree.init 在网页中通过jquery脚本来构筑树形控件将是一个不错 ...

  9. winform快速开发平台 -> 快速绑定ComboBox数据控件

    通常我们在处理编辑窗体时.往往会遇到数据绑定.例如combobox控件绑定数据字典可能是我们经常用到的.然而在我的winform快速开发平台中我是如何处理这个频繁的操作呢? 首先,我们要绑定combo ...

随机推荐

  1. ##DAY2 UILabel、UITextField、UIButton、UIImageView、UISlider

    ##DAY2 UILabel.UITextField.UIButton.UIImageView.UISlider #pragma mark ———————UILabel——————————— UILa ...

  2. 在单链表和双链表中删除倒数第K个节点

    [说明]: 本文是左程云老师所著的<程序员面试代码指南>第二章中“在单链表和双链表中删除倒数第K个节点”这一题目的C++复现. 本文只包含问题描述.C++代码的实现以及简单的思路,不包含解 ...

  3. Problem G: Keywords Search

    Problem G: Keywords SearchTime Limit: 1 Sec Memory Limit: 128 MBSubmit: 10 Solved: 6[Submit][Status] ...

  4. BZOJ 2064: 分裂( 状压dp )

    n1+n2次一定可以满足..然后假如之前土地集合S1的子集subs1和之后土地集合S2的子集subs2相等的话...那么就少了2个+操作...所以最后答案就是n1+n2-少掉的最多操作数, 由状压dp ...

  5. lambda, reduce, map求阶乘之和

    学完这几个优雅的内建函数,就可以做一些有趣的小练习来激发兴趣了.而python最大的好处便是简洁,看下边要求 用1行代码求 1! + 2! + 3! + ... + 10! 求阶乘 reduce函数用 ...

  6. delphi 文件夹权限设置(执行一个小脚本的笨办法)

    如题,研究了一天,也没再网上找到比较好的方式,自己做了一个.方法如下: 1.创建一个 cmd 命令文件.2.调用该命令. 代码如下:   S:='echo y|cacls h: /t /c /g ev ...

  7. 一个int 数组,里面数据无任何限制,要求求出所有这样的数a[i],其左边的数都小于等于它,右边的数都大于等于它。能否只用一个额外数组和少量其它空间实现。

    一个int数组, 比如 array[],里面数据无任何限制,要求求出 所有这样的数array[i],其左边的数都小于等于它,右边的数都大于等于它.能否只用一个额外数组和少量其它空间实现. 分析:这题很 ...

  8. Google Play和基于Feature的过滤

    田海立@CSDN 翻译自Google Play and Feature-Based Filtering GooglePlay会过滤出那些对用户可见的应用程序,因此用户只能看到和下载那些与他们的设备兼容 ...

  9. [cocos2dx笔记011]使用Cocostudio UI编辑器

    本文地址:http://www.cppblog.com/zdhsoft/archive/2014/07/19/207715.html 笔记汇总:http://www.cppblog.com/zdhso ...

  10. 【JAVA】使用Eclipse依赖生成jar包时,避免最外层同时生成资源文件的配置。

    使用Eclipse依赖生成jar包时,如果做配置,生成的jar包文件会全部生成在外面,这并不是我们需要的,下面我们一起来修改下配置,使生成的jar包符合我们的需求吧. 1.如果不做任何配置生成的jar ...