Telerik Forums
UI for ASP.NET AJAX Forum
6 answers
101 views
Hello 
i have the following problem: i would like to build an accordion in a RadTabStrip/RadPageView control
Here you can find the sample page (DON'T PUSH THE SUBMIT BUTTON IN THE FINAL STEP TAB)
The web mthod correctly returns the data, but when i try to depict in the latest tab, using the jquery accordion function, an error occurs: 
Uncaught TypeError: Object [object Object] has no method 'accordion'

Following, the page code:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="richieste.aspx.cs" Inherits="SitefinityWebApp.richieste" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Charting" Assembly="Telerik.Web.UI" %>
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="ScriptManager1">
        <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" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" EnableAJAX="true" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadGrid2">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid2" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <script type="text/javascript">
        function onTabSelected(sender, args) {
            var tab = args.get_tab().get_text();
            var nSites = $find("<%= RadGrid1.MasterTableView.ClientID %>").get_selectedItems().length;
            var nVars = $find("<%= RadGrid2.MasterTableView.ClientID %>").get_selectedItems().length;
            var from = $get("<%= dateFrom.ClientID %>").value;
            var to = $get("<%= dateTo.ClientID %>").value;
            if (tab == "Check your selection") {
                $get("<%= TextBox2.ClientID %>").value = "gotcha";
                if (nSites == 0) {
                    alert("Please select site(s)");
                    $find("<%= RadTabStrip1.ClientID %>").findTabByText("Select sites").set_selected(true);
                    return false;
                }
                if (nVars == 0) {
                    if ($get("<%= chAnc.ClientID %>").checked == false) {
                        alert("Please select variable(s)");
                        $find("<%= RadTabStrip1.ClientID %>").findTabByText("Select variables").set_selected(true);
                        return false;
                    }
                }
                if (from == "" && to == "") {
                    alert("Please select date range");
                    $find("<%= RadTabStrip1.ClientID %>").findTabByText("Final Step").set_selected(true);
                    return false;
                }
 
                //alert($get("<%= dateFrom.ClientID %>").value + " " + $get("<%= dateTo.ClientID %>").value);
                var radgrid = $find('<%= RadGrid1.ClientID %>');
                var idSiteList = new Array();
                for (i = 0; i < radgrid.get_masterTableView().get_selectedItems().length; i++) {
                    idSiteList.push(radgrid.get_masterTableView().get_selectedItems()[i].getDataKeyValue("siteID"));
                }
                radgrid = $find('<%= RadGrid2.ClientID %>');
                var varList = new Array();
                for (i = 0; i < radgrid.get_masterTableView().get_selectedItems().length; i++) {
                    varList.push(radgrid.get_masterTableView().get_selectedItems()[i].getDataKeyValue("ID"));
                }
                var parsList = new Array();
                if ($get("<%= chLev3.ClientID %>").checked) {
                    parsList.push(8);
                }
                if ($get("<%= chLev4.ClientID %>").checked) {
                    parsList.push(9);
                }
                if ($get("<%= chAnc.ClientID %>").checked) {
                    parsList.push(13);
                }
                var open = $get("<%= CheckBoxopen.ClientID %>").checked;
                var _public = $get("<%= CheckBoxpub.ClientID %>").checked;
                jsonData = '{ "Sites":"' + idSiteList.toString() + '", "Vars": "' + varList.toString() + '", "DataType":"' + parsList.toString() + '","Open":"'+open+'","Public":"'+_public+'" }';
                $('#myDiv').html("Processing...");
                //alert(obj);
                $.ajax({
                    type: "POST",
                    url: "GService.asmx/ServerSideMethod",
                    data: "{'jreq':" + jsonData + "}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (msg) {
                        $('#myDiv').html(msg.d);
                        $('#myDiv').accordion();
                    },
                    error: function (xhr, ajaxOptions, thrownError) { alert(thrownError); }
                });
                
            }
             
        }
    </script>
    <div style="width:990px; margin:auto;">
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Width="990px"
            Skin="Office2010Silver" MultiPageID="RadMultiPag1" SelectedIndex="3" OnClientTabSelected="onTabSelected">
            <Tabs>
                <telerik:RadTab Text="Select sites" Selected="True"></telerik:RadTab>
                <telerik:RadTab Text="Select variables"></telerik:RadTab>
                <telerik:RadTab Text="Additional parameters"></telerik:RadTab>
                <telerik:RadTab Text="Final Step"></telerik:RadTab>
                <telerik:RadTab Text="Check your selection"></telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
        <telerik:RadMultiPage ID="RadMultiPag1" runat="server" SelectedIndex="0"
            Width="990px">
        <telerik:RadPageView ID="RadPageView1" runat="server"  Style="overflow: hidden">
            <telerik:RadGrid id="RadGrid1" DataSourceID="SqlDataSource1" ShowStatusBar="true" runat="server" AllowPaging="false" AllowSorting="True"
                AllowMultiRowSelection="True" AutoGenerateColumns="false" Width="100%" Height="400px" EnableViewState="true">
                <ClientSettings EnableRowHoverStyle="true">
                    <Selecting AllowRowSelect="true" />
                </ClientSettings>
                <MasterTableView ClientDataKeyNames="siteID">
                    <Columns>
                        <telerik:GridClientSelectColumn>
                        </telerik:GridClientSelectColumn>
                        <telerik:GridBoundColumn UniqueName="site"  DataField="site" HeaderText="Site"
                    SortExpression="site" />
                <telerik:GridBoundColumn UniqueName="NAME" DataField="NAME" HeaderText="Site Name"
                    SortExpression="NAME" />
                <telerik:GridBoundColumn UniqueName="resp" DataField="resp" HeaderText="Site Responsible"
                    SortExpression="resp" />
                <telerik:GridBoundColumn UniqueName="Ecosystem" DataField="Ecosystem"
                    HeaderText="Ecosystem" SortExpression="Ecosystem"  />
                <telerik:GridBoundColumn UniqueName="Nlat" DataField="Nlat" HeaderText="Latitude"
                    DataType="System.Double" ReadOnly="True" SortExpression="Nlat" />
                <telerik:GridBoundColumn UniqueName="Nlon" DataField="Nlon" HeaderText="Longitude"
                    DataType="System.Double" ReadOnly="True" SortExpression="Nlon" />
                <telerik:GridBoundColumn DataField="siteID" DataType="System.Int32"
                    FilterControlAltText="Filter siteID column" HeaderText="siteID" ReadOnly="True"
                    SortExpression="siteID" UniqueName="siteID" Visible="false">
                </telerik:GridBoundColumn>
                    </Columns>
                </MasterTableView>
                <ClientSettings EnableRowHoverStyle="true">
                    <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="True" />
                </ClientSettings>
                <PagerStyle Mode="NumericPages"></PagerStyle>
            </telerik:RadGrid>
        </telerik:RadPageView>
        <telerik:RadPageView ID="RadPageView2" runat="server" Style="overflow: hidden">
            <telerik:RadGrid id="RadGrid2" DataSourceID="SqlDataSource2"
             ShowStatusBar="true" runat="server" AllowPaging="false" AllowSorting="True"
                AllowMultiRowSelection="True" AutoGenerateColumns="false" Width="100%" Height="400px">
                <ClientSettings EnableRowHoverStyle="true">
                    <Selecting AllowRowSelect="true" />
                </ClientSettings>
                <MasterTableView ClientDataKeyNames="ID">
                    <Columns>
                  <telerik:GridClientSelectColumn>
                  </telerik:GridClientSelectColumn>      
                <telerik:GridBoundColumn UniqueName="Name" DataField="Name" HeaderText="Variable Name"  />
                <telerik:GridBoundColumn UniqueName="Description" DataField="Description" HeaderText="Description" SortExpression="Description" />
                <telerik:GridBoundColumn UniqueName="Measurement_Unit" DataField="Measurement_Unit" HeaderText="Measurement Unit" SortExpression="Measurement_Unit" />
                <telerik:GridBoundColumn UniqueName="mind" DataField="mind" HeaderText="Min. Date" SortExpression="mind" DataFormatString="{0:dd/MM/yyyy}" />
                <telerik:GridBoundColumn UniqueName="maxd" DataField="maxd" HeaderText="Max. Date" SortExpression="maxd" DataFormatString="{0:dd/MM/yyyy}"/>
                <telerik:GridBoundColumn DataField="ID" DataType="System.Int32"
                    FilterControlAltText="Filter ID column" HeaderText="ID" ReadOnly="True"
                    SortExpression="ID" UniqueName="ID" Visible="false">
                </telerik:GridBoundColumn>
                    </Columns>
                </MasterTableView>
                <ClientSettings EnableRowHoverStyle="true">
                    <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="True" />
                </ClientSettings>
                <PagerStyle Mode="NumericPages"></PagerStyle>
            </telerik:RadGrid>
        </telerik:RadPageView>
        <telerik:RadPageView ID="RadPageView3" runat="server" Style="overflow: hidden">
           <table>
            <tr>
                <td>
                    <asp:CheckBox ID="chLev3" runat="server" Text="Level 3 data files" /></td>
            </tr>
            <tr>
                <td><asp:CheckBox ID="chLev4" runat="server" Text="Level 4 data files" /></td>
            </tr>
            <tr>
                <td><asp:CheckBox ID="chAnc" runat="server" Text="Ancillary data files" /></td>
            </tr>
            <tr>
                <td>
                    <asp:CheckBox ID="CheckBoxopen" runat="server" AutoPostBack="False" OnCheckedChanged="CheckBoxopen_CheckedChanged"
                        Text="Only Open Data" ViewStateMode="Enabled" />
                </td>
                </tr>
                 <tr>
                <td>
                    <asp:CheckBox ID="CheckBoxpub" runat="server" AutoPostBack="false" OnCheckedChanged="CheckBoxpub_CheckedChanged"
                        Text="Only Public Data" />
                </td>
            </tr>
        </table>
        </telerik:RadPageView>
        <telerik:RadPageView ID="RadPageView4" runat="server" Style="overflow: hidden">
            <telerik:RadDatePicker ID="dateFrom" runat="server" ShowPopupOnFocus="true">
                <Calendar ID="Calendar1" UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" runat="server"></Calendar>
                <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton>
                <DateInput ID="DateInput1" DisplayDateFormat="dd/MM/yyyy" DateFormat="dd/MM/yyyy" runat="server"></DateInput>
            </telerik:RadDatePicker>
            To
            <telerik:RadDatePicker ID="dateTo" runat="server" ShowPopupOnFocus="true">
                <Calendar ID="Calendar2" UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x" runat="server"></Calendar>
                <DatePopupButton ImageUrl="" HoverImageUrl=""></DatePopupButton>
                <DateInput ID="DateInput2" DisplayDateFormat="dd/MM/yyyy" DateFormat="dd/MM/yyyy" runat="server"></DateInput>
            </telerik:RadDatePicker><br />
            Description<br /><asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Rows="3"></asp:TextBox><br />
            <asp:Button ID="Button1" runat="server" Text="Submit" onclick="Button1_Click"  />  <br /><br /><asp:TextBox ID="Textmail" runat="server" Width="250px"></asp:TextBox>   
        </telerik:RadPageView>
        <telerik:RadPageView ID="RadPageView5" runat="server" Style="overflow: hidden">
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox><br /><div id="myDiv"></div>
        </telerik:RadPageView>
    </telerik:RadMultiPage>
    </div>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:tcdcConnectionString %>" SelectCommand="SELECT distinct site,NAME,[site responsible] as resp, Ecosystem, Nlat, Nlon, ID as siteID FROM [projsites] where idp>0 order by site"></asp:SqlDataSource>
    <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:tcdcConnectionString %>" SelectCommand="SELECT ID, Name,Description,Measurement_Unit, (select min(date) from tcdc.dbo.stats st where st.varid=vc.ID and st.value!=0) as mind,(select max(date) from tcdc.dbo.stats st where st.varid=vc.ID and st.value!=0) as maxd FROM tcdc.dbo.[varscomplete] vc where xque=1 order by name"></asp:SqlDataSource>
    </form>
