[转载]对Jquery+JSON+WebService的一点认识

mikel阅读(1279)

[转载]对Jquery+JSON+WebService的一点认识 – tyb1222 – 博客园.

JQuery作为一款优秀的JS框架,简单易用的特性就不必说了。在实际的开发过程中,使用JQ的AJAX函数调用WebService

的接口实现AJAX的功能也成了一种比较普遍的技术手段了。WebService接口的实现,通常都是由OOP语言实现的。所以

在WebService的接口函数中,难免可能会遇到除了简单数据类型的复杂数据类型。复杂的数据的数据类型机有可能是

WebService接口中的参数,也有可能是WebService的返回值。本文所叙述的要点为:

1、对于WebService接口复杂类型的参数,JQ调用的时候传入的JSON数据应该如何表示。?

2、JQ对WebService调用获取JSON数据类型。

3、JQ调用的时对Webservice返回的复杂数据类型有什么样要求。?

环境:JQ版本:1.4.2、VS2008 SP1。

测试一:对于WebService简单参数类型:

01 WebService接口函数代码如下:
02
03 [WebMethod(Description = "测试方法")]
04 public string ProcessPersonalInfo(Person person)
05 {
06 return person.Name + person.Tel;
07 }
08 JQ调用代码如下:
09
10 $.ajax({
11
12 type: "POST",
13
14 url: "WebService1.asmx/GetString",
15
16 dataType: "json",
17
18 contentType: "application/json; charset=utf-8",
19
20 data: "{'name':'zhangsan'}",
21
22 success: function(json) { alert(json.d) },
23
24 error: function(error) {
25
26 alert("调用出错" + error.responseText);
27
28 }
29 });

提示:在$.ajax函数中,data必须要以字符串的形式表示JSON,而不能直接用JSON数据传进去。可能有些朋友对JSON对象和JSON对象的字符串

不大好区分,其实,字符串类似C#里用“”引起来的东西,而JSON对象是直接写在{}中的。简单的测试方法是直接通过alert函数弹出,如果显示[object:object]

则为JSON对象,否则就是一个字符串。

结果如下图:

测试二:对于WebService复杂参数类型:

01 WebService接口函数代码如下:
02
03 [WebMethod(Description = "测试方法")]
04 public string ProcessPersonalInfo(Person person)
05 {
06 return person.Name + person.Tel;
07 }
08
09 Person实体:
10
11 public class Person
12 {
13 public string Name { get; set; }
14
15 public int Age { get; set; }
16
17 public string Address { get; set; }
18
19 public string Tel { get; set; }
20
21 }
22
23 JQ调用代码如下:
24
25 $.ajax({
26
27 type: "POST",
28
29 url: "WebService1.asmx/ProcessPersonalInfo",
30
31 dataType: "json",
32
33 contentType: "application/json; charset=utf-8",
34
35 data: "{'person':{'Name':'zhangsan','Age':28,'Address':'beijing',Tel:'01082658866'}}"
36
37 success: function(json) { alert(json.d) },
38
39 error: function(error) {
40
41 alert("调用出错" + error.responseText);
42 }
43 });

结果如下图:

调用过程与简单参数类型类似,就是通过在JS中用一个表示Person的person对象的字符串,发往客户端后,WebService会自动将person对象的字符串

转换为Person实体对象。

测试三:对于WebService复杂返回类型

01 WebService接口函数代码如下:
02
03 [WebMethod(Description = "测试方法")]
04 public List<Person> GetPersonalList()
05 {
06 List<Person> persons = new List<Person>
07 {
08 new Person {Address = "beijing", Age = 25, Name = "zhangshan", Tel = "01082678866"}
09 };
10 return persons;
11 }<br> JQ调用代码如下:
12
13 $.ajax({
14
15 type: "POST",
16
17 url: "WebService1.asmx/GetPersonalList",
18
19 dataType: "json",
20
21 contentType: "application/json; charset=utf-8",
22
23 success: function(json) { $(json.d).each(function() { alert(this.Name + "-" + this.Age + "-" + this.Address + "-" + this.Tel) }) },
24
25 error: function(error) {
26
27 alert("调用出错" + error.responseText);
28
29 }
30
31 });

如下图:

也就是说对于复杂返回类型,处理方式也是简单类型基本上是一样的。

曾听到有一种观念认为,Jq调用时WebSevice,用JSON作为数据交互格式时,返回数据类型一定是可序列化的。真的是这样吗。?

.Net的基本数据类型确实是可序列化的,这一点没有疑问。那么List<T>数据类型是否可以序列化呢。?看看List<T>的元数据(Metadata)信息

就知道了。。

[DebuggerTypeProxy(typeof (Mscorlib_CollectionDebugView<T>))]

