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.
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 } }
On VB.CODE side I wrote:
RadGrid1.MasterTableView.DataKeyNames = {"CustomerID"}
RadGrid1.ClientEvents.OnRowSelected = "RowSelectd"
I want to read DataKeyNames property inside OnRowSelected event:
var grid = gridName;
var oBand = grid.get_masterTableView();
var row = oBand.get_dataItems()[rowId.get_itemIndexHierarchical()];
MyLabel.value = oBand.getCellByColumnUniqueName(row, "CustomerID"
}
In this manner I'll can replace the "CustomerID" static string with the dynamic property obtained from DataKeyNames array[0]
Thanks
<add key="Telerik.Skin" value="Windows7" /><add key="Telerik.RadGrid.Skin" value="Windows7" /> <add key="Telerik.Radmenu.Skin" value="Windows7" />SkinID="Windows7"
Private Sub GRD_NewsList_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles GRD_NewsList.PreRender If Not Page.IsPostBack Then Dim val As String = GetNumeric(Request("NewsId")) If val = 0 Then GRD_NewsList.MasterTableView.IsItemInserted = True Else For Each Items As GridDataItem In GRD_NewsList.MasterTableView.Items If GetNumeric(Items.GetDataKeyValue("NewsId")) = val Then Items.Edit = True Exit For End If Next End If GRD_NewsList.Rebind() End If End Sub