Questions on UI for ASP.NET AJAX Forum

1 answer

422 views

I have a page with user control A and user control B.

In user control A, I have a RadAsyncFileUpload. while I click on a button (say Next) The page loads user control B. I have a breadcrumb set on top of the page. So what I want is when I hit the breadcrumb to load the previous state (i.e. load user control A again) I want the RadAsyncFileUpload to retain the file information and value.

How can I achieve that? I' pretty new to telerik.

I tried the following from the back end (so that only hitting the cancel will triger postback, all other click will retain the information for the upload control)

Telerik.Web.UI.RadButton btncancel = (Telerik.Web.UI.RadButton)this.Parent.Parent.FindControl("btn_Cancel_ID");
RadAsyncFileUpload.PostbackTriggers = new string[] { btncancel.ID };

I also have "AllowedFileExtensions" on the file upload control. with the postback trigger being enables as above, when I try to navigate clicking the next button, it's not finding any file uploaded in the first place and I'm getting "RadAsyncFileUpload.UploadedFiles.Count" to be zero.

AsyncUpload

answered on 15 Oct 2015

3 answers

282 views

Play External Video Files

Hi,

I am trying to play a video using an URL.

But i am not able to play it.

Can you suggest me the best approach for this?

<telerik:RadMediaPlayer ID="RadMediaPlayer1" runat="server" Height="360px" Width="640px"
Source="http://localhost/XTPSaaS/Albums/a344f305-f9e3-4ff6-b2ec-8ce4fa60c432/o_Screwdriver.avi">
</telerik:RadMediaPlayer>

Regards,

Varun R

MediaPlayer

answered on 15 Oct 2015

2 answers

220 views

RadWindow behavior

I have Radwindow which Pops up by clicking ImageButton on RadGrid and Radwindow is not working whenever i set its Property Visible = true. Though its working by setting visibleonpageload=true. but it pops up every time page is loaded.

<telerik:RadWindow ID="radtooltipshowbom" AutoSize="true" KeepInScreenBounds="true" AutoSizeBehaviors="Default" ContentScrolling="Y" RenderInPageRoot="false" runat="server" Modal="true" HideEvent="ManualClose"

Style="z-index: 6990" Position="TopCenter" BackColor="White" Width="1510px" Height="670px">

Window

answered on 15 Oct 2015

1 answer

90 views

In Grid td is data is not showing in mozila.

I am using ragrid.The td value should come.

It is working fine in chrome.But in mozila and IE data is not comming.

Please check the code

In mozila:

In chrome

<td class="rgExpandCol"><input type="button" name="ctl00$ContentMainBody$RadGrid_Publication$ctl00$ctl04$GECBtnExpandColumn" value=" " onclick="javascript:__doPostBack('ctl00$ContentMainBody$RadGrid_Publication$ctl00$ctl04$GECBtnExpandColumn','')" id="ctl00_ContentMainBody_RadGrid_Publication_ctl00_ctl04_GECBtnExpandColumn" title="Expand" class="rgExpand"></td>
<td>Abu Dhabi Statistics</td>

Please help

Grid

answered on 15 Oct 2015

8 answers

547 views

[Solved] Selenium IDE with RadComboBox

Hi,

I use Selenium IDE 1.4.1 to test my website. This all works fine except for some Telerik controls that are used. To be more specific, I cannot select/click items from the RadComboBox (Telrik control) with Selenium IDE. Several topics are available but none of the solutions work for me... Maybe somebody can put me on the right track?

The control in HTML looks like this:

RadComboBox (closed)
<td class="rcbInputCell rcbInputCellLeft" style="width:100%;">
<input id="ctl00_ddlNavigateTo_Input" class="rcbInput" type="text" readonly="readonly" value=" Go to" name="ctl00$ddlNavigateTo" autocomplete="off">
</td>
<td class="rcbArrowCell rcbArrowCellRight">
<a id="ctl00_ddlNavigateTo_Arrow" style="overflow: hidden;display: block;position: relative;outline: none;">select</a>
</td>

--> id="ctl00_ddlNavigateTo_Arrow" is the "arrow" next to the ComboBox to open the list.

