Questions on UI for ASP.NET AJAX Forum

1 answer

142 views

Display RadGrid row details in AjaxToolkit ModalPopupExtender

Greetings,
I try to make the exemple The telerik team has posted here :
http://www.telerik.com/community/code-library/aspnet-ajax/grid/display-radgrid-row-details-in-ajaxtoolkit-modalpopupextender.aspx

But i don't get anything when i click on an ID ( just a OK button which make a short apparition before vanishing )... My popup does not show itself...

Can anyone help me ?

<%@ Page Title="Page d'accueil" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"

CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

<style type="text/css">

.modalBackground

{

background-color: Gray;

filter: alpha(opacity=70);

opacity: 0.7;

}

.PanelClass

{

background: white;

}

.DetailsViewHeader

{

border-bottom: 1px solid #41a901;

padding-top: 8px;

padding-bottom: 8px;

background: olive;

font-size: 13px;

font-weight: normal;

text-align: left;

color: white;

}

</style>

</asp:Content>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

<ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1">

</ajaxToolkit:ToolkitScriptManager>

<asp:DetailsView ID="DetailsView1" runat="server" DataSourceID="DetailsViewDataSource"

AutoGenerateRows="False" Width="60%" HeaderText="Contact details">

<HeaderStyle CssClass="DetailsViewHeader" />

<Fields>

<asp:BoundField DataField="Title" HeaderText="Title" />

<asp:BoundField DataField="BirthDate" HeaderText="BirthDate" DataFormatString="{0:D}" />

<asp:BoundField DataField="City" HeaderText="City" />

<asp:BoundField DataField="Country" HeaderText="Country" />

</Fields>

</asp:DetailsView>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"

onajaxrequest="RadAjaxManager1_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="DetailsView1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function PopulateDetails(rowid) {

$get("<%=btnPopUp.ClientID %>").click();

$find("<%=RadAjaxManager1.ClientID %>").ajaxRequest(rowid);

return false;

}

</script>

</telerik:RadCodeBlock>

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1"

AutoGenerateColumns="false" onitemcreated="RadGrid1_ItemCreated">

<MasterTableView DataKeyNames="EmployeeID">

<Columns>

<telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="EmployeeID">

<ItemTemplate>

<asp:LinkButton ID="btnShowDetails" runat="server" CausesValidation="false" Text='<%#Eval("EmployeeID")%>' />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="FirstName" HeaderText="First name" ReadOnly="True"

UniqueName="FirstName" />

<telerik:GridBoundColumn DataField="LastName" HeaderText="Last name" ReadOnly="True"

UniqueName="LastName" />

</Columns>

</MasterTableView>

</telerik:RadGrid>

<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"

SelectCommand="SELECT EmployeeID, LastName, FirstName FROM Employees"></asp:SqlDataSource>

<asp:SqlDataSource ID="DetailsViewDataSource" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"

ProviderName="System.Data.SqlClient" SelectCommand="SELECT Title, BirthDate, City, Country FROM Employees WHERE EmployeeID=@EmployeeID"

runat="server">

<SelectParameters>

<asp:Parameter Name="EmployeeID" Type="Int16" />

</SelectParameters>

</asp:SqlDataSource>

<asp:Panel ID="Panel1" runat="server" CssClass="PanelClass" Style="display: none;">

<asp:Button ID="btnOK" runat="server" Text="OK" />

</asp:Panel>

<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" PopupControlID="Panel1"

OkControlID="btnOK" TargetControlID="btnPopUp" BackgroundCssClass="modalBackground"

DropShadow="true">

</ajaxToolkit:ModalPopupExtender>

<asp:Button ID="btnPopUp" runat="server" Text="Show popup" Style="display: none"/>

</asp:Content>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using Telerik.Web.UI;

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadGrid1_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

LinkButton btnDetails = e.Item.FindControl("btnShowDetails") as LinkButton;

btnDetails.OnClientClick = string.Format("return PopulateDetails('{0}');", (e.Item as GridDataItem).GetDataKeyValue("EmployeeID").ToString());

}

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)

