Questions on UI for ASP.NET AJAX Forum

2 answers

149 views

[Solved] scroll to #anchor on ItemCommand

I have a RadGrid with a GridButtonColumn column that, when clicked, makes visible and populates some information in a panel below the grid.

<telerik:RadGrid runat="server" ID="RadGridDocuments" ItemStyle-VerticalAlign="Top" AllowPaging="False" AllowSorting="True" ShowGroupPanel="True">

<%-- etc... --%>

<telerik:GridButtonColumn CommandName="viewHistory" Text="View History"

UniqueName="viewHistory">

</telerik:GridButtonColumn>

<%-- etc... --%>

</ telerik:RadGrid >

<telerik:RadAjaxPanel ID="pnlViewHistory" runat="server" Visible="false" Height="200px" Width="300px">

<a href="#anchor"> </a>

<%-- other stuff --%>

</telerik:RadAjaxPanel>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGridDocuments">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGridDocuments" />

<telerik:AjaxUpdatedControl ControlID="pnlViewHistory" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManagerProxy>

And the code behind

Private Sub RadGridDocuments_ItemCommand(sender As Object, e As GridCommandEventArgs) Handles RadGridDocuments.ItemCommand

Select Case e.CommandName

Case "viewHistory"

showHistory(e)

Case

'more commands follow

End Select

End Sub

What I would like to do is also, when this GridButtonColumn is clicked also scroll down to the panel or anchor and bring it in to view. I have no idea how to do this in ItemCommand, can anyone help?

Grid

answered on 29 Jul 2014

3 answers

296 views

[Solved] Javascript on itemtemplate button click doesnt allow passing of parameters

Hi Guys,

I have a radgrid which uses an item template, within the item template i have a button and a div. On button click i would like to show / hide the div using javascript.
the javascript works fine when im hardcoding the div ID which i want to hide, but as soon as i pass a parameter to the javascript it no longer works.

my end goal is to hide the div in a specific row within the radgrid, because at the moment no matter which button in a row i click on only the first div gets shown/hidden.

If you have another method of getting this to work please let me know. but for now this is the code i have.

<telerik:RadGrid ID="lvSubSections" runat="server" GridLines="None"

Width="100%" AllowPaging="false" CellSpacing="0" Visible="false"

onneeddatasource="lvSubSections_NeedDataSource"

onprerender="lvSubSections_PreRender"

onitemcommand="lvSubSections_ItemCommand"

EnableViewState="true" >

<MasterTableView AutoGenerateColumns="false" DataKeyNames="SubSectionID" ClientDataKeyNames="SubSectionID" >

<Columns>

<telerik:GridBoundColumn DataField="SubSectionID" HeaderText="SubSectionID" ItemStyle-Font-Names="Calibri" Resizable="False" UniqueName="Status" ReadOnly="True" Reorderable="False" ShowSortIcon="False" Visible="false">

<HeaderStyle HorizontalAlign="Left" Width="3%" Height="100px" Wrap="True" />

<ItemStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn DataField="SubSectionID" >

<HeaderStyle Height="0px" />

<ItemTemplate>

<table width="100%">

<tr>

<td style="border:none;font-size:1.2em;font-weight:bold;" >

<asp:Label ID="grdLblSubSectionName" runat="server" Text='<%# Eval("subSectionName") %>' />

</td>

<td style="border:none;" align="right">

<asp:Label ID="grdLblIsComplete" runat="server" Text='<%# Eval("IsComplete") %>' />

</td>

</tr>

<tr>

<td style="border:none;" align="Left">

<div class="onoffswitch">

<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked>

<label class="onoffswitch-label" for="myonoffswitch">

<span class="onoffswitch-inner"></span>

<span class="onoffswitch-switch"></span>

</label>

</div>

</td>

<td style="border:none;padding:" align="right">

<telerik:RadButton id="grdBtnComments" runat="server" Text="C" ToolTip="Comments" OnClientClicked='HideShowComments("<%# Eval("subSectionID") %>")' />