RadComboBox (activated)
<div class="rcbSlide" style="z-index: 6000; visibility: visible; display: block; overflow: visible; margin-left: 0pt; position: absolute; top: 75.5px; left: 1340.02px; height: 196px; width: 282px;">
<div id="ctl00_ddlNavigateTo_DropDown" class="RadComboBoxDropDown RadComboBoxDropDown_Windows7 " style="display: block; width: 280px; visibility: visible; top: 0px; left: 0px;">
<div class="rcbScroll rcbWidth" style="width: 100%; overflow: auto; height: 193.5px;">
<ul class="rcbList" style="list-style:none;margin:0;padding:0;zoom: 1;">
<li class="rcbItem "> Go to</li>
<li class="rcbItem ">Grid</li>
<li class="rcbItem ">Portfolio balance</li>
<li class="rcbItem ">Portfolio finance</li>
</ul></div></div></div>

--> The items Grid, Portfolio balance, and Portfolio finance are the items in the list that can be selected to link to a different page.

Current commands in Selenium:

Command: click
Target: id=ctl00_ddlNavigateTo_Arrow
(opens the list of the combobox)

Command: waitForVisible
Target: id=ctl00_ddlNavigateTo_DropDown
(waits for the actual list to show up)

Command: waitForElementPresent
Target: //div[@id=ctl00_ddlNavigateTo_DropDown]

Command: mouseOver
Target: //div[@id="Portfolio balance"]

Command: click
Target: //div[@id="Portfolio balance"]

I've included the last 3 items based on several other topics. However it is not working... Does somebody know the right commands and targets
for Selenium IDE to deal with the RadComboBox?

Thanks!

ComboBox

answered on 15 Oct 2015

31 answers

6.5K+ views

ItemDatabound RadGrid

Hi All,
I use RadGrid control,
I want each row add attribute, I use ItemDatabound
But I don't know how ItemDatabound work

Please help me,
Thanks!

Grid

answered on 14 Oct 2015

13 answers

590 views

Export DetailTable to Excel

Hi all,
I have a RadGrid with 2 levels of data hierarchy (Countries > Campaigns > Entries) . I only want to export the lowest level grid (Entries) to Excel.

For some reason, the Export isn't happening. The ItemCommand event with the CampaignsRadGrid.MasterTableView.ExportToExcel(); call is being hit though, but the only thing that happens is that the pagination controls, on the bottom of the grid, disappear.

ASPX code:

<telerik:RadAjaxManagerProxy ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="CampaignsRadGrid">

<UpdatedControls>

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

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManagerProxy>

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

<telerik:RadGrid ID="CampaignsRadGrid" Width="97%" Skin="Office2007"

AllowPaging="True" PageSize="10" runat="server" AllowSorting="true"

AutoGenerateColumns="false" GridLines="None"

onneeddatasource="CampaignsRadGrid_NeedDataSource"

ondetailtabledatabind="CampaignsRadGrid_DetailTableDataBind"

onitemcommand="CampaignsRadGrid_ItemCommand"

>

<PagerStyle Mode="NextPrevNumericAndAdvanced" AlwaysVisible="true" />

<MasterTableView Width="100%" EditMode="PopUp" DataKeyNames="ID" AllowMultiColumnSorting="True" >

<DetailTables>

<telerik:GridTableView DataKeyNames="ID" Name="Campaigns" Width="100%" NoDetailRecordsText="There are no campaigns for this country.">

<DetailTables>

<telerik:GridTableView CommandItemDisplay="Top" DataKeyNames="ID" AutoGenerateColumns="true" Name="Entries" NoDetailRecordsText="There are no entries for this campaign." Width="100%">

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

</telerik:GridTableView>

</DetailTables>

<Columns>

<telerik:GridBoundColumn UniqueName="CampaignName" DataField="CampaignName" SortExpression="CampaignName" HeaderText="Campaign Name" AllowSorting="true" />

<telerik:GridDateTimeColumn UniqueName="DateCreated" SortExpression="DateCreated" DataField="DateCreated" HeaderText="Date Created" DataFormatString="{0:d}" AllowSorting="true" />

<telerik:GridBoundColumn UniqueName="Entries" SortExpression="Entries" DataField="Entries" HeaderText="Entries" AllowSorting="true" />

</Columns>

</telerik:GridTableView>

</DetailTables>

<Columns>

<telerik:GridBoundColumn UniqueName="CountryName" SortExpression="CountryName" DataField="CountryName" HeaderText="CountryName" AllowSorting="true" />

</Columns>

</MasterTableView>

<ClientSettings EnableRowHoverStyle="true" />