[DebuggerDisplay(“Count = {Count}”)]

[Serializable]

public class List<T> : IList<T>, ICollection<T>, IEnumerable<T>, IList, ICollection, IEnumerable

{

/**/

}

如果上面的说法成立,在这种情况下,调用成功也无可厚非。但是问题真是这样吗。?下面继续测试一下:

测试四:对于WebService复杂返回类型

01 [WebMethod(Description = "测试方法")]
02 public Person GetPerson()
03 {
04 Person person = new Person {<br>                               Address = "beijing", Age = 27, <br>                               Name = "zhangshan", Tel = "01082678866" <br>                              };
05 return person;
06 }
07
08 JQ调用代码如下:
09
10 $.ajax({
11
12 type: "POST",
13
14 url: "WebService1.asmx/GetPerson",
15
16 dataType: "json",
17
18 contentType: "application/json; charset=utf-8",
19
20 //data: "{'person':{'Name':'zhangsan','Age':28,'Address':'beijing',Tel:'01082658866'}}",
21
22 success: function(json) { $(json.d).each(function() { alert(this.Name + "-" + this.Age + "-" + this.Address + "-" + this.Tel) }) },
23
24 error: function(error) {
25
26 alert("调用出错" + error.responseText);
27
28 }
29
30 });

如下图:

但是测试四中,GetPerson()方法返回Person数据类型。再看看Person实体的定义,根本就没有标记问可序列化。

由结果可知:JQ调用WebService,并不一定需要返回复杂类型的数据必须是可序列化的。

下面做一个有趣的测试。大家都知道WebService的返回类型不能为Hashtable类型。因为它实现了因为它实现 IDictionary接口。

测试五:对于WebService复杂返回类型

01 [WebMethod(Description = "测试方法")]
02 public Hashtable GetPersonalHashtable()
03 {
04 Hashtable hashtable = new Hashtable();
05
06 Person person = new Person { Address = "beijing", Age = 25, Name = "zhangshan", Tel = "01082678866" };
07
08 hashtable.Add(1, person);
09
10 return hashtable;
11 }
12
13 JQ调用代码如下:
14
15 $.ajax({
16
17 type: "POST",
18
19 url: "WebService1.asmx/GetPersonalHashtable",
20
21 dataType: "json",
22
23 contentType: "application/json; charset=utf-8",
24
25 data: data,
26
27 success: function(json) { $(json.d).each(function() { alert(this["one"].Name) }) },
28
29 error: function(error) {
30
31 alert("调用出错" + error.responseText);
32
33 }
34
35 });

这样,Jq居然能调用成功。这点是有点让人意想不到的。

总结:

1、Jq与WebService之间以JSON作为数据交换形式的时候,contentType: “application/json; charset=utf-8″是必须指定的。

要不然WebService不知道以何种数据作为转换。

2、Jq调用WebService返回复杂数据类型并不一定需要类型为可序列化。

3、WebService返回的JSON数据通过”.d”获取如上面测试中的alert(json.d)

[转载]使用ASP.NET MVC3+EF+Jquery制作文字直播系统(一)

mikel阅读(1008)

[转载]使用ASP.NET MVC3+EF+Jquery制作文字直播系统(一) – 田念明 – 博客园.

在人民网:http://news.people.com.cn/GB/124421/index.html ,新华网:http://www.xinhuanet.com/xhzb/index.htm网站都有文字直播。昨天刚刚完成了学校六十校庆上用的文字直播系统,当然不是使用MVC做的。今天我再使用ASP.NET MVC3+EF+JQuery完善一下这个系统,也作为Entity Framework 4 in Action读书笔记系列前期的一个例子吧。

创建解决方案和项目

1.  首先,新建一个空的解决方案

解决方案的名称为:LiveText,如下图:

QQ截图20111013115139

2.  创建完解决方案,还需要创建三个项目,具体如下面的表格:

项目名称 Visual Studio项目模板 用途
LiveText.Domain C#类库 保存域的实体和逻辑
LiveText.WebUI ASP.NET MVC 3 Web Application 存储控制器和视图
LiveText.UnitTests Test Project 单元测试

3.  添加引用

我们的项目中使用到了Ninject,Moq工具类库,首先需要添加对它们的引用,简便的方法是使用VS的Package Manager Console(View ➤ Other Windows ➤Package Manager Console),输入下面的命令:

Install-Package Ninject -Project LiveText.WebUI

Install-Package Ninject -Project LiveText.UnitTests

Install-Package Moq -Project LiveText.UnitTests

具体如下图:

QQ截图20111013120246

具体项目之间的依赖关系如下表:

项目名称 工具依赖 项目依赖
LiveText.Domain 没有 没有
LiveText.WebUI Ninject LiveText.Domain
LiveText.UnitTests Ninject,Moq LiveText.Domain,LiveText.WebUI

