Questions on UI for ASP.NET AJAX Forum

1 answer

59 views

Dynamically Creating a Cascaded RadCombo User Control

Hi all,

I've successfully created a casecaded radcombobox using the demo from here:

http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/multiplecomboboxes/defaultcs.aspx

I'm now trying to turn this into a user control and create it dynamically. The problem is the Page_Load JS function of the user control never fires. Also whenever the Page_Load of the aspx.cs fires IsPostback is always true. Can anyone help?

User control code behind:

public partial class ctrlCascadedProcedureDropDown : System.Web.UI.UserControl

{

public int ProcedureTypeSelectedValue { get; set; }

public int ProcedureSelectedValue { get; set; }

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

LoadProcedureTypes();

if (ProcedureTypeSelectedValue > 0)

LoadProcedures(ProcedureTypeSelectedValue.ToString());

rcbProcedureType.SelectedValue = ProcedureTypeSelectedValue.ToString();

rcbProcedure.SelectedValue = ProcedureSelectedValue.ToString();

}

else if (!Page.IsCallback)

{

if (rcbProcedureType != null)

LoadProcedures(rcbProcedureType.SelectedValue);

}

protected void rcbProcedureType_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)

{

LoadProcedureTypes();

}

protected void rcbProcedure_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)

{

LoadProcedures(e.Text);

}

protected void LoadProcedureTypes()

{

TARNDB.OpsProcedureType opsProcedureType = new TARNDB.OpsProcedureType();

rcbProcedureType.DataSource = opsProcedureType.GetProcedureTypes().OrderBy(x => x.ProcedureType);;

rcbProcedureType.DataValueField = "ID";

rcbProcedureType.DataTextField = "ProcedureType";

rcbProcedureType.DataBind();

rcbProcedureType.Items.Insert(0, new RadComboBoxItem(""));

}

protected void LoadProcedures(string proceduretypeid)