<telerik:RadButton id="grdBtnQuestions" runat="server" Text="Q" ToolTip="Questions" CommandName="SubSectionQuestions" />

</td>

</tr>

<tr>

<td colspan="2" style="border:none;">

<div id='<%# Eval("subSectionID") %>' style="display:none;">

<telerik:RadTextBox ID="grdTbComments" Width="100%" Height="50px" runat="server" TextMode="MultiLine" Text='<%# Eval("subSectionComments") %>' ></telerik:RadTextBox>

<telerik:RadButton id="grdBtnSaveComments" runat="server" Text="Save" ToolTip="Comments" />

</div>

</td>

</tr>

</table>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

and this is the javascript i am currently using

function HideShowComments(ID) {

var id = document.getElementById(ID);

if (id.style.display == "none") {

id.style.display = "table-row";

}

else {

id.style.display = "none";

}

Thanks in advance

Grid

answered on 29 Jul 2014

4 answers

152 views

Need Help Clearing Media Sources

Greetings all,

When using the RadMediaPlayer control in my web application, I am having trouble clearing the multimedia sources that have already been loaded into the control. The user has the option of adding a new link and corresponding description which are saved in a SQL Server table of video records. This list is loaded into a dropdown box for selection. When a video is chosen, I am setting the source property as follows, based on the link retrieved from the database:

MMOMediaPlayer.Source = <link from db>

This works fine and the video plays as expected. However, I want to give the user the ability to clear the control of any video content and reset it to its original state when the page first loaded. I have a button that performs this function, with server-side code as follows:

MMOMediaPlayer.Sources.Clear()

However, after this code executes, the most recently viewed video is still present in the viewer, and begins to play from the last position (time) within the clip. I've also tried using MMOMediaPlayer.Sources.RemoveAt(0), but this also seems to have no effect.

Any help would be appreciated.

MediaPlayer

answered on 29 Jul 2014

3 answers

209 views

Multi Select Combo box

Hi,

I have requirement using multi select combo box. Please see the scenarios below.

1. We have two combo box
    a. Combo box 1: Frequency(Values will be Monthly, Quarterly, Half-yearly, Annual)
    b. Combo box 2: Months(Jan, Feb... Dec)
Scenario 1:
When we select Monthly in Frequency Combo box , all the months should be selected in the Months combo box, user cannot change the Months Combo box

Scenario 2:
When we select Half-yearly in Frequency Combo box, Only 2 months has to be selected in a year, with interval of 6 months. For Eg( If user selects Jan automatically July should be selected and all the other values in the month combo box should disabled)

Scenario 3:
When we select Quarterly in Frequency Combo box, Only 4 months has to be selected in a year, with interval of 3 months. For Eg( If user selects Jan automatically Apr, Jul, Oct should be selected and all the other values in the month combo box should disabled)

Scenario 4:
When we select Annual in Frequency Combo box, Only 1 months has to be selected in a year. For Eg( If user selects Jan all the other values in the month combo box should disabled)

Can we do this in telerik, if possible can you pls help to do it

Thanks,
Arumugam

ComboBox

answered on 29 Jul 2014

1 answer

225 views

Tab Strip with menu option

Need help how to use tab strip with 2 different pages
For example :
I need 2 tab on one page
-------------------------------------
First Tab | Second Tab
-------------------------------------

On First Tab below menu will display
---------------------------------------------------------------------------------------------------------------
Menu1 | Menu 2 | Menu3 | Menu 4 | Menu 5
---------------------------------------------------------------------------------------------------------------

On Second Tab
---------------------------------------------------------------------------------------------------------------
Menu x | Menu Y | Meny Z
---------------------------------------------------------------------------------------------------------------

on tab click chagne tab and dispaly respective menu on screen. If user select Menu 1 then selected page will open inside tab

TabStrip

answered on 29 Jul 2014

1 answer

116 views

How to view image before save

It should a standard scenario but I could not find (or missed?) it neither in demos nor documentation.
Assume that there is a record edit form and one of the fields is displayed as an image. There is radAsyncUpload next to it. The task is to show a new image when it is uploaded before saving the record in db.
How to do it?

Upload (Obsolete)

answered on 29 Jul 2014

15 answers

581 views

[Solved] RadGrid Filter

Hi,

I have a radGrid on my aspx page, where filters on columns should have default function as "Contains". I am able to do this in grid's itemdatabound event. when the user searches from filter box it should check for "Contains", but he can use other filter functions like "starts with" and "ends with' by clicking on filter icon. But after typing search value, he chooses say for ex. "Ends with" from filter menu, the results should be bound with items matching "ends with" search text. Soon after the results are bound, filter function should change to "Contains". Help me with this

Thanks,
Farjana

Grid

answered on 29 Jul 2014

6 answers

541 views

[Solved] Rad Panelbar & Item Click

I have a rad panel bar.
In its item click i want the selected value.

I'm binding the panel bar using:

    
            RadPanelBar_MenuLeft.DataSource = _dtFunctions;  
        
                        RadPanelBar_MenuLeft.DataFieldID = "FunctionID";  
        
                        RadPanelBar_MenuLeft.DataTextField = "FunctionName";  
        
                        RadPanelBar_MenuLeft.DataValueField = "FunctionID";  
        
                        RadPanelBar_MenuLeft.DataNavigateUrlField = "PageName";  
        
                        RadPanelBar_MenuLeft.DataBind();

    
            private void RadPanelBar_MenuLeft_ItemClick(object sender, Telerik.Web.UI.RadPanelBarEventArgs e)  
        
                {  
        
                    if (e.Item.Items.Count > 0)  
        
                    {  
        
                        if (e.Item.Expanded == false)  
        
                        {  
        
                            _Val = "Collapsed panel item - " + e.Item.Value;  
        
                        }  
        
                       else  
        
                        {  
        
                            _Val = "Expanded panel item - " + e.Item.Value;  
        
                        }  
        
                    }  
        
                    else  
        
                    {  
        
                         _Val = "Clicked panel item - " + e.Item.Value;  
        
                   }  
        
                } 
        
            The Panel item click will work if the DataNavigateUrlField is not given. 
        
            How to get the selected items value even if the DataNavigateUrlField is given. 
        
            Plz help

and on init

    
            this.RadPanelBar_MenuLeft.ItemClick += new Telerik.Web.UI.RadPanelBarEventHandler(this.RadPanelBar_MenuLeft_ItemClick);

PanelBar

answered on 29 Jul 2014

3 answers

186 views

Radgrid sorting not working when dynamically loading it inside a usercontrol.

I have a grid named

 gvTabList which in inside the usercontrol . I load
this usercontrol at runtime from Default.aspx when an image button is clicked. 




<telerik:RadAjaxManager ID="radAjaxManagerTab" runat="server">
                               <AjaxSettings>
                                   <telerik:AjaxSetting AjaxControlID="gvTabList">
                                       <UpdatedControls>
                                           <telerik:AjaxUpdatedControl ControlID="gvTabList" LoadingPanelID="ajaxLoadingPanel"  />
                                                                             
                                       </UpdatedControls>
                                   </telerik:AjaxSetting>
                               </AjaxSettings>
                           </telerik:RadAjaxManager>
                            <telerik:RadAjaxLoadingPanel ID="ajaxLoadingPanel" runat="server" IsSticky="true"
                       Skin="Default" Style="position: absolute; z-index: 101; top: 0; left: 0;">
                       <img alt="Loading" src="../Images/Loading.gif" />
                   </telerik:RadAjaxLoadingPanel>
                           <telerik:RadGrid ID="gvTabList" runat="server" Skin="WebBlue" AllowFilteringByColumn="True"
                               AllowPaging="True" PageSize="5" AllowSorting="True"
                                OnNeedDataSource="gvTabList_NeedDataSource"
                                OnInit="gvTabList_Init"
                                AutoGenerateColumns="False" GridLines="None" OnSortCommand="gvTabList_SortCommand" EnableAJAX="True" >                              
                               <GroupingSettings CaseSensitive="false" />
                               <MasterTableView AllowFilteringByColumn="true" AllowMultiColumnSorting="false" AllowCustomSorting="true">
                                   <RowIndicatorColumn Visible="False">
                                       <HeaderStyle Width="20px"></HeaderStyle>
                                   </RowIndicatorColumn>
                                   <ExpandCollapseColumn Visible="False">
                                       <HeaderStyle Width="19px"></HeaderStyle>
                                   </ExpandCollapseColumn>
                                   <CommandItemSettings ExportToPdfText="Export to Pdf" />
                                   <Columns>
                                       <telerik:GridBoundColumn AllowFiltering="False" DataField="ID" HeaderText="HEDIS #"
                                           UniqueName="HedisID">
                                           <HeaderStyle HorizontalAlign="Center" Width="140" />
                                           <ItemStyle HorizontalAlign="Center" />
                                       </telerik:GridBoundColumn>
                                       <telerik:GridBoundColumn AllowFiltering="False" DataField="HedisSubMeasure" HeaderText="HEDIS Domain"
                                           UniqueName="HedisDomain">
                                           <HeaderStyle HorizontalAlign="Center" Width="150" />
                                           <ItemStyle HorizontalAlign="Center" />
                                       </telerik:GridBoundColumn>
                                          
                                   </Columns>
                               </MasterTableView>
                                <PagerStyle Mode="NumericPages" />
                           </telerik:RadGrid>





I need to display this control when the user clicks the image button that is why I have kept it inside btnLoadControl_Click event. But there are so many forums saying controls have to be loaded either during Page_Load or Init method. I am not sure how to do that.




protected void btnLoadControl_Click(object sender, ImageClickEventArgs e)
       {
             UserControl control = (UserControl)LoadControl("~/Controls/" + Usercontrolname + ".ascx");
 
       }





There is no problem loading the usercontrol when the condition
is met. But the problem is when I click the heading of any column, the sortorder
does not change. I have my funtion to handle the CustomSorting which is given
below.




protected void gvTabList_SortCommand(object source, GridSortCommandEventArgs e)
       {           
            GridSortExpression sortExpr = new GridSortExpression();           
           switch (e.OldSortOrder)            
           {
               case GridSortOrder.None:
                   sortExpr.FieldName = e.SortExpression;
                   sortExpr.SortOrder = GridSortOrder.Descending;
                   e.Item.OwnerTableView.SortExpressions.AddSortExpression(sortExpr);                    
                   break;
               case GridSortOrder.Ascending:
                   sortExpr.FieldName = "ID";
                   sortExpr.SortOrder = GridSortOrder.Ascending;
                   e.Item.OwnerTableView.SortExpressions.AddSortExpression(sortExpr);
                     
                   break;
               case GridSortOrder.Descending:
                   sortExpr.FieldName = e.SortExpression;
                   sortExpr.SortOrder = GridSortOrder.Ascending;
                   e.Item.OwnerTableView.SortExpressions.AddSortExpression(sortExpr);
                    
                   break;
           }
           e.Canceled = true;     
           gvTabList.Rebind();
  
       }



I checked by debugging, but " e.OldSortOrder" always gives "None" type.

Is this problem related with dynamically loading the usercontrol . As you
can see I need this usercontrol only when the Image button is clicked. so I am not loading it in Init method. 

If any one has faced this
problem, please send me the solution. It will be a great help.

Grid

answered on 28 Jul 2014

2 answers

140 views

Problem EditForm Template- Edit and New Record

I have a problem with RadGrid, when I edit a record in the grid, this is dropped records showing others wrong.
The same behavior to Add Record

sending two attachments with pictures.
sending an attachment with the grid code

Telerik Versión: 2013.3.1015.45

Grid

answered on 28 Jul 2014