4.  设置依赖注入容器

项目中,我们使用Ninject创建控制器和处理依赖注入(DI)。在LiveText.WebUI项目中新建一个Infrastructure的文件夹,在该文件夹中新建一个NinjectControllerFactory类,代码如下:

public class NinjectControllerFactory : DefaultControllerFactory
{
    private IKernel ninjectKernel;
    public NinjectControllerFactory()
    {
        ninjectKernel = new StandardKernel();
        AddBindings();
    }
    protected override IController GetControllerInstance(RequestContext requestContext,
    Type controllerType)
    {
        return controllerType == null
        ? null
        : (IController)ninjectKernel.Get(controllerType);
    }
    private void AddBindings()
    {
    }
}

然后修改Global.asax如下

protected void Application_Start()
{
    AreaRegistration.RegisterAllAreas();

    RegisterGlobalFilters(GlobalFilters.Filters);
    RegisterRoutes(RouteTable.Routes);

    //修改的这个地方
    ControllerBuilder.Current.SetControllerFactory(new NinjectControllerFactory());
}

效果如下图:

QQ截图20111013120349

至此,项目的基本框架就做完了,下面设计数据库。

设计数据库

这里使用EF Code-First。

1.  编写实体类

人民网的文字直播系统分为“国新办发布会直播”、“国台办发布会直播”等类别,每个类别下面又有很多直播的内容。文字直播系统大体需要这几个实体类:

Category       ——      类别类                          Title      ——      标题类

Text      ——      文字类                          User      ——      用户类

在LiveText.Domain项目中新建一个文件夹Entities,在该文件夹中新建上面四个类:

QQ截图20111013150243

public class Category
{
    /// <summary>
    /// 类别编号
    /// </summary>
    public int CategoryID { get; set; }
    /// <summary>
    /// 类别名称
    /// </summary>
    public string Name { get; set; }

    /// <summary>
    /// 标题集合
    /// </summary>
    public ICollection<Title> Titles { get; set; }
}
public class Title
{
    /// <summary>
    /// 标题编号
    /// </summary>
    public int TitleID { get; set; }
    /// <summary>
    /// 标题名称
    /// </summary>
    public string Name { get; set; }

    /// <summary>
    /// 所属类别
    /// </summary>
    public Category Category { get; set; }
    /// <summary>
    /// 文字集合
    /// </summary>
    public ICollection<Text> Texts { get; set; }
}
public class Text
{
    /// <summary>
    /// 文字编号
    /// </summary>
    public int TextID { get; set; }
    /// <summary>
    /// 发言人
    /// </summary>
    public string Prolocutor { get; set; }
    /// <summary>
    /// 发言内容
    /// </summary>
    public string ProContent { get; set; }
    /// <summary>
    /// 日期
    /// </summary>
    public DateTime ProDate { get; set; }

    /// <summary>
    /// 所属标题
    /// </summary>
    public Title Title { get; set; }
}
public class User
{
    /// <summary>
    /// 用户编号
    /// </summary>
    public int UserID { get; set; }
    /// <summary>
    /// 用户名
    /// </summary>
    public string UserName { get; set; }
    /// <summary>
    /// 用户密码
    /// </summary>
    public string Password { get; set; }
}

2.  添加EFCodeFirst

在Package Manager Console中输入命令:

Install-Package EFCodeFirst -Project LiveText.Domain

QQ截图20111013152422

3.  创建上下文类

在LiveText.Domain项目中,新建名为Concrete的文件夹,在该文件夹中新建一个LiveTextDbContext的类,它继承自System.Data.Entity.DbContext,具体代码如下:

public class LiveTextDbContext : DbContext
{
    public DbSet<Category> Categories { get; set; }
    public DbSet<Title> Titles { get; set; }
    public DbSet<Text> Texts { get; set; }
    public DbSet<User> Users { get; set; }
}

4.  修改Web.config

打开LiveText.WebUI项目的Web.config,添加一个数据库连接字符串,name的值要和上下文类的名称一样。

  <connectionStrings>
    <add name="LiveTextDbContext" 
         connectionString="Data Source=.;Initial Catalog=LiveText;Integrated Security=True;Pooling=False" 
         providerName="System.Data.SqlClient"/>
  </connectionStrings>

新建一个HomeController,添加如下代码:

public class HomeController : Controller
{
    LiveTextDbContext context = new LiveTextDbContext();

    //
    // GET: /Home/

    public ActionResult Index()
    {
        var categories = context.Categories;
        return View(categories);
    }

}

给Index添加一个View,如下图:

QQ截图20111013161349

现在就可以运行了,运行结果如下:

QQ截图20111013161922