</body>
</html>
 
The we method result:
[WebMethod]
        public string ServerSideMethod(JRequest jreq)
        {
            //return jreq.Sites.ToString();   
            return jreq.HtmlContent;
        }
 
And, finally, the JRequest class I used to manage the ajax request:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
 
namespace SitefinityWebApp
{
     
    public class JRequest
    {
        private string sites = "";
        private string vars = "";
        private string dataType = "";
        private string initDate;
        private string endDate;
        private DateTime initDateTime;
        private DateTime endDateTime;
        private bool open = false;
        private bool _public = false;
        private char[] splits = { ','};
        public JRequest()
        {
        }
 
        public string Sites
        {
            set { sites = value; }
            get { return sites; }
        }
 
        public string Vars
        {
            set { vars = value; }
            get { return vars; }
        }
 
        public string DataType
        {
            set { dataType = value; }
            get { return dataType; }
        }
 
        public bool Open
        {
            set { open = value; }
            get { return open; }
        }
 
        public bool Public
        {
            set { _public = value; }
            get { return _public; }
        }
 
        public List<int> SitesList
        {
            get
            {
                string[] sString = vars.Split(splits);
                List<int> sList = new List<int>();
                for (int i = 0; i < sString.Length; i++)
                {
                    sList.Add(int.Parse(sString[i]));
                }
                return sList;
            }
        }
 