<PagerStyle Mode="NextPrevAndNumeric" />

</telerik:RadGrid>

C# code:

protected void CampaignsRadGrid_ItemCommand(object source, GridCommandEventArgs e)

{

if (e.CommandName == Telerik.Web.UI.RadGrid.ExportToExcelCommandName)

{

ConfigureExport();

CampaignsRadGrid.MasterTableView.ExportToExcel();

}

public void ConfigureExport()

{

CampaignsRadGrid.ExportSettings.ExportOnlyData = true;

CampaignsRadGrid.ExportSettings.IgnorePaging = true;

CampaignsRadGrid.ExportSettings.OpenInNewWindow = false;

}

Any thoughts? Thanks in advance for any help...

Grid

answered on 14 Oct 2015

4 answers

255 views

Resizing RadPageView inside RadMultiPage

I have a RadMultiPage with multiple RadPageView, some of which are created dynamically. The page starts with one RadPageView and the user can add more via a button. The initial code is something like the one bellow.

<telerik:RadMultiPage ID="ContactsPagesViews" ScrollBars="Auto" Height="100%"

RenderMode="Lightweight" runat="server"

OnPageViewCreated="ContactsPagesViews_PageViewCreated"

SelectedIndex="0">

<telerik:RadPageView ID="RadPageView1" runat="server" Height="600px">

more elements here

</telerik:RadPageView>

</telerik:RadMultiPage>

I also have some code to resize my RadPageViews to fit the size of my window. For this I use the following code:

01.<telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">

02. <script type="text/javascript">

03. $(document).ready(function () {

04.

05. $(window).resize(function () {

06. ResizePage($find('<%= ContactsPagesViews.ClientID %>'))

07. });

08.

09. ResizePage($find('<%= ContactsPagesViews.ClientID %>'))

10. });

11.

12. function ResizePage(multiPage) {

13. for (i = 0; i < multiPage.get_pageViews().get_count() ; i++) {

14. var pageView = multiPage.get_pageViews().getPageView(i);

15. pageView.get_element().style.height = ($(window).height() - 80) + 'px';

16. }

17.}

18. </script>

19.</telerik:RadScriptBlock>

The Resizing is working really great but the first time the page is loaded the initial RadPageView is not resized. You can see line 9. where I'm trying to force it but it only resizes if I change the size of the window. Is there anyway for this to work?

Thank you.

General Discussions

answered on 14 Oct 2015

2 answers

103 views

Unable to Select the Text of a RadAlert

I need the ability for the user to select a portion of the text displayed in a dialog box. In the demo of Dialog boxes located here http://demos.telerik.com/aspnet-ajax/window/examples/browserdialogboxes/defaultcs.aspx when clicking on the button "radalert from server" the ability to select the text by holding down the left mouse button and dragging the cursor does work.

However, when I created a simple button which displays a RadAlert dialog it will not allow selecting of the text by clicking and dragging the cursor. It will however allow selecting the text by double clicking on a word in the text. Attached is a screen shot of what the dialog looks like when attempting to click and drag the cursor. When I copy and paste I get the following:

OK status label {1} ##LOC[OK]## {1} ##LOC[OK]## ##LOC[Cancel]## {1} ##LOC[OK]## ##LOC[Cancel]##

We are using version UI for ASP.NET AJAX Q2 2014.

General Discussions

answered on 14 Oct 2015

3 answers

340 views

Customising layout for EditForm template in RadGrid for AJAX

Hi,

I have a RadGrid (for AJAX) in my web page. I chose to use EditForm template and I wish to customise the design of the edit form. My questions are (please refer to the attached jpeg file):

1. How do I set the column/cell spacing between labels and controls (Item A in the file)?

2. How do I set the row spacing (Item B in the file)?

3. How do I change the vertical alignment of the label (Item C in the file)? In this case, I want the label to be aligned at the top, rather than middle.

4. How do I change the spacing between the last row of user control and the command button row (Item D in the file)?

My markup for the RadGrid is as below:

<telerik:RadAjaxPanel runat="server" LoadingPanelID="RadAjaxLoadingPanelMain">
<telerik:RadGrid ID="RadGridDegreeClassRules" runat="server" AllowPaging="True" AllowSorting="true" PageSize="10" Font-Names="Segoe UI"
   OnNeedDataSource="RadGridDegreeClassRules_NeedDataSource" HeaderStyle-BackColor="DarkCyan" HeaderStyle-Font-Bold="true"
   OnItemCommand="RadGridDegreeClassRules_ItemCommand" OnPreRender="RadGridDegreeClassRules_PreRender"
   AllowAutomaticInserts="false" OnInsertCommand="RadGridDegreeClassRules_InsertCommand"
   AllowAutomaticUpdates="false" OnUpdateCommand="RadGridDegreeClassRules_UpdateCommand"
   AllowAutomaticDeletes="false" OnDeleteCommand="RadGridDegreeClassRules_DeleteCommand" >
   <PagerStyle Mode="NextPrevAndNumeric" />
   <MasterTableView CommandItemDisplay="Top" AutoGenerateColumns="false" AllowSorting="true"
               CommandItemSettings-ShowAddNewRecordButton="true" CommandItemSettings-AddNewRecordImageUrl="../images/add12.png"
               CommandItemSettings-AddNewRecordText="Insert new rule"
               CommandItemSettings-RefreshImageUrl="../images/refresh14.png" DataKeyNames="Id">
       <Columns>
           <telerik:GridEditCommandColumn UniqueName="EditCommandColumnDegreeClassRules" ButtonType="ImageButton"
               EditImageUrl="../images/edit12.png" EditText="Edit rule"
               HeaderStyle-Width="30px" ItemStyle-HorizontalAlign="Center">
               <ItemStyle CssClass="MyImageButton"></ItemStyle>
           </telerik:GridEditCommandColumn>
           <telerik:GridTemplateColumn HeaderText="Effective Date" HeaderStyle-ForeColor="White" AllowSorting="true" SortExpression="EffectiveDate">
               <ItemTemplate>
                   <asp:Label ID="LabelEffectiveDate" runat="server" Text='<%# Bind("EffectiveDate","{0:dd-MM-yyyy}") %>'></asp:Label>
               </ItemTemplate>
               <InsertItemTemplate>
                   <telerik:RadDatePicker ID="DatePickerEffectiveDateInsert" runat="server" DateInput-DateFormat="dd-MM-yyyy" DateInput-DisplayDateFormat="dd-MM-yyyy" ></telerik:RadDatePicker>
                   <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidatorEffectiveDateInsert" ControlToValidate="DatePickerEffectiveDateInsert"
                       ErrorMessage="  Missing required field!" Display="Dynamic" Font-Size="Small" ForeColor="Red"></asp:RequiredFieldValidator>
               </InsertItemTemplate>
               <EditItemTemplate>
                   <telerik:RadDatePicker ID="DatePickerEffectiveDateEdit" runat="server" MinDate="1900/01/01" DbSelectedDate='<%# Bind("EffectiveDate") %>'
                       DateInput-DateFormat="dd-MM-yyyy" DateInput-DisplayDateFormat="dd-MM-yyyy"></telerik:RadDatePicker>
                   <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidatorEffectiveDateEdit" ControlToValidate="DatePickerEffectiveDateEdit"
                       ErrorMessage="  Missing required field!" Display="Dynamic" Font-Size="Small" ForeColor="Red"></asp:RequiredFieldValidator>
               </EditItemTemplate>
           </telerik:GridTemplateColumn>
           <telerik:GridTemplateColumn HeaderText="Rule Name" HeaderStyle-ForeColor="White" AllowFiltering="true" AllowSorting="true" SortExpression="DegreeClassRuleName">
               <ItemTemplate>
                   <asp:Label ID="LabelDegreeClassRuleName" runat="server" Text='<%# Bind("DegreeClassRuleName") %>'></asp:Label>
               </ItemTemplate>
               <InsertItemTemplate>
                   <telerik:RadTextBox ID="TextBoxDegreeClassRuleNameInsert" runat="server" Text="" Width="400" CssClass="EditFormButtonRow" ></telerik:RadTextBox>
               </InsertItemTemplate>
               <EditItemTemplate>
                   <telerik:RadTextBox ID="TextBoxDegreeClassRuleNameEdit" runat="server" Text='<%# Bind("DegreeClassRuleName") %>' Width="400" CssClass="EditFormButtonRow" ></telerik:RadTextBox>
               </EditItemTemplate>
           </telerik:GridTemplateColumn>
           <telerik:GridTemplateColumn HeaderText="Rules" HeaderStyle-ForeColor="White" AllowFiltering="true" AllowSorting="true" SortExpression="DegreeClassRule">
               <ItemTemplate>
                   <asp:Label ID="LabelDegreeClassRules" runat="server" Text='<%# Bind("DegreeClassRule") %>'></asp:Label>
               </ItemTemplate>
               <InsertItemTemplate>
                   <telerik:RadEditor ID="EditorDegreeClassRuleInsert" runat="server" >
                       <Tools>
                           <telerik:EditorToolGroup>
                               <telerik:EditorTool Name="Copy" />
                               <telerik:EditorTool Name="Cut" />
                               <telerik:EditorTool Name="Paste" />
                               <telerik:EditorTool Name="Undo" />
                               <telerik:EditorTool Name="Redo" />
                               <telerik:EditorTool Name="FontName" />
                               <telerik:EditorTool Name="FontSize" />
                               <telerik:EditorTool Name="ForeColor" />
                               <telerik:EditorTool Name="Bold" />
                               <telerik:EditorTool Name="Italic" />
                               <telerik:EditorTool Name="Underline" />
                               <telerik:EditorTool Name="InsertUnorderedList" />
                               <telerik:EditorTool Name="InsertOrderedList" />
                               <telerik:EditorTool Name="Indent" />
                               <telerik:EditorTool Name="Outdent" />
                               <telerik:EditorTool Name="InsertSymbol" />
                               <telerik:EditorTool Name="InsertLink" />
                           </telerik:EditorToolGroup>
                       </Tools>
                   </telerik:RadEditor>
               </InsertItemTemplate>
               <EditItemTemplate>
                   <telerik:RadEditor ID="EditorDegreeClassRuleEdit" runat="server" content='<%# Bind("DegreeClassRule") %>' >
                       <Tools>
                           <telerik:EditorToolGroup>
                               <telerik:EditorTool Name="Copy" />
                               <telerik:EditorTool Name="Cut" />
                               <telerik:EditorTool Name="Paste" />
                               <telerik:EditorTool Name="Undo" />
                               <telerik:EditorTool Name="Redo" />
                               <telerik:EditorTool Name="FontName" />
                               <telerik:EditorTool Name="FontSize" />
                               <telerik:EditorTool Name="ForeColor" />
                               <telerik:EditorTool Name="Bold" />
                               <telerik:EditorTool Name="Italic" />
                               <telerik:EditorTool Name="Underline" />
                               <telerik:EditorTool Name="InsertUnorderedList" />
                               <telerik:EditorTool Name="InsertOrderedList" />
                               <telerik:EditorTool Name="Indent" />
                               <telerik:EditorTool Name="Outdent" />
                               <telerik:EditorTool Name="InsertSymbol" />
                               <telerik:EditorTool Name="InsertLink" />
                           </telerik:EditorToolGroup>
                       </Tools>
                   </telerik:RadEditor>
               </EditItemTemplate>
           </telerik:GridTemplateColumn>
           <telerik:GridButtonColumn CommandName="Delete" UniqueName="DeleteColumnDegreeClassRules"
               Text="Delete rule" ConfirmText="Delete this rule?" ConfirmTitle="Delete" ConfirmDialogType="RadWindow"
               HeaderStyle-Width="30px" ItemStyle-HorizontalAlign="Center"
               ButtonType="ImageButton" ImageUrl="../images/delete12.png" DataType="System.Boolean">
               <ItemStyle CssClass="MyImageButton"></ItemStyle>
           </telerik:GridButtonColumn>
       </Columns>
       <EditFormSettings ColumnNumber="1" CaptionDataField="DegreeClassRuleName" CaptionFormatString="Edit properties of rule: {0}">
           <FormStyle Width="100%" BackColor="Ivory"></FormStyle>
           <FormTableItemStyle Wrap="False"></FormTableItemStyle>
           <EditColumn UniqueName="EditColumnDegreeClassRule" ButtonType="PushButton"
               InsertText="Insert" UpdateText="Update" CancelText="Cancel" ></EditColumn>
           <FormTableButtonRowStyle HorizontalAlign="Right" ></FormTableButtonRowStyle>
       </EditFormSettings>
   </MasterTableView>
   <ClientSettings>
       <ClientEvents OnRowDblClick="rowDblClick" />
   </ClientSettings>
</telerik:RadGrid>

Thank you. Appreciate your reply.

Zaly

Grid

answered on 14 Oct 2015