Questions on UI for ASP.NET AJAX Forum

1 answer

107 views

I have MasterPage and its ChildPage. On ChildPage I have JavaScript function that is raised on RadSplitter.OnClientLoad="abc". Basicly, this fires on page load as last client event and that is good for me to do something.

function abc() {

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

}

This works normally.

Now I want to add one JavaScript-to-AjaxRequest function to MasterPage, I want to check something from database when every ChildPage gets focused, something like this (this is on MasterPage):

window.onfocus = function onFocus() {

$find("<%=RadAjaxPanel1.ClientID%>").ajaxRequest('DoSomething');

};

Because I can't have two AjaxManager (on MasterPage and ChildPage), I put AjaxPanel in MasterPage.

So, when I request ChildPage in browser, both AjaxRequests should be fired, first one in MasterPage and then from ChildPage. RadAjaxPanel1.ajaxRequest from MasterPage works but AjaxManager.AjaxRequest from ChilPage don't work! When I remove function from MasterPage, function from ChildPage works normally and vice versa.

How to set both AjaxRequests work together, simultaneously? Obviously there is some conflict beetween them.

There is many articles on Internet about multiple AjaxRequests on same time but I don't understand what to do to correct problem.

Ajax

answered on 13 Jun 2011

1 answer

111 views

To get selected node details in treeview

hi

I have dynamically initialized a treeview(i.e from backend) and the treeview contains checkboxes and i want to get the details of the node i have selected in the checkbox

General Discussions

answered on 13 Jun 2011

4 answers

253 views

Hide Delete Button in Details Table based on condition

My last challenge to solve and this project will work.

I have a Delete button in a DETAILS TABLE. Using the GridButtonColumn with CommandName="Delete" and UniqueName="Delete Entry"

I need to be able to hide these based on certain conditions. I would probably put the code in the ItemDataBound. I would need to reference my second DataKeyName (QTRInserted) to decide to Hide or Show the Delete button. I DO NOT WANT TO HIDE THE ENTIRE COLUMN. Thanks.

<DetailTables>

<telerik:GridTableView runat="server" DataSourceID="sqlDSDetails" Name="Details"

Width="100%" CommandItemDisplay="Top" DataKeyNames="Details_ID, QTRInserted">

<ParentTableRelation>

Grid

answered on 13 Jun 2011

1 answer

48 views

RadScheduler - Do not want to show TimeLine on the header

Hello RadScheduler Experts,

For our radscheduler, we do not want to show the TimeLine on the header. But we do want to show the Day, Week, Month.
If you can please point me to how this can be possible.

Thank you.

Scheduler

answered on 12 Jun 2011

6 answers

236 views

RadGrid issue: get_dataItems() not updated after set_dataSource()

Hello, I've an issue with client-side databinding of a RadGrid. In fact, when I do a .set_dataSource(<dataSource>) and a .dataBind(), data is successfully loaded in the RadGrid but the length of the property _dataItems doesn't change.

Here is the code of the RadGrid:

<Telerik:RadGrid ID="RGWebsites" runat="server" OnNeedDataSource="RGWebsites_NeedDataSource" AllowMultiRowSelection="true" ClientSettings-DataBinding-EnableCaching="false">

<MasterTableView AutoGenerateColumns="False" DataKeyNames="WebsiteID" ClientDataKeyNames="WebsiteID">

<Columns>

<telerik:GridBoundColumn DataField="WebsiteID" HeaderText="Website ID" HeaderStyle-Width="20%" ItemStyle-Width="20%" />

<telerik:GridBoundColumn DataField="ContractType" HeaderText="Contract type" HeaderStyle-Width="20%" ItemStyle-Width="20%" />

<telerik:GridBoundColumn DataField="WebsiteName" HeaderText="Website name" HeaderStyle-Width="20%" ItemStyle-Width="20%" />

<telerik:GridBoundColumn DataField="StartDate" HeaderText="Start date" HeaderStyle-Width="20%" ItemStyle-Width="20%" DataType="System.DateTime" DataFormatString="{0:MM/dd/yyyy}" />

<telerik:GridBoundColumn DataField="EndDate" HeaderText="End date" HeaderStyle-Width="20%" ItemStyle-Width="20%" DataType="System.DateTime" DataFormatString="{0:MM/dd/yyyy}" />

</Columns>

</MasterTableView>

<ClientSettings>

<Selecting AllowRowSelect="true" />

</ClientSettings>

</Telerik:RadGrid>

Here is the code executed in order to load data in the RadGrid:

function onSuccessGetWebsites(result) {

if (result && result.Data !== undefined) {

var tableView = RGWebsites.get_masterTableView();

tableView.set_dataSource(result.Data);

tableView.dataBind();

// By defaut all rows are selected

tableView.selectAllItems();

resizeHeight();

} else {

if (result.Message) {

showError(result.Message, 0);

}

else {

showError('onSuccessGetWebsites() result param is empty !', -1);

}

$('#' + RGWebsites.get_element().id).unblock();

};

Example to explain you more clearly my issue:
At the first client-side loading, 126 rows are binded in the RadGrid and selected. So the method .get_dataItems() and the method .get_selectedItems() returm 126 items, it's good. But at the second client-side loading, 4 rows are binded in the RadGrid and selected. The grid display 4 rows so it seems to be good again.. but in fact, when I try to do .get_dataItems() or .get_selectedItems() it returns 126 items again! The 4 first items in _dataItems property are the 4 correct items but there're 122 other items (old items).
I tried to manually delete all items in property _dataItems of the grid but it doesn't work.

I need to know which items are selected so it's a real problem.

Thank's for your help.

Grid

answered on 12 Jun 2011

2 answers

79 views

RadRotator: Combine Automatic and FormCode Rotations

How can I create a a rotator with "FormCode" mode while being able to start that rotator automatically when the page loads? I need a complete sample code for the call.

I've used the following JavaScript/JQuery code for FormCode management:

<script type

="text/javascript">

//<![CDATA[

function

startRotator(clickedButton, rotator, direction)

{

if

(!rotator.autoIntervalID)

{

refreshButtonsState(clickedButton, rotator);

rotator.autoIntervalID = window.setInterval(

function

()

{

rotator.showNext(direction);

}, rotator.get_frameDuration());

}

function

stopRotator(clickedButton, rotator)

{

if

(rotator.autoIntervalID)

{

refreshButtonsState(clickedButton, rotator)

window.clearInterval(rotator.autoIntervalID);

rotator.autoIntervalID =

null

}

function

showNextItem(clickedButton, rotator, direction)

{

rotator.showNext(direction);

refreshButtonsState(clickedButton, rotator);

}

// Refreshes the Stop and Start buttons

function

refreshButtonsState(clickedButton, rotator)

{

var

jQueryObject = $telerik.$;

var className = jQueryObject(clickedButton).attr("class"

);

switch

(className)

{

case "start"

:

{

// Start button is clicked

jQueryObject(clickedButton).removeClass();

jQueryObject(clickedButton).addClass(

"startSelected"

);

// Find the stop button. stopButton is a jQuery object

var stopButton = findSiblingButtonByClassName(clickedButton, "stopSelected"

);

if

(stopButton)

{

// Changes the image of the stop button

stopButton.removeClass();

stopButton.addClass(

"stop"

);

}

break

;

case "stop"

:

{

// Stop button is clicked

jQueryObject(clickedButton).removeClass();

jQueryObject(clickedButton).addClass(

"stopSelected"

);

// Find the start button. startButton is a jQuery object

var startButton = findSiblingButtonByClassName(clickedButton, "startSelected"

);

if

(startButton)

{

// Changes the image of the start button

startButton.removeClass();

startButton.addClass(

"start"

);

}

break

;

}

// Finds a button by its className. Returns a jQuery object

function

findSiblingButtonByClassName(buttonInstance, className)

{

var

jQuery = $telerik.$;

var ulElement = jQuery(buttonInstance).parent().parent();

// get the UL element

var allLiElements = jQuery("li", ulElement);

// jQuery selector to find all LI elements

for (var

i = 0; i < allLiElements.length; i++)

{

var

currentLi = allLiElements[i];

var currentAnchor = jQuery("A:first", currentLi);

// Find the Anchor tag

if

(currentAnchor.hasClass(className))

{

return

currentAnchor;

}

//]]>

</script

>

And the following code for the calls:

<

a href="#" onclick="stopRotator(this, $find('<%= MyRotator.ClientID %>

')); return false;"

class="stopSelected" title="Stop"><span>Stop</span></a> <a href="#" onclick="startRotator(this, $find('<%= MyRotator.ClientID %>

'), Telerik.Web.UI.RotatorScrollDirection.Left); return false;"

class="start" title="Start"><span>Start</span></a> <a href="#" onclick="showNextItem(this, $find('<%= MyRotator.ClientID %>

'), Telerik.Web.UI.RotatorScrollDirection.Left); return false;"

class="left" title="Left"><span>Up</span></a> <a href="#" onclick="showNextItem(this, $find('<%= MyRotator.ClientID %>

'), Telerik.Web.UI.RotatorScrollDirection.Right); return false;"

class="right" title="Right"><span>Down</span></a

>

However, I cannot start the rotator on the page load. Tried to use this code in the in the MyRotator_DataBoud event, but did not work either:

protected void rrMyRotator_DataBound(object sender, EventArgs

e)

{

Page.RegisterClientScriptBlock(

"MyScript",

"<SCRIPT Language='JavaScript'> startRotator(this, $find('<%= MyRotator.ClientID %>'), Telerik.Web.UI.RotatorScrollDirection.Left);</SCRIPT>"

);

}

Please show me the code that I need to write to start the rotator right after loading the page, and the location where I should place that code. Thank you.

Rotator

answered on 11 Jun 2011

2 answers

379 views

How to refresh RadListBox on RadWindow Close

Hello,

I'm opening a RadWindow that allows a user to enter a record into a database. On the OnClientClose() event, I'm trying to refresh a RadListBox that is in a RadAjaxPanel in the parent page. This seems like it should be straight forward but I'm not having any luck. I'm new to web programming so I'm sure I just don't understand something. I am making it to the code behind once the window is closed so I know the DataBind() is executing. However, while I see the loading panel displayed the new item does not show up in the RadListBox. Any ideas as to what I'm doing wrong? Thanks!

ASP

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadAjaxPanel1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="lstProducts" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Windows7" />

<qsf:InformationBox runat="server"

Title="Please note you can't obsolete a product if it is still in use by another team.<br>You can add or edit products by right-clicking on the 'Products' box."

Width="97%">

</qsf:InformationBox>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Height="200px" Width="300px"

OnAjaxRequest="RadAjaxPanel1_AjaxRequest">

<telerik:RadListBox ID="lstProducts" runat="server" AllowTransfer="True" AutoPostBackOnTransfer="True"

DataSortField="PRODUCT" DataSourceID="SqlDataSource1" DataTextField="PRODUCT"

DataValueField="PRODUCT_ID" EnableDragAndDrop="True" Height="250px" OnTransferred="lstProducts_Transferred"

SelectionMode="Multiple" Skin="Windows7" OnClientContextMenu="showContextMenu"

Style="top: 0px; left: 0px; width: 215px" TransferToID="lstObsolete" AllowAutomaticUpdates="True">

</telerik:RadListBox>

</telerik:RadAjaxPanel>

Javascript

function OnClientClose()

{

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

}

C#

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)

{

if (e.Argument == "Rebind")

{

lstProducts.DataBind(); //i do make it here

}

Ajax

answered on 10 Jun 2011

2 answers

82 views

finding the client Id of combo box inside panel bar

i am using the example of related combo box

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

The only problem, I am having is my combo box is inside the RadpanelBar. I could not figure out what to write for this

function pageLoad()
{
    // initialize the global variables
    // in this event all client objects
    // are already created and initialized
    countriesCombo = $find("<%= RadComboBox2.ClientID %>");
    citiesCombo = $find("<%= RadComboBox3.ClientID %>");
}

when I do this
$find("<%= RadComboBox2.ClientID %>");

It could not find the control because this combo box is inside the rad panel bar. can anyone please tell me the script to get the client ID of the control inside the radpanel bar,

any help will be apprecaited.

ComboBox

answered on 10 Jun 2011

4 answers

128 views

Error Rendering Controls

My company just purchased the Developer license for the ASP.NET version 2011.1.519.35 control set. After complete removal of the trial version and re-installation of the purchased product I am now receiving the error in the attached controlerror.png file. I removed all instances of Telerik from the web.config during the removal of the Trial version. I then copied the new telerik.web.ui.dll and placed it into the solution libary folder and references that dll in the solution. I then ran the 'configure project' selection from Telerik menu to bring my web.config into compliance for this version. No existing controls in the project will render either all controls are showing different errors ( see attached Page1Errors.png) any help would be appreciated.

General Discussions

answered on 10 Jun 2011

3 answers

186 views

RadGrid with NestedViewTemplate and Scrolling

I am trying to use the NestedViewTemplate with scrollable table.
I would simple like to add a nested template into a table like this one:
http://demos.telerik.com/aspnet-ajax/grid/examples/client/scrolling/defaultcs.aspx

However, I have no luck doing so...

There might be another way to achieve what i'm looking for, which is to have a grid where each row is actually contracted out of 2 rows so the second row of the record (similar to nestedview) will present some additional info (like "comments")

Something like this:

Row1, Cell 1:<name> | Row1, Cell 2:<email> | Row1, Cell 3:<phone> | Row1, Cell 4:<>
Row2, Cell1 (colspan=4) comments are typed here
Row3, Cell 1:<name> | Row3, Cell 2:<email> | Row3, Cell 3:<phone> | Row3, Cell 4:<>
Row4, Cell1 (colspan=4) comments are typed here

Is that possible?

Grid

answered on 10 Jun 2011