再看看数据库里,EF已经为我们自动生成了数据库,数据库的结构如下图:

QQ截图20111013162156

至此,我们数据库的设计就完成了。

源代码下载地址:http://files.cnblogs.com/nianming/LiveText201110131625.rar

[转载]如何在ASP.NET MVC中使用图表控件

mikel阅读(1182)

[转载]如何在ASP.NET MVC中使用图表控件 – caling – 博客园.

图表ASP.NET MVC的实现,是很容易的 。微软发布了一个强大的ASP.NET 的图表控制,支持丰富的图表选项设置-包括列,点,泡沫,饼图,圆环图,金字塔,漏斗,盒形图,面积,范围,AJAX的互动,以及更多 。 Microsoft图表控件示例项目包括ASP.NET页的图表样本超过200个 。在这篇文章中,我将展示如何在ASP.NET MVC中使用图表控 件。

我的示例项目是在ASP.NET MVC 2中 。
我 这里介绍一个非常简单的项目,显示了一个类的结果比较。两个字段 – ID(这是唯一的一个学生)和GPA(平均成绩) – 代表一个特定的学生的结果。 各种图表结果显示,学生的结果进行比较。我希望把重点放在如何轻松地显示相同的数据不同的结果。在这个项目中,您可以添加,编辑和删除学生的成绩,并动态 显示的变化。

要运行该项目,必须安装以下微软NET Framework 3.5的Microsoft图表控件组件。

代码开始,你将需要引用的System.Web.UI.DataVisualization程序集 。

一旦你这样做,这是相当多的简单图表添加到视图页面。

<img src=”/Chart/CreateChart?chartType=<%=System.Web.UI.DataVisualization.Charting.SeriesChartType.Column%>” alt=”” />

代码直接贴上

首先定义一个controller,提供以下方法实现

#region Chart Component

public FileResult CreateChart(SeriesChartType chartType)
{
IList peoples = _resultService.GetResults();
Chart chart = new Chart();
chart.Width = 700;
chart.Height = 300;
chart.BackColor = Color.FromArgb(211, 223, 240);
chart.BorderlineDashStyle = ChartDashStyle.Solid;
chart.BackSecondaryColor = Color.White;
chart.BackGradientStyle = GradientStyle.TopBottom;
chart.BorderlineWidth = 1;
chart.Palette = ChartColorPalette.BrightPastel;
chart.BorderlineColor = Color.FromArgb(26, 59, 105);
chart.RenderType = RenderType.BinaryStreaming;
chart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;
chart.AntiAliasing = AntiAliasingStyles.All;
chart.TextAntiAliasingQuality = TextAntiAliasingQuality.Normal;
chart.Titles.Add(CreateTitle());
chart.Legends.Add(CreateLegend());
chart.Series.Add(CreateSeries(peoples,chartType));
chart.ChartAreas.Add(CreateChartArea());

MemoryStream ms = new MemoryStream();
chart.SaveImage(ms);
return File(ms.GetBuffer(), @"image/png");
}

[NonAction]
public Title CreateTitle()
{
Title title = new Title();
title.Text = "Result Chart";
title.ShadowColor = Color.FromArgb(32, 0, 0, 0);
title.Font = new Font("Trebuchet MS", 14F, FontStyle.Bold);
title.ShadowOffset = 3;
title.ForeColor = Color.FromArgb(26, 59, 105);

return title;
}

[NonAction]
public Legend CreateLegend()
{
Legend legend = new Legend();
legend.Name = "Result Chart";
legend.Docking = Docking.Bottom;
legend.Alignment = StringAlignment.Center;
legend.BackColor = Color.Transparent;
legend.Font = new Font(new FontFamily("Trebuchet MS"), 9);
legend.LegendStyle = LegendStyle.Row;

return legend;
}

[NonAction]
public Series CreateSeries(IList results, SeriesChartType chartType)
{
Series seriesDetail = new Series();
seriesDetail.Name = "Result Chart";
seriesDetail.IsValueShownAsLabel = false;
seriesDetail.Color = Color.FromArgb(198, 99, 99);
seriesDetail.ChartType = chartType;
seriesDetail.BorderWidth = 2;
seriesDetail["DrawingStyle"] = "Cylinder";
seriesDetail["PieDrawingStyle"] = "SoftEdge";
DataPoint point;

foreach (ResultModel result in results)
{
point = new DataPoint();
point.AxisLabel =result.ID;
point.YValues = new double[] {double.Parse(result.GPA) };
seriesDetail.Points.Add(point);
}
seriesDetail.ChartArea = "Result Chart";

return seriesDetail;
}

