2008年11月22日
RadControls集成jquery,随便几行代码吊死你!不信来看!

RadControls Q3 2008开始集成了jquery,加上jquery视觉效果是帅多了..

 

代码非常简单,

首先导入jquery的js

        <telerik:RadScriptManager runat="server" ID="RadScriptManager1">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            </Scripts>
        </telerik:RadScriptManager>

这个只有Q3版本的才支持哦

然后

 

        <telerik:RadComboBox runat="server" ID="RadComboBox1" Width="300px" Skin="Telerik">
            <Items>
                <telerik:RadComboBoxItem Text="ASP.NET AJAX UI Controls" />
                <telerik:RadComboBoxItem Text="WinForms UI Controls" />
                <telerik:RadComboBoxItem Text="WPF UI Controls" />
                <telerik:RadComboBoxItem Text="Silverlight UI Controls" />
                <telerik:RadComboBoxItem Text="Telerik Reporting" />
                <telerik:RadComboBoxItem Text="Telerik OpenAccess ORM" />
                <telerik:RadComboBoxItem Text="Telerik Sitefinity CMS" />
            </Items>
        </telerik:RadComboBox>

        <script type="text/javascript">
            (function($) {
                $(document).ready(function() {
                    $('.rcbItem')
                    .mouseover(function() {
                        $(this).stop().animate({ paddingLeft: "30px" }, { duration: 300 });
                    })
                    .mouseout(function() {
                        $(this).stop().animate({ paddingLeft: "4px" }, { duration: 300 });
                    });
                });
            })($telerik.$);
        </script>

 

然后在body onload的时候添加2个动画函数!

 

posted @ 2008-11-22 21:18 索马 阅读(1463) 评论(14) 编辑
RadGrid客户端绑定,分页,过滤,效率真不错

效果图

我们看下分页传输了一些什么数据

post的数据就只有一点参数.

返回的数据就是json数据

不会有大家都讨厌的viewstate

rad的grid还是不错的.功能相当强大!

大家看看代码

 

绑定linq

<script runat="server">
    [System.Web.Services.WebMethod]
    public static GridBindingData GetCustomers(int startRowIndex, int maximumRows, string sortExpression, string filterExpression)
    {
        return RadGrid.GetBindingData("NorthwindDataContext", "Customers", startRowIndex, maximumRows, sortExpression, filterExpression);
    }
</script>

 

客户端js绑定

 

 

Code

 

 

aspx 页面代码

 

 

Code
posted @ 2008-11-22 20:36 索马 阅读(1391) 评论(4) 编辑
RadInputManager验证效果,很酷哦

 

<body style="background-color: #DFF3FF;">
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <div>
        <telerik:RadInputManager EnableEmbeddedSkins="false" ID="RadInputManager1" runat="server">
            <telerik:RegExpTextBoxSetting  EmptyMessage="E-mail addres"  EmptyMessageCssClass="radEmptyMessageCss_Default"
             FocusedCssClass="radFocusedCss_Default" HoveredCssClass="radHoverCss_Default" InvalidCssClass="radInvalidCss_Default"
                ErrorMessage="Invalid e-mail" 
                ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
                <TargetControls>
                    <telerik:TargetInput ControlID="Panel1" />
                </TargetControls>
            </telerik:RegExpTextBoxSetting>
        </telerik:RadInputManager>
        <asp:Panel ID="Panel1" runat="server">
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <br />
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <br />
            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>            
        </asp:Panel>
    </div>
    </form>
</body>
posted @ 2008-11-22 00:13 索马 阅读(543) 评论(5) 编辑