        public List<int> VarsList
        {
            get
            {
                string[] vString = vars.Split(splits);
                List<int> vList = new List<int>();
                for (int i = 0; i < vString.Length; i++)
                {
                    vList.Add(int.Parse(vString[i]));
                }
                return vList;
            }
        }
 
        public string HtmlContent
        {
            get
            {
                string html = "";
                html += "<h3>SELECTED SITES</h3>";
                html += "<div>"+this.Sites+"</div>";
                html += "<h3>SELECTED VARS</h3>";
                html += "<div>" + this.Vars + "</div>";
                html += "<h3>PARAMETERS</h3>";
                html += "<div>" + this.DataType + "</div>";
                html += "<h3>OPEN / PUBLIC</h3>";
                html += "<div>" + this.Open + " / " + this.Public + "</div>";
                return html;
            }
        }
 
    }
}

Thanks in advance for your help
Regards
Diego
Nencho
Telerik team
 answered on 28 Mar 2013
1 answer
86 views
How do we apply more than two colors for Point chart background?
We saw only two colors can be applied using MainColor and SecondColor in the Chart  Appearence Section .
Our Requirement is to apply four diffrent  colors with gradiant background.
Please let us know any work around it.
Yavor
Telerik team
 answered on 28 Mar 2013
1 answer
66 views
Hi,