{

int eventArgument = Convert.ToInt32(e.Argument);

foreach (GridDataItem gridItem in RadGrid1.MasterTableView.Items)

{

if (Convert.ToInt32(gridItem.GetDataKeyValue("EmployeeID")) == eventArgument)

{

DetailsViewDataSource.SelectParameters["EmployeeID"].DefaultValue = eventArgument.ToString();

DetailsView1.DataBind();

return;

}

Grid

answered on 26 Oct 2011

6 answers

179 views

Rad date picker issue in format like 00/00/11

when i entered the 00/00/11 date in Rad Date Picker and press enter key it automatically changes the date to 31-Dec-2009

Calendar

answered on 26 Oct 2011

2 answers

104 views

radajaxloading panel question

Hello,

I am using this example http://demos.telerik.com/aspnet-ajax/ajax/examples/loadingpanel/explicitshowhide/defaultcs.aspx
and I am using it in a user control inside a sharepoint web part..but i cannot get the loading panel to load..all others activities seem to work properly but it is the loading panel that does not load...I had to replace the <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
with a scriptmanager proxy as sharepoint has a script manager inside the master page ...Can someone please tell me how to make it work inside sharepoint ....

The thing which i am dealing with is that i have a radgrid and I have a button..When the button is clicked some operations happen on the grid..while the operation is happening I want to show some loading panel when the button is clicked so that it shows that some operation is happening .

Thanks

Ajax

answered on 26 Oct 2011

4 answers

113 views

RadMenu and RadSiteMap (MegaDropDown) issue in ie9

Hello,

I am trying to build MegaDropDown, which is a combination of RadMenu and RadSiteMap and RadSiteMapNodes.
I have 15 menuitems.Each menuitem has Radsitemap.
Basically i have to click on the arrow button on the rightmost side of the menu inorder to see the last menu.
I was able to see Radsitemap for first few menuitems.But if i scrool to the last menuitem and click on the menuitem, i can see the site map
but , its missing styles for the header in the radsitemap.
But this is working in firefox and ie8.

Please see the attachments for more details.
In WrongStyles.png "PC Administration" and "Customer Documents" and "Others" are headings.
But its missing styles.

Please Advise.

General Discussions

answered on 26 Oct 2011

1 answer

115 views

Performance Issues with Ajaxified Radgrid

Hello,

I have a Ajaxified Grid that populates a sub grid using the OnRowSelected ClientEvent. It also opens a modal edit control with Javascript. This MasterRadGrid is rather large and takes a couple of seconds to load. The OnRowSelected even calls the rowSelected function.

function rowSelected(senders, args) {

var ajaxManager = $find('<%= RadAjaxManager1.ClientID %>');

var selectedIndex = args.get_itemIndexHierarchical();

ajaxManager.ajaxRequestWithTarget('<%= MasterRadGrid.UniqueID %>', selectedIndex);

}

Which calls the RaisePostBackEvent...

protected override void RaisePostBackEvent(IPostBackEventHandler sourceControl, string eventArgument)

{

try

{

viewstateColumnSequence = 0;

base.RaisePostBackEvent(sourceControl, eventArgument);

var grid = sourceControl as RadGrid;

if (grid != null)

{

try

{

var gridItem = grid.Items[eventArgument];

gridItem.FireCommandEvent(RadGrid.SelectCommandName, String.Empty);

}

catch { }

}

catch (Exception ex)

{

}

Which fires the CommandEvent for select...

protected void MasterRadGrid_ItemCommand(object source, Telerik.Web.UI.GridCommandEventArgs e)

{

//Needed to reset the column created column names

viewstateColumnSequence = 0;

try

{

if (e.Item != null && e.Item.ItemIndex >= 0)

{

if (e.CommandName == "Select")

{

string tempCiIdHidden = ChildTabControl.myCiIdHidden.Value;

HiddenField myCiIdHidden = (HiddenField)e.Item.FindControl("CiIdHidden");

if (tempCiIdHidden != myCiIdHidden.Value)

{

LoadChildGrid(myCiIdHidden.Value);

}

//Needed to persist the custom column template changes

MasterRadGrid.Rebind();

}

catch (Exception ex)

{

}

My issue is that every time the row is selected, it raises a postback event that reloads the MasterRadGrid, whether the data needs refreshed or not. I'm stumped on how to raise the postback event to load the child grid but prevent the MasterRadGrid from reloading. Any ideas on what I'm missing or a direction you can point me in?

Thanks for taking a look.

Smith

Ajax

answered on 26 Oct 2011

3 answers

156 views

Finding RadComboBox in Hierarchical Grid Edit Template

Hi,

I have a hierarchical grid. The 2nd level grid contains a column with an editItemTemplate, that editItemTemplate contains a RadComboBox. The DataSource of the RadComboBox returns over 30,000 rows, I am therefore using an additional parameter to pass in the first letter of the name which is entered into the RadComboBox.

I'm tring to do this on the OnSelecting event for the SqlDataSource:

protected void names_selecting(object sender, SqlDataSourceSelectingEventArgs e)

{

RadComboBox rcb = (RadComboBox)editItem.FindControl("rcb_name");

e.Command.Parameters["@starts_with"].Value = rcb.Text;

}

Can you tell me how I can find the RadComboBox within the edit template of the 2nd level grid and also if this is the right place to alter the parameter value?

Thanks in Advance,
Ryan

Grid

answered on 26 Oct 2011

1 answer

150 views

Blank Notification

I've been playing around with the RadNotificaiton and got most of my website using it now. However, I have a glitch and I was wondering if someone could help me out. I'm getting a blank notification with only the icons... just no text is visible. The only time this behavior is noticed is when there is bound data. The page works correctly in the sense that I can Insert/Edit/Delete, just getting the blank notification. Any help would be greatly appreciated.

William

Notification

answered on 26 Oct 2011

1 answer

174 views

RadToolTip Formatting Contents

Hi, i have a RadSlider with a RadToolTip attached. But i need to format the text that is being sent to the tooltip.

Eg: "1000" to "1,000".

How can i achieve this?

Best Regards,
Vitor Monteiro

ToolTip

answered on 26 Oct 2011

1 answer

103 views

hide Radgrid columns clientside

Hi,

I am binding my radgrid through WCF. when i am trying to hide the column from client side.
Blank space is getting added in to the grid.

I used both hideColumn(0); and set_visible("ID"); Both are not working

Can anyone help me.

Thanks

General Discussions

answered on 26 Oct 2011

1 answer

125 views

Finding RadGrid inside of PageView

Setup: (this is based on one of Telerik's example scenarios)

One RadTabStrip with 3 tabs
Each tab has a single PageView
Each PageView is dynamically loaded with a UserControl
Each UserControl contains a RadGrid
Each RadGrid contains a "clientselectcolumn" and allows client-side row selection

Scenario:

Select a row in grid on Tab1
Select Tab2
Select Tab1

Problem:

If I were performing this operation server-side I would use code similar to the following to find the grid:
RadGrid rg = RadTabStrip1.SelectedTab.PageView.Controls[0].FindControl("RadGrid1")
Client-side, I have been able to obtain the PageView via the onTabSelected event:
args.get_tab().get_pageView(). Unfortunately, there isn't a "findControl" method so I cannot find "RadGrid1".

Question:

How do I find the grid on Tab1 via client-side code?

Grid

answered on 25 Oct 2011