[NonAction]
public ChartArea CreateChartArea()
{
ChartArea chartArea = new ChartArea();
chartArea.Name = "Result Chart";
chartArea.BackColor = Color.Transparent;
chartArea.AxisX.IsLabelAutoFit = false;
chartArea.AxisY.IsLabelAutoFit = false;
chartArea.AxisX.LabelStyle.Font = new Font("Verdana,Arial,Helvetica,sans-serif", 8F, FontStyle.Regular);
chartArea.AxisY.LabelStyle.Font = new Font("Verdana,Arial,Helvetica,sans-serif", 8F, FontStyle.Regular);
chartArea.AxisY.LineColor = Color.FromArgb(64, 64, 64, 64);
chartArea.AxisX.LineColor = Color.FromArgb(64, 64, 64, 64);
chartArea.AxisY.MajorGrid.LineColor = Color.FromArgb(64, 64, 64, 64);
chartArea.AxisX.MajorGrid.LineColor = Color.FromArgb(64, 64, 64, 64);
chartArea.AxisX.Interval = 1;

return chartArea;
}

#endregion

图表类的各种属性,可以控制宽度,高度,边框颜色,背景颜色,皮肤,调色板,等。最终形成图片格式展现在页面。

这里介绍的项目是ASP.NET MVC的图表控件的一个小demo示例,最终展示如下:

结果,chart.png

[转载]常用图表控件总汇

mikel阅读(1558)

[转载]常用图表控件总汇 – Eric_ – 博客园.

数据可视化,图形化显示是当前工业领域、商业领域、金融领域等不可或缺的元素,通常采用图表进行数据可视化展示,直观地显示数据、对比数据、分析数据,很多项目开发中都会需求到图表控件,这里简单介绍下各个开发平台下的常用图表控件。

Flash类的图表:

该类图表主要使用Flash Player作为载体,使用XML作为数据输入,优点是可以跨平台、跨浏览器,支持多种开发语言,快速上手且使用简单,支持多种类型的图表、仪表和地图,具备交互功能且可连接多种数据库

1. AnyChart图表控件

AnyChart控件是一款当前流行的数据可视化解决方案,使客户可以创建交互地、生动的图表和仪表、地图。该控件提供极好的视觉外观和配色方案能 够使客户根据不同的需求设计图表,AnyChart是一款跨浏览器的工具,可以被用于Web、Desktop和Mobile应用程序,AnyChart可 运行于当前PC和Mac上所有主流的浏览器,如:Chrome, Safari, Firefox, Internet Explorer和Opera,并且可用于所有移动平台(Android (2.2+) 和 iOS (iPhone, iPad, iPod Touch). )上的主流浏览器,全面支持HTML5和SVG

具体介绍和在线事例请查看>>

2. FusionCharts图表控件

FusionCharts帮助开发人员创建动态的和交互式的图表应用程序,可用于PCs, Macs, iPads, iPhones和其他主流的移动驱动,控件使用Flash和JavaScript(HTML5)来创建图表,使用XML或者JSON作为数据输入,支持 ASP, ASP.NET, PHP, JSP, ColdFusion, Ruby on Rails等脚本语言和多种数据库,支持多种图表类型、仪表和地图。

具体介绍和在线事例请查看>>>>

.NET类图表

该 类图表主要是针对.NET平台设计,并不需要Flash Player等作为载体,可直接在WebForm和WinForm窗体上显示,控件提供了直连数据源接口,不需使用XML作为数据输入,可直接绑定各种数 据源到控件,同样支持多种图表、仪表类型,具备各种交互功能,实时数据显示

1. TeeChart for .NET

TeeChart for .NET是Steema软件公司的一款老牌图表控件,历经15年,已经被全球多个领域广泛使用,支持WPF, Silverlight,ASP.NET, Winform, SQL Reporting Services, Compact Framework 和Windows Phone 7等多种平台。提供了多种流行的2D和3D图表类型和仪表以及地图,内置多种金融和统计函数,完全的中文图表设计器,是当前.NET开发人员创建图表应用 程序的首选。

具体介绍和在线事例请查看>>>>

2.  Visifire

Visifire是 一款强大的数据可视化图表控件,提供多种功能的图表和仪表,图表和仪表实时显示和更新,滚动和放大缩小,可以用于Silverlight和WPF平台下, 支持 .Net 3.5 SP1以及4.0,全面兼容Windows Phone7,利用该控件开发人员可以在几分钟内就设计出强大的图表应用程序

3. ComponentArt Gauges for Silverlight and WPF

该控件是一款功能强大的交互性的仪表控件,包含了多种数字仪表控件,容易地进行KPI绑定,自定义指针,比列以及刻度,灵活的布局和动画显示,包含 了圆型仪表、线性仪表、数字仪表、圆柱图、BulletGraphs、半饼图、温度计、组合仪表等,全面支持Visual Studio 2010设计时设计和Silverlight 4以及WPF4