I am binding the values and generating the chart dynamically. But the values are not aligned properly.

Please help me.
Missing User
 answered on 28 Mar 2013
3 answers
88 views
Hi,

I am using a rad grid in a web form. My requirement is show customize text in columns. 

suppose this is the real value binds to grid
"Aua7o0qnW-8n1nrHtR_1I0wg4kHD59"

I  want to show only first 10 characters and 3 dots
"Aua7o0qnW-..."

I have tried with dataFormatString. But couldn't get result that I wanted.

Thanks
Kostadin
Telerik team
 answered on 28 Mar 2013
1 answer
143 views
Hi Friends,

I am having some trouble in radeditor addExternalHandler for safari browser. It seems that the following attached code works fine in IE, but it fails to do so in safari. Help would be much appreciated. Thanks.
<script type="text/javascript">
    function CharactersLimit(editor) {          
 
        var element = document.all ? editor.get_document().body : editor.get_document();
        $telerik.addExternalHandler(element, "blur", function (e) {
            alert('blur');
        });
 
    }
</script>
 
 
    <telerik:RadScriptManager runat="server">
    </telerik:RadScriptManager>
    <telerik:RadEditor ID="Editor1" runat="server" OnClientLoad="CharactersLimit">
    </telerik:RadEditor>


Rumen
Telerik team
 answered on 28 Mar 2013