{

int _proceduretypeid;

if (int.TryParse(proceduretypeid, out _proceduretypeid))

{

TARNDB.OpsProcedure opsProcedure = new TARNDB.OpsProcedure();

rcbProcedure.DataSource = opsProcedure.GetProcedures(_proceduretypeid).OrderBy(x => x.ProcedureName); ;

rcbProcedure.DataValueField = "ID";

rcbProcedure.DataTextField = "ProcedureName";

rcbProcedure.DataBind();

}

User control mark-up:

<div>

<telerik:RadComboBox ID="rcbProcedureType" runat="server"

OnClientSelectedIndexChanging="LoadProcedures"

OnItemsRequested="rcbProcedureType_ItemsRequested" />

<telerik:RadComboBox ID="rcbProcedure" runat="server" Width="250px"

OnClientItemsRequested="ItemsLoaded"

OnItemsRequested="rcbProcedure_ItemsRequested" />

</div>

<script type="text/javascript">

var rcbProcedure;

var rcbProcedureType;

function pageLoad() {

rcbProcedure = $find("<%= rcbProcedure.ClientID %>");

rcbProcedureType = $find("<%= rcbProcedureType.ClientID %>");

alert("in");

}

function LoadProcedures(sender, eventArgs) {

var item = eventArgs.get_item();

rcbProcedure.set_text("Loading...");

// if a procedure type is selected

if (item.get_index() > 0) {

// this will fire the ItemsRequested event of the

// procedures combobox passing the procedureTypeID as a parameter

rcbProcedure.requestItems(item.get_value(), false);

}

else {

// the -Select a continent- item was chosen

rcbProcedure.set_text(" ");

rcbProcedure.clearItems();

}

function ItemsLoaded(sender, eventArgs) {

if (sender.get_items().get_count() > 0) {

// pre-select the first item

sender.set_text(sender.get_items().getItem(0).get_text());

sender.get_items().getItem(0).highlight();

}

//sender.showDropDown();

}

</script>

Page using the user control code behind:

public partial class Operations : BasePage

{

public List<DynamicControl> DynamicControls

{

get

{

return (List<DynamicControl>)Session["_DynamicControls"];

}

set

{

Session["_DynamicControls"] = value;

}

protected void Page_Init(object sender, EventArgs e)

{

if (!IsPostBack)

{

DynamicControls = null;

}

else

{

if (DynamicControls != null && DynamicControls.Count > 0)

{

foreach (DynamicControl control in DynamicControls)

{

ctrlCascadedProcedureDropDown cpd = new ctrlCascadedProcedureDropDown();

cpd.ID = control.ID;

switch (control.PlaceHolder.ID)

{

case "phProcedure":

phProcedure.Controls.Add(cpd);

phProcedure.Controls.Add(new Literal() { Text = "<BR />" });

break;

default:

break;

}

protected void btnAddProcedure_Click(object sender, EventArgs e)

{

AddDynamicProcedureControl("Procedure", phProcedure);

}

private void AddDynamicProcedureControl(string name, PlaceHolder placeHolder, int procedureTypeSelectedValue = 0,

int procedureSelectedValue = 0)

{

Control control = LoadControl("~/Controls/ctrlCascadedProcedureDropDown.ascx");

ctrlCascadedProcedureDropDown cpd = (ctrlCascadedProcedureDropDown)control;

int controlCount = (DynamicControls == null ? 0 : DynamicControls.Count);

string ID = string.Concat(name, controlCount.ToString());

cpd.ID = ID;

cpd.ProcedureTypeSelectedValue = procedureTypeSelectedValue;

cpd.ProcedureSelectedValue = procedureSelectedValue;

DynamicControl dc = new DynamicControl() { ID = ID, PlaceHolder = placeHolder };

if (DynamicControls == null)

DynamicControls = new List<DynamicControl>();

DynamicControls.Add(dc);

placeHolder.Controls.Add(cpd);

placeHolder.Controls.Add(new Literal() { Text = "<BR />" });

}

private List<int> GetDynamicList(PlaceHolder placeHolder)

{

List<int> list = null;

list = new List<int>();

foreach (Control control in placeHolder.Controls)

{

if (control is GenericDropDown)

{

int id;

if (int.TryParse(((GenericDropDown)control).SelectedValue, out id) && id > 0)

list.Add(id);

}

return list;

}

ComboBox

answered on 26 Mar 2012

1 answer

78 views

edit and export Radgrid content to excel

hi,
I need to create UPDATES statements from a RadGrid,
How to edit the information and export them to excel file to create UPDATE statements?

Grid

answered on 26 Mar 2012

1 answer

60 views

Odd Rebind Behaviour

I have a radgrid bound to a iList of objects. I have a command button that executes a javascript function that executes an ajax request using a radajaxmanager. This request adds a number of new objects to the list then calls the rebind method of the grid. The new objects appear in the grid briefly then dissappear and only the original objects are there. If i execute the ajax request again, you can see all the newly added objects fomr the second request, plus the previously added objects from the first request, plus the original objects for a brief moment, then they dissappear and the grid only shows the original objects.

The list actually contains all the objects, but the grid seems to be reverting back to the original cache when the app started.

Anyone seen this before?

I am using the grid in other places without problem.

Grid

answered on 26 Mar 2012

3 answers

238 views

Refreshing the parent control without closing Rad Window

Hi ,
I am using RadWindowManager in my application , I need to send a argument from the Window to its parent Control.I am adding the records form Rad Window which are displayed on its parent control , when i hit a particular button i need to refresh the parent so that the records get updated in the parent control without closing the Rad Window..

Can some one help me on this?

Thanks

Window

answered on 26 Mar 2012

1 answer

64 views

Use Response.Redirect on SelectedTabChange

I have a ribbonbar in a masterpage. What I want to accomplish is to perform a response.redirect("urlhere") when the end user clicks on a tab. I am trying to accomplish this by using the following code below:

Private Sub rrbMain_SelectedTabChange(sender As Object, e As Telerik.Web.UI.RibbonBarSelectedTabChangeEventArgs) Handles rrbMain.SelectedTabChange

Select Case e.Tab.Text

Case "Tab1"

Response.Redirect("~/tab1.aspx")

Case "Tab2"

Response.Redirect("~/tab2.aspx")

End Select

End Sub

Unfortunately, that does not work. Clicking on a tab does not perform any redirection. Your help is appreciated. Thanks.

RibbonBar

answered on 26 Mar 2012

1 answer

381 views

Two RadAjaxManager on 1 page.

Hello,

Am havinf 2 usercontrols in my project and both are having RadAjaxManager.
i have register both controls on singel page.

<%

@ Register TagPrefix="ModelData" TagName="ucSourscDoc" Src="~/PeerBenchmarking/controls/ucSourceDocument.ascx" %>

<%

@ Register TagPrefix="ModelData" TagName="ucUploadDoc" Src="~/PeerBenchmarking/controls/ucUploadDocument.ascx" %>

So its giving me error as

Only one instance of a RadAjaxManager can be added to the page!

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.InvalidOperationException: Only one instance of a RadAjaxManager can be added to the page!

i need RadAjaxManager on both usercontrol because i want to show loading image while datatloading.

Any solution for this?

Ajax

answered on 26 Mar 2012

3 answers

162 views

Update GridBoundColumn Client

Hello Telerik,

I have a non-editable RadGrid (say Grid1) with some columns. I have another grid (say Grid2) on the page which should update a hidden field (GridBoundColumn) in Grid1 when the item template asp:checkbox is clicked. The whole Grid1 should persist back to the server on another button for saving the changes, not a row at time, or after every check of Grid2. How can this be achieved in Javascript? I cant seem to find the correct syntax for the datagrid items to write to it on Grid1. The innerHTML doesnt persist back, so I cant use that. This seems like a simple thing, but the documentation doesnt show enough help for the grid items properites. Maybe I can attach and attribute to each row of Grid1 and update the attribute value. But I dont see any syntax again in the documentation. Can you please point me in the right direction? And if this is missing from the documentation please update it.

Here is the code:

Grid1:

<telerik:RadGrid runat="server" ID="RadGridBoardPositionLink" AllowMultiRowSelection="false">

<MasterTableView DataKeyNames="BoardPositionId" ClientDataKeyNames="BoardPositionId, ProgramLink, GroupLink" AutoGenerateColumns="false" TableLayout="Fixed" NoMasterRecordsText="You do not have any board positions created" CommandItemDisplay="Top">

<CommandItemSettings ShowAddNewRecordButton="false" ShowRefreshButton="false" />

<CommandItemTemplate>

<asp:Panel runat="server" CssClass="CommandItemPanel">

<telerik:RadButton runat="server" ID="RadButtonSaveBoardPositionLink" Text="Save"/>

</asp:Panel>

</CommandItemTemplate>

<Columns>

<telerik:GridBoundColumn DataField="BoardPositionID" DataType="System.Int64" UniqueName="BoardPositionID" Display="false" />

<telerik:GridBoundColumn DataField="ApplicationId" DataType="System.Int64" UniqueName="ApplicationId" Display="false" />

<telerik:GridBoundColumn DataField="ProgramLink" DataType="System.String" UniqueName="ProgramId" Display="false" />

<telerik:GridBoundColumn DataField="GroupLink" DataType="System.String" UniqueName="GroupLink" Display="false" />

<telerik:GridBoundColumn DataField="ProgramId" DataType="System.Int64" UniqueName="ProgramId" Display="false" />

<telerik:GridBoundColumn DataField="Name" DataType="System.String" HeaderText="Position Name" UniqueName="Name" ItemStyle-Width="25%" HeaderStyle-Width="25%" />

</Columns>

</MasterTableView>

<ClientSettings EnableRowHoverStyle="true">

<Selecting AllowRowSelect="true" />

<ClientEvents OnRowSelected="RowSelectedRadGridBoardPositionLink"/>

</ClientSettings>

</telerik:RadGrid>

Grid2:

<telerik:RadGrid runat="server" ID="RadGridProgramsLink" AllowAutomaticDeletes="false" AllowAutomaticInserts="false" AllowAutomaticUpdates="false" AllowMultiRowSelection="true">

<MasterTableView DataKeyNames="ProgramId" ClientDataKeyNames="ProgramId" CommandItemDisplay="None" AutoGenerateColumns="false" TableLayout="Fixed">

<Columns>

<telerik:GridTemplateColumn HeaderStyle-Width="20px" ItemStyle-Width="20px">

<ItemTemplate>

<asp:CheckBox runat="server" ID="CheckboxProgramCheck" AutoPostBack="false" Onclick="OnCheckedCheckBoxProgram(this);" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="ProgramId" DataType="System.Int64" UniqueName="ProgramId" Display="false" />

<telerik:GridBoundColumn DataField="Name" DataType="System.String" UniqueName="Name" HeaderText="Program Name" HeaderStyle-Width="150px" ItemStyle-Width="150px" />

</Columns>

</MasterTableView>

</telerik:RadGrid>

OnClick event for Grid2

function OnCheckedCheckBoxProgram( sender )

{

if ( myRowSelectedBoardPositionLink == 0 )

{

radalert( "You need to select a position to assign program(s)", 400, 100, "Assign Program", null );

return false;

}

// assign it to the attribute of the selected position record

AssignProgramId();

}

This string is created and needs to be written to Grid1, at the end of the function it writes it out, but how?

function AssignProgramId()

{

// selected row of the Board Position to edit the ProgramId attribute

var myCheckbox;

var myString = "";

var myMasterTable = $find( "<%= RadGridProgramsLink.ClientID %>" ).get_masterTableView();

// build the array and store back in the SelectedRow - BoardPosition table

for ( var i = 0; i < myMasterTable.get_dataItems().length; i++ )

{

myCheckbox = myMasterTable.get_dataItems()[i].findElement( "CheckboxProgramCheck" );

if ( myCheckbox.checked )

{

myString = myString + myMasterTable.get_dataItems()[i].getDataKeyValue( 'ProgramId' ) + "|";

}

myMasterTable = $find( "<%= RadGridBoardPositionLink.ClientID %>" ).get_masterTableView();

// ***** CODE HERE FOR WRITTING TO THE SELECTED ROW ProgramLink COLUMN ******

}

Thanks a ton!
SDI

Grid

answered on 26 Mar 2012

1 answer

126 views

borderwidth in tooltip

Hi,
How can i set border width of tool tip?
I have set as shown in below code but not showing the width as specified.

<div style="z-index: 1;">

<telerik:RadToolTip runat="server" ID="testTooltip" HideEvent="FromCode" Position="Center"

Width="400px" Height="200px" Animation="None" ShowEvent="OnClick" ShowDelay="0"

ManualClose="true" EnableViewState="true" TargetControlID="" RenderInPageRoot="true"

RelativeTo="BrowserWindow" ShowCallout="False" Modal="true" BorderWidth="6spx"

BorderColor="Gray" BorderStyle="Solid">

</telerik:RadToolTip>

</div>

I am using telerik version Q1 2012 (2012.1.215.35).

ToolTip

answered on 26 Mar 2012

3 answers

317 views

How to Open RadWindow in RadGrid with ServerSide.

<MasterTableView TableLayout="Auto" EditMode="PopUp" AlternatingItemStyle-BorderColor="Red">

<Columns>

<telerik:GridClientSelectColumn HeaderStyle-Width="36px">

<HeaderStyle Width="36px" />

</telerik:GridClientSelectColumn>

<telerik:GridBoundColumn DataField="pkID" HeaderText="SerialNO" UniqueName="pkID">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Visit_IP" HeaderText="IP" UniqueName="Visit_IP">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="DateTimes" HeaderText="DateTime" UniqueName="DateTimes">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="Edit" UniqueName="TemplateEditColumn">

<ItemTemplate>

<asp:LinkButton runat="server" ID="LinkButtonEdit" Text="LinkButtonEdit" CommandName="LinkButtonEdit" CommandArgument='<%# Eval("pkID") %>' />

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem dataItem = ((GridDataItem)(e.Item));

LinkButton linkButton = dataItem.FindControl("LinkButtonEdit") as LinkButton;

linkButton.ID = "LinkButtonEditID_" + dataItem.ItemIndex;

linkButton.Text = "LinkButtonEditText_" + dataItem.ItemIndex;

RadWindowIndexBuilder winbuider = new RadWindowIndexBuilder(this.RadWindowManager1, this.RadPaneWindow.ClientID, dataItem);

linkButton.Click += winbuider.LinkButtonEdit_Click;

}

//How to Get/Set Follow Value for 'pkID' From Rows of RadGrid ???????

public class RadWindowIndexBuilder

{

RadWindowManager radWindowManager = null;

string restrictionZoneID = null;

int index = 0;

string pkid = null;

public RadWindowIndexBuilder(RadWindowManager RadWindowManager1, string RestrictionZoneID,

GridDataItem Item)

{

radWindowManager = RadWindowManager1;

restrictionZoneID = RestrictionZoneID;

index = Item.ItemIndex;

pkid = "???";

//How to Get/Set this Value From Rows of RadGrid ???

           //pkid = Item.GetDataKeyValue("pkID").ToString(); ???

           //pkid = Item.OwnerTableView.DataKeyValues[Item.ItemIndex][0].ToString(); ???

}

public void LinkButtonEdit_Click(object sender, EventArgs e)

{

radWindowManager.Windows.Clear();

RadWindow rwin = new RadWindow();

rwin.ID = "RadWindowLinkButtonEdit_" + index;

rwin.Modal = false;

rwin.Width = 640;

rwin.Height = 480;

rwin.Skin = "Office2007";

rwin.NavigateUrl = "AdminContentBuilderInfo.aspx?id=" + pkid;

rwin.Behaviors = WindowBehaviors.Close;

rwin.InitialBehaviors = WindowBehaviors.Maximize | WindowBehaviors.None;

rwin.RestrictionZoneID = restrictionZoneID;

rwin.VisibleOnPageLoad = true;

radWindowManager.Windows.Add(rwin);

}

Grid

answered on 26 Mar 2012

2 answers

138 views

Issue with RadDockZone Orientation property

Hi,

I am facing issue when i am using the property of RadDockZone control . whenever i am keeping Orientation property as Horizontal . when i am doing minimize then the RadDock width is auto generated . how to remove the auto generated width. all screenshots are attached please refer and provide some good solution.

Thanks,
Rajesh

Dock

answered on 26 Mar 2012