该控件具体介绍和试用版下载请查看>>

4. Chart FX

Chart FX是一款.NET平台下功能强大的图表控件,完全整合于Visual Studio 2005、2008、2010,可同时用于WinForm和WebForm平台,控件提供了超过20多种的图表类型,多种交互功能和数据分析功能,强大的 图表设计器和最终用户自定义功能,该控件被全球多家500强企业所使用,受到业界一致好评。

该控件具体介绍和试用版下载请查看>>

Activex和COM类型:该类图表控件主要是运用于VC++和VB等开发平台

1. TeeChart Pro ActiveX

该 控件也是Steema公司下的一款老牌的图表控件,可完全满足你的商业,科学,工程学及金融图表需求。它提供了多种2D及3D图表类型,33种数据及统计 学函数供您选择,图表同时提供无限数量的坐标轴和17个常用图表工具控件。控件提供的图表编辑器可以帮助开发人员快速地创建图表,图表提供的数据接口可以 直接绑定多种数据源。

该控件具体介绍和试用版下载请查看>>

2. ProEssentials

ProEssentials 图表控件可以为您的程序添加金融、科学、工程、商业图表,提供了多种2维和三维图表类型,可用于WinForm和WebForm,提供了大量接口,同时支 持多种开发平台:Visual Studio. NET, VB6, VC6, ASP, Delphi等

该控件具体介绍和试用版下载请查看>>

VCL和CLX类型的图表:该类图表主要是用于Delphi和C++ Builder 平台的

1. TeeChart Pro VCL/CLX

TeeChart Pro VCL/CLX 是一款功能强大的图表制作控件,提供了上百种2D和3D图表类型,43种数学的、统计的、金融的函数,以及不限数量的坐标轴和22种调色板控件。并且还提供完整的源代码和丰富的帮助文档以及大量的事例

该控件具体介绍和试用版下载请查看>>

JAVA类的图表控件:该类图表主要用于JAVA平台下

1. Chart FX 7 for Java Server

Chart FX 7 for Java Server是一款基于Java 1.5+构建的图表控件,支持多种图表类型,该控件使用框架独立的、基于AJAX的运行时UI,可对图表图像进行多种交互功能操作,当数据改变时自动更新 图表而不需要整个页面刷新,支持JSF技术。控件提供的图表设计器可快速设计图表,增强最终用户界面,使最终用户利用控件提供的菜单、工具条对图表进行操 作以及打印等。


该控件具体介绍和试用版下载请查看>>

2. Chart FX 7 for Java Desktop

Chart FX 7 for Java Desktop是 一款适用于Swing应用程序的图表控件,完全整合于NetBeans 和所有Eclipse-Based IDEs,可直接拖拉控件到开发环境里进行设计时配置,同样最终用户也可以根据控件运行时提供的菜单和工具条进行很多图表的自定义操作。控件提供了超过 20+的图表类型,可通过API直接绑定图表到多种数据集

[转载]Jquery 中的CheckBox RadioButton DropDownList的取值赋值

mikel阅读(1110)

[转载]Jquery 中的CheckBox RadioButton DropDownList的取值赋值 – 朱梅梅 – 博客园.

随着JQuery的作用越来越大,使用的朋友也越来越多。在Web中,由于CheckBox Radiobutton DropDownList等控件使用的频率比较高,就关系到这些控件在JQuery中的操作问题。由于JQuery的版本更新很快,代码的写法也改变了许多,以下jQuery代码适query1.4版本以上。

Radio

1.获取选中值,三种方法都可以:

$(‘input:radio:checked’).val()

$(“input[type=’radio’]:checked”).val();

$(“input[name=’rd’]:checked”).val();

2.设置第一个Radio为选中值:

$(‘input:radio:first’).attr(‘checked’, ‘checked’);

或者

$(‘input:radio:first’).attr(‘checked’, ‘true’);

注: attr(“checked”,’checked’)= attr(“checked”, ‘true’)= attr(“checked”, true)

3.设置最后一个Radio为选中值:

$(‘input:radio:last’).attr(‘checked’, ‘checked’);

或者

$(‘input:radio:last’).attr(‘checked’, ‘true’);

4.根据索引值设置任意一个radio为选中值:

$(‘input:radio’).eq(索引值).attr(‘checked’, ‘true’);索引值=0,1,2….

或者

$(‘input:radio’).slice(1,2).attr(‘checked’, ‘true’);

5.根据Value值设置Radio为选中值

$(“input:radio[value=’rd2′]”).attr(‘checked’,’true’);

或者

$(“input[value=’rd2′]”).attr(‘checked’,’true’);

6.删除Value值为rd2Radio

$(“input:radio[value=’rd2′]”).remove();

7.删除第几个Radio

