初识Telerik for AJAX

由于项目需要，本人又刚入门.net开发，项目经理介绍了一个.net流行的开发框架telerik。于是我开始慢慢学习了，发现这个控件还是不错的，学习到的内容和初学者一起探讨一下。

1：第一步

什么是telerik

telerik 是r.a.d.controls 套装是一款最具革命性和广泛性的开发工具集，它主要针对专业级的ASP.NET 开发，适用于AJAX, Atlas 、Visual Studio .NET 2005 、Visual Studio 2008 及ASP.NET 3.5。通过该产品的强大功能，开发者可以开发出功能丰富、适应标准广泛，与交互浏览器兼容的网络应用程序。

2：第二步

去官网下载它的应用程序包：（点击try now）http://demos.telerik.com/aspnet-ajax/grid/examples/overview/defaultcs.aspx

安装完成以后你的Visual studio任务栏会多出来一个任务,如下图所示：

3：第三步

在asp.net项目中的应用：

<telerik:RadWindowManager runat="server" ID="RadWindowManager">
    </telerik:RadWindowManager>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel" runat="server">
    </telerik:RadAjaxLoadingPanel>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="DataGrid">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="DataGrid" LoadingPanelID="RadAjaxLoadingPanel"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="SubmitBtn">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="DataGrid" LoadingPanelID="RadAjaxLoadingPanel"></telerik:AjaxUpdatedControl>
                    <telerik:AjaxUpdatedControl ControlID="formPane"></telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>

</AjaxSettings>
    </telerik:RadAjaxManager>

RadWindowManager：用的比较多的就是后台的弹出框，EM:    RadWindowManager.RadAlert("操作成功", 300, 200, "操作结果", null);

RadAjaxLoadingPanel:配合AjaxSettings一起出现，比如你想点击确定按钮，实现grid的无刷新更新数据，直接如上述代码（SubmitBtn）设置就可以了。

4：第四步

一个完整的例子

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <div class="demo-containers">
        <div class="demo-container wrapper">
            <telerik:RadLabel runat="server" ID="RadLabel1" AssociatedControlID="RadTextBox1" Text="Name"></telerik:RadLabel>

            <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox1"></telerik:RadTextBox>

            <telerik:RadLabel runat="server" ID="RadLabel2" AssociatedControlID="RadTextBox2" Text="Email " RequiredMark="*" MarkDisplayMode="Required"></telerik:RadLabel>

            <telerik:RadTextBox RenderMode="Lightweight" runat="server" ID="RadTextBox2"></telerik:RadTextBox>

            <telerik:RadLabel runat="server" Text="Date of birth" Width="100px" ID="RadLabel4" AssociatedControlID="RadDatePicker1"></telerik:RadLabel>

            <telerik:RadDatePicker runat="server" ID="RadDatePicker1"></telerik:RadDatePicker>

            <telerik:RadCheckBox runat="server" ID="RadCheckBox1" AutoPostBack="false">

            </telerik:RadCheckBox>

            <telerik:RadLabel runat="server" ID="RadLabel5" AssociatedControlID="RadCheckBox1" Text="I agree to the Terms & Conditions.">
            </telerik:RadLabel>

            <div class="button-wrapper">
                <telerik:RadButton ID="RadButton1" runat="server" Primary="true" Text="Update Your Profile"></telerik:RadButton>
            </div>
        </div>
    </div>
    </form>
</body>

效果：

初步学习，有错误的地方还请大家指出(∩_∩)

时间： 2024-10-20 16:41:50

初识Telerik for AJAX的相关文章

初识jQuery的ajax

前面有一篇博文,写的是ajax请求时,返回json字符串和json数组的场景,今天,将原始的ajax修改为jQuery版的ajax. jQuery对ajax做了很多的封装,使得ajax使用起来非常的方便,省去了很多代码. 闲话少说,直接看代码吧. 代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!

Telerik for AJAX RadGrid控件

作为一名.net小白,今天分享一下telerik知识的学习.熟悉ASP.NET Web Form的都知道Grid View或者是List View等表格控件,所以今天和大家分享一下telerik RadGrid的简单应用. 和一般表格控件一样,RadGrid有Datasource和一些点击事件,一些属性(例如分页,编辑,删除) <telerik:RadGrid ID="RadGrid" runat="server" AllowPaging="true

初识ASP.NET AJAX

ASP.NET AJAX技术是一种实现异步网络应用的技术,它被整合在ASP.NET2.0中,是ASP.NET的一种扩展技术.通过ASP.NET AJAX技术开发人员可以将Web服务器控件和客户端脚本结合起来,并在此基础上实现了Web页面的局部更新功能.因此,当浏览器与服务器交互时,ASP.NET AJAX技术可以将浏览器中的一部分内容呈现出来,从而避免了将浏览器整个内容提交到服务器. AJAX是asynchronous javascript and XML(异步javascript和XML)的缩

初识JSONP--解决ajax跨域问题

 先说说JSONP是怎么产生的: 其实网上关于JSONP的讲解有很多,但却千篇一律,而且云里雾里,对于很多刚接触的人来讲理解起来有些困难,小可不才,试着用自己的方式来阐释一下这个问题,看看是否有帮助. 1.一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面.动态网页.web服务.WCF,只要是跨域请求,一律不准: 2.不过我们又发现,Web页面上调用js文件时则不受是否跨域的影响(不仅如此,我们还发现凡是拥有"src"这个属性的标签都拥有跨域的能

Ajax—初识

看DRP的过程,重新学习了一遍Ajax,更深刻的体会到了Ajax所具有的魅力.Ajax是一种技术或者方法,更是一 种艺术.它让我们的程序以一种更完美的姿态呈现在用户面前.下面就让我们一起走进Ajax的世界. 简介 全名: AsynchronousJavaScript and XML. 工作原理: Ajax的工作原理相当于在用户和服务器之间加了-个中间层(AJAX引擎),使用户操作与服务器响应异步化.并不 是所有的用户请求都提交给服务器,像-些数据验证和数据处理等都交给Ajax引擎自己来做,只有确

Django补充及初识Ajax

Django创建一对多表结构 首先现在models.py中写如下代码: from django.db import models # Create your models here. class Business(models.Model): caption = models.CharField(max_length=32) class Host(models.Model): nid = models.AutoField(primary_key=True) hostname = models.C

初识JQuery AJAX

初识JQuery AJAX APP开发群:347072638(HTML5,APP) 1.先看一个JQuery AJAX Demo HTML端: <!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.

ajax技术初识与应用

一.ajax技术初识 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术.Ajax不是一种新的编程语言,而是使用现有标准的新方法.AJAX可以在不重新加载整个页面的情况下,与服务器交换数据.这种异步交互的方式,使用户单击后,不必刷新页面也能获取新数据.使用Ajax,用户可以创建接近本地桌面应用的直接.高可用.更丰富.更动态的Web用户界面. Ajax技术包括: XHTML和CSS 使用文档对象

初识Ajax技术

Ajax:(Asynchronous JavaScript And Xml)是一种整合了JavaScript.XML.CSS等现有技术 Ajax工作流程: 纯javaScript的Ajax请求 XMLHttpRequest XMLHttpRequest对象可以提供在不刷新当前页面的情况下向服务器发送异步请求,并接收服务器端的返回结果.         1.创建XMLHttpRequest对象语法 老版本IE(IE5和IE6) XMLHttpRequest=new ActiveXObject("M