1 answer
54 views
I am displaying a table in radgrid.The table has 10 columns.when i insert data into table i gave only 5 values.Other values is performing aithmetic opertions.I want to display edit page(.aspx) when i double click the row in radgrid.where should i write the code to perform aithmetic operations.
Shinu
Top achievements
Rank 2
 answered on 28 Mar 2013
8 answers
1.5K+ views
I'm trying to capture the ItemDataBound event to conditionally alter the contents of a GridTemplateColumn. The problem is the code example I found assumes you are altering a standard GridBoundColumn. I actually have two databound fields in my GridTemplateColumn and I don't see a way to update their values. 

Here is my code:
        protected void RadGridSummary_ItemDataBound(object sender, GridItemEventArgs e)
        {
            if (e.Item.ItemType == GridItemType.AlternatingItem | e.Item.ItemType == GridItemType.Item)
            {
               
                GridDataItem gridItem = (GridDataItem)e.Item;
                if (String.IsNullOrEmpty(gridItem["ReferrerName"].Text) == true)           
                {
                    gridItem["ReferrerName"].Text = "(None)";
                
            }
        }

I can only reference the name of the GridTemplateField "Referrer" and I don't know how to access the 2 data bound columns using the object model. Here is my ASPX code:

<telerik:GridTemplateColumn UniqueName="Referrer"                     SortExpression="ReferrerName" HeaderText="Referrer / Keyword">
                    <HeaderStyle Width="150px"></HeaderStyle>
                    <ItemStyle Height="35px"></ItemStyle>
                    <ItemTemplate>
                        <span class="gridItemText">
                            <%# DataBinder.Eval(Container.DataItem, "ReferrerName") %>
                        </span>
                        <br />
                        <span class="gridItemTextAlt">
                            <%# DataBinder.Eval(Container.DataItem, "Keyword") %>
                        </span>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>

I want be able to capture the event of the ReffererName field being handled so I can alter its value. I saw another example that showed updating a checkbox in another field by using it's control collection, but I did not see how this could be applied to the GridTemplateColumn. Here is the original article I found which shows how to update a regular field:
http://www.telerik.com/help/aspnet/grid/radgrid-telerik.webcontrols.radgrid-itemdatabound_ev.html


Any help would be greatly appreciated!

Thanks,
Levi
Mahdy
Top achievements
Rank 1
 answered on 28 Mar 2013
1 answer
45 views

Dear sir ,
Radlist view edit template example on Telerik database on customerphotos table shows the following fields

Name:
Title:
City:
Country:
Phone:


my question is how do I add the address field( in design time) to be shown and edited ,updated or even inserted in the Radlistview templates

note that I show and update the photo too

============================
what i did is reconfiguring the sqldatasource and added the field address from customerphotos
then i added in design time in edititemtemplate a binded textbox to that field but when i press update after writing in the address field and selecting an image ,I got the following error

Parameter '@Photo' exceeds the size limit for the sql_variant datatype.

Andrey
Telerik team
 answered on 28 Mar 2013
0 answers
131 views
Hi all

There are tow questions regards this requirement:

1- I am trying to open a user control in edit form mod , in user controls i have used footable  (reference Link themergency.com/footable/) with asp gridview. footable functionality not working with in user control, if I simply open  that control at another page other than in line edit form user control in radgrid footable workng correctly , is there any conflict between telerik and other jquery plugins ...?

2 - I want to make Telerik radgrid as behave as footable  (refrence Link http://themergency.com/footable-demo/demo.htm) please help if possible


Thanks
Saquib
Top achievements
Rank 1
 asked on 28 Mar 2013
1 answer
106 views
The text for the radButton is overlapping the radio button.  Any suggestions?
Princy
Top achievements
Rank 2
 answered on 28 Mar 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?