$(“input:radio”).eq(索引值).remove();索引值=0,1,2….

如删除第3Radio:$(“input:radio”).eq(2).remove();

8.遍历Radio

$(‘input:radio’).each(function(index,domEle){

//写入代码

});

DropDownList

1. 获取选中项:

获取选中项的Value值:

$(‘select#sel option:selected’).val();

或者

$(‘select#sel’).find(‘option:selected’).val();

获取选中项的Text值:

$(‘select#seloption:selected’).text();

或者

$(‘select#sel’).find(‘option:selected’).text();

2. 获取当前选中项的索引值:

$(‘select#sel’).get(0).selectedIndex;

3. 获取当前option的最大索引值:

$(‘select#sel option:last’).attr(“index”)

4. 获取DropdownList的长度:

$(‘select#sel’)[0].options.length;

或者

$(‘select#sel’).get(0).options.length;

5. 设置第一个option为选中值:

$(‘select#sel option:first’).attr(‘selected’,’true’)

或者

$(‘select#sel’)[0].selectedIndex = 0;

6. 设置最后一个option为选中值:

$(‘select#sel option:last).attr(‘selected’,’true’)

7. 根据索引值设置任意一个option为选中值:

$(‘select#sel’)[0].selectedIndex =索引值;索引值=0,1,2….

8. 设置Value=4 option为选中值:

$(‘select#sel’).attr(‘value’,’4′);

或者

$(“select#sel option[value=’4′]”).attr(‘selected’, ‘true’);

9. 删除Value=3option

$(“select#sel option[value=’3′]”).remove();

10.删除第几个option

$(” select#sel option “).eq(索引值).remove();索引值=0,1,2….

如删除第3Radio:

$(” select#sel option “).eq(2).remove();

11.删除第一个option

$(” select#sel option “).eq(0).remove();

或者

$(“select#sel option:first”).remove();

12. 删除最后一个option

$(“select#sel option:last”).remove();

13. 删除dropdownlist:

$(“select#sel”).remove();

14.select后面添加一个option:

$(“select#sel”).append(“<option value=’6′>f</option>”);

15. select前面添加一个option:

$(“select#sel”).prepend(“<option value=’0′>0</option>”);

16. 遍历option:

$(‘ select#sel option ‘).each(function (index, domEle) {

//写入代码
});

CheckBox

1. 获取单个checkbox选中项(三种写法)

$(“input:checkbox:checked”).val()

或者

$(“input:[type=’checkbox’]:checked”).val();

或者

$(“input:[name=’ck’]:checked”).val();

2. 获取多个checkbox选中项:

$(‘input:checkbox’).each(function() {

if ($(this).attr(‘checked’) ==true) {

alert($(this).val());

}

});

3. 设置第一个checkbox 为选中值:

$(‘input:checkbox:first’).attr(“checked”,’checked’);

或者

$(‘input:checkbox’).eq(0).attr(“checked”,’true’);

4. 设置最后一个checkbox为选中值:

$(‘input:radio:last’).attr(‘checked’, ‘checked’);

或者

$(‘input:radio:last’).attr(‘checked’, ‘true’);

5. 根据索引值设置任意一个checkbox为选中值:

$(‘input:checkbox).eq(索引值).attr(‘checked’, ‘true’);索引值=0,1,2….

或者

$(‘input:radio’).slice(1,2).attr(‘checked’, ‘true’);

6. 选中多个checkbox

同时选中第1个和第2个的checkbox

$(‘input:radio’).slice(0,2).attr(‘checked’,’true’);

7. 根据Value值设置checkbox为选中值:

$(“input:checkbox[value=’1′]”).attr(‘checked’,’true’);

8. 删除Value=1checkbox:

$(“input:checkbox[value=’1′]”).remove();

9. 删除第几个checkbox:

$(“input:checkbox”).eq(索引值).remove();索引值=0,1,2….

如删除第3checkbox:

$(“input:checkbox”).eq(2).remove();

10.遍历checkbox:

$(‘input:checkbox’).each(function (index, domEle) {

//写入代码
});

11.全部选中

$(‘input:checkbox’).each(function() {

$(this).attr(‘checked’, true);

});

12.全部取消选择:

$(‘input:checkbox’).each(function () {

$(this).attr(‘checked’,false);

});

[转载]Jquery 插件:一个小巧的jquery 三级联动多选插件

mikel阅读(1139)

[转载]【Jquery 插件】一个小巧的jquery 三级联动多选插件 – 学-无-止-境 – 博客园.

今天做了一个小巧的JQuery 三级联动多选插件,时间仓促,没有做太多的优化和更多的通用性设计。

希望以此来接受园子里朋友的指正,完善这个插件。

先上图:

91家装 电子书点搜

用法:

1.在页面添加元素:

<ul id=”selected”></ul>
<div id=”selecter”></div>

当然也可以自定义

2.引用脚本库和css

<link href=”JQuery.selecter.css” type=”text/css” rel=”Stylesheet” />
<script type=”text/JavaScript” src=”jQuery-1.6.2.min.js”></script>
<script type=”text/JavaScript” src=”jQuery.selecter.js”></script>

3.使用jquery.selecter的默认方法:

$(‘#selecter’).selecter();

4.高级用法:

$(‘#selecter’).selecter({ handler: “/handler/handler.ashx”, data: “action=getSiteCategory&id=”,parentId:”0″ });

下载地址:

/Files/andylaufzf/jquery.selecter.rar

[转载]利用Linq写简洁代码

mikel阅读(1068)

[转载]利用Linq写简洁代码 – 老衲爱封装 – 博客园.

1.xml读写

d盘下有Demo.xml,内容如下

<?xml version="1.0" encoding="utf-8" ?>
<Earthworm>
  <Demo>
    <Aspect name="">
      <Advice type="before" assembly="" className="">
        <MethodName>asd</MethodName>
        <MethodName>kll</MethodName>
      </Advice>
      <Advice type="stop" assembly="" className="">
        <MethodName></MethodName>
        <MethodName></MethodName>
      </Advice>
      <Advice type="after" assembly="" className="">
        <MethodName></MethodName>
        <MethodName></MethodName>
      </Advice>
    </Aspect>
  </Demo>
</Earthworm>

现在想获取type为before的所有MethodName的节点值

普通读取方法

XmlDocument xmldoc = new XmlDocument();
 xmldoc.Load(@"d:\demo.xml");
 XmlNodeList nodelist = xmldoc.SelectNodes("Earthworm/Demo/Aspect/Advice[@type='before']/MethodName");
 foreach (XmlNode node in nodelist)
 {
 Console.WriteLine(node.InnerText); 
}

Linq To Xml 读取方法

var dname = from k in  (from m in XDocument.Load("d:\\zhongming.xml").Descendants("Advice") 
             where m.Attribute("type").Value == "before"  select m).Descendants("MethodName") select k.Value;//一句话搞定,很给力
            foreach (var a in dname)
            {
                Console.WriteLine(a);
            }

2.查找普通对象

有如下数组:

int[] data = new int[] {12,23,445,666,777,90,33,2,0,-89 };

想查找大于50的对象

普通方法

var findObjects = new List<int>();
            foreach (int i in data)
            {
                if (i > 50)
                {
                    findObjects.Add(i);
                }
            }

Linq方法

 var findObjects=from d in data where d>50 select d;//同样是一句话


3.查找动态对象

     class People
        {
            /// <summary>
            /// 姓名
            /// </summary>
            public string Name{get;set;}
            /// <summary>
            /// 年龄
            /// </summary>
            public int Age{get;set;}
            /// <summary>
            /// 性别
            /// </summary>
            public bool Gender { get; set; }
        }

有如下数据

People[] data = new People[] { new People{Name="西门吹雪",Gender=true,Age=1200},
                                                               new People{Name="令狐冲",Gender=true,Age=999},
                                                               new People{Name="任盈盈",Gender=false,Age=456},
                                                               new People{Name="欧阳锋",Gender=true,Age=9999},
                                                               new People{Name="黄药师",Gender=true,Age=670},
                                                               new People{Name="吴世龙",Gender=true,Age=25}};

想查找所有的People的姓名和年龄

普通方法

必须建造一个结构体或类,用来存储姓名和年龄,结构体如下

struct DynamicObject
        {
            public string Name;
            public int   Age;
        }

然后查找

List<DynamicObject> objs = new List<DynamicObject>();
            foreach (People p in data)
            {
                objs.Add(new DynamicObject { Name = p.Name, Age = p.Age });
            }

linq方法

var objects = from d in data select new { d.Name, d.Age };

还有更牛的是优化过程

比如那个读xml的你是这样写的

var doc = XDocument.Load(@"d:\demo.xml");
            var list=from m in doc.Descendants("Advice") where m.Attribute("type").Value == "before"  select m;
            var datas=from k in  list.Descendants("MethodName") select k.Value;
            foreach (var a in datas)
            {
                Console.WriteLine(a);
            }

编译完成之后,拿一Reflector看,是这个样子的

  IEnumerable<string> datas = from k in (from m in XDocument.Load(@"d:\demo.xml").Descendants("Advice")
            where m.Attribute("type").Value == "before"
            select m).Descendants<XElement>("MethodName") select k.Value;//变成一句了哦
        foreach (string a in datas)
        {
            Console.WriteLine(a);
        }

就讲这么多,其他的一起探索吧