Telerik Forums
UI for ASP.NET AJAX Forum
3 answers
99 views
Hello,

Can I change the radgrid design in order to display the editform above the columns names (Plaese view the attached image)?
Here is my code:
<telerik:RadGrid ID="TasksRadGrid" runat="server" PageSize="20" AllowFilteringByColumn="false" ValidationGroup="NewTaskValidationGroup"
                        GridLines="None" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" Width="700px"
                        ShowStatusBar="true" OnPreRender="TasksRadGrid_PreRender" OnNeedDataSource="TasksRadGrid_NeedDataSource" OnUpdateCommand="TasksRadGrid_UpdateCommand" OnInsertCommand="TasksRadGrid_InsertCommand" OnDeleteCommand="TasksRadGrid_DeleteCommand">
                        <MasterTableView GridLines="None" Width="700px" CommandItemDisplay="Top" DataKeyNames="TID">
                            <CommandItemSettings AddNewRecordText="<%$ Resources:GeneralTelerikResource, TelerikRadGridAddNewRecordText %>"
                                                    RefreshText="<%$ Resources:GeneralTelerikResource, TelerikRadGridRefreshText %>" />
                            <Columns>
                                <telerik:GridEditCommandColumn UniqueName="EditCommandColumn1"  ItemStyle-VerticalAlign="Top" EditText="<%$ Resources:GeneralTelerikResource, TelerikRadGridEditColumnText %>">
                                </telerik:GridEditCommandColumn>
                                <telerik:GridTemplateColumn UniqueName="Status"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="10%" HeaderStyle-Width="10%" HeaderText="Status" DataField="Status">
                                   <ItemTemplate>
                                       <asp:Image ID="StatusImage" ImageUrl="~/Common/Design/Imgs/Tasks/Statuses/New.png" ToolTip="New" Width="20px" Height="20px" runat="server" />
                                   </ItemTemplate>
                                </telerik:GridTemplateColumn>
                                <telerik:GridBoundColumn UniqueName="Priority"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="10%" HeaderStyle-Width="10%" HeaderText="Priority" DataField="Priority">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="Title"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="35%" HeaderStyle-Width="35%" HeaderText="Title" DataField="Title">
                                </telerik:GridBoundColumn>
                                <telerik:GridBoundColumn UniqueName="Comment"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="30%" HeaderStyle-Width="30%" HeaderText="Comment" DataField="Comment">
                                </telerik:GridBoundColumn>
                                 
                                <telerik:GridDateTimeColumn UniqueName="EndDate"  ItemStyle-VerticalAlign="Top" ItemStyle-Width="15%" HeaderStyle-Width="15%" HeaderText="EndDate" DataField="EndDate">
                                </telerik:GridDateTimeColumn>
                                 <telerik:GridButtonColumn ConfirmText="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnConfirmText %>"  ItemStyle-VerticalAlign="Top" ConfirmDialogType="RadWindow"
                                    ConfirmTitle="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnConfirmTitle %>" ButtonType="ImageButton" CommandName="Delete" Text="<%$ Resources:GeneralTelerikResource, TelerikRadGridDeleteColumnText %>"
                                    UniqueName="DeleteColumn">
                                    <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
                                </telerik:GridButtonColumn>
                            </Columns>
                            <EditFormSettings UserControlName="~/OU/Tasks/c/CreateTask/SubUserControl.ascx" EditFormType="WebUserControl">
                                <EditColumn UniqueName="EditCommandColumn1">
                                </EditColumn>
                            </EditFormSettings>
                        </MasterTableView>
                    </telerik:RadGrid>

Please, I need your help,
It is appreciated to send me the modified code.

Regards,
Bader 
Eyup
Telerik team
 answered on 16 Oct 2019
1 answer
85 views

Is it possible to have two sliders that adjust each other's values automatically client-side?

So both sliders have values 0 - 100 and if slider 1's value is adjusted to 60 then slider's value automatically becomes 40 (i.e. slider 2 value = 100 - slider 1 value and slider 1 value = 100 - slider 2 value)

Eyup
Telerik team
 answered on 16 Oct 2019
1 answer
166 views

I have a Radgrid that when the EditCommandColumn button is clicked I load a WebUserControl.

                                                                       <EditFormSettings  UserControlName="BudgetItemControl.ascx" EditFormType="WebUserControl">
                                                                            <EditColumn UniqueName="EditCommandColumn1">
                                                                            </EditColumn>
                                                                            <PopUpSettings Modal="false" />
                                                                        </EditFormSettings>

 

On the WebUserControlI have the following bound field...

                            <telerik:RadNumericTextBox ID="txtQty" runat="server"  Text='<%# DataBinder.Eval(Container, "DataItem.Qty") %>' DisabledStyle-                 

                                BackColor="Transparent" 
                                EmptyMessage="Enter qty" Enabled="true" Font-Names="Arial" Font-Size="Small" ForeColor="#666699" MinValue="0"

                                RenderMode="Lightweight" 
                                Skin="Silk" TabIndex="7" Type="Number" Value="0" Width="190px" Visible="true"
                                onkeyup="javascript: onChange();" onkeypress="return isFloatNumber(this,event);" >

On the form with the grid I have the javascript OnChange() event

when I try to get_value

var txt=$find("<%= RadGrid1.ClientID%>").get_masterTableView().get_dataItems()[1].findControl("txtqty")

I receive the following error: Cannot read property 'findControl' of undefined.

I can get the value when using an asp control.

var txt1 = document.getElementById("TextBox2").value; (THIS WORKS)

How can I get the RadNumericTextBox value?

 

 

 

 

 

Eyup
Telerik team
 answered on 16 Oct 2019
25 answers
2.4K+ views
Hi,
I am using a Radgrid which allows the columns to be sorted and a sort icon is displayed when a column is sorted. If the same column is clicked to sort continuously for 3 times, the sort icon is not being shown the third time. Also the fourth time I click the same column, there is no change in the sorting order. Is there a third state other than asc and desc?  The demos in telerik site also displays the same behaviour.
Given below is the code snippet for SortCommand handler:

Select

 

Case e.OldSortOrder

 

 

Case GridSortOrder.None, GridSortOrder.Descending

 

BindResults(pindex,

e.CommandArgument & " asc")

 

 

Exit Select

 

 

Case GridSortOrder.Ascending

 

BindResults(pindex,

e.CommandArgument & " desc")

 

 

Exit Select

 

 
Any help in this regard is greatly appreciated.

Thanks
PMR.
Eyup
Telerik team
 answered on 16 Oct 2019
1 answer
120 views

 we have a one column grid of GridButtonColumn and when the user arrows to a row we need the user to "click" the button with a keyboard. A "return" and a spacebar does not work?

  <telerik:RadGrid ID="RadGrid2" runat="server" HorizontalAlign="Center"
                    DataSourceID="SqlDataSource2" OnItemCommand="RadGrid2_ItemCommand"
                    PageSize="30" Width="99%" CellSpacing="0" Skin="Bootstrap" AllowAutomaticUpdates="false" AllowAutomaticInserts="false"
                    EnableAriaSupport="true">
                    <ClientSettings EnableRowHoverStyle="True" AllowKeyboardNavigation="true" KeyboardNavigationSettings-FocusKey="Z" KeyboardNavigationSettings-AllowSubmitOnEnter="true">
                        <Selecting AllowRowSelect="True" />
                    </ClientSettings>
                    <MasterTableView CommandItemDisplay="None" Width="100%" AutoGenerateColumns="False" DataSourceID="SqlDataSource2">
                        <Columns>
                            <telerik:GridButtonColumn ButtonType="LinkButton" DataTextField="ProgramName" CommandName="SelectProgram" HeaderText="Program Name (Click to Select)" ></telerik:GridButtonColumn>
                            <telerik:GridBoundColumn DataField="ProgramCode" FilterControlAltText="Filter ProgramCode column" HeaderText="ProgramCode" SortExpression="ProgramCode" UniqueName="ProgramCode" Display="false">
                            </telerik:GridBoundColumn>
                        </Columns>
                        <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
                        <RowIndicatorColumn>
                            <HeaderStyle Width="20px" />
                        </RowIndicatorColumn>
                        <ExpandCollapseColumn>
                            <HeaderStyle Width="20px" />
                        </ExpandCollapseColumn>
                    </MasterTableView>
                    <PagerStyle PageSizeControlType="RadComboBox"></PagerStyle>
                    <FilterMenu EnableImageSprites="False"></FilterMenu>
                    <HeaderContextMenu></HeaderContextMenu>
                </telerik:RadGrid>

Attila Antal
Telerik team
 answered on 15 Oct 2019
1 answer
206 views

I have a Radspreadsheet with 13 columns. I need to create a datatable with the grid content and send it to a stored procedure. When I paste 8000+ rows in the grid everything works fine on local host, but it doesn't seem to be able to create the datatable when I deploy on the server. Could it be that the data size is too big to be sent to the server? Is there anyway to overcome this problem?

I have two javascript methods: one to automatically save the grid content after pasting data in the grid, and one to format grid content as text. 

Here are the two JS methods:

        function OnClientChange(sender, eventArgs) {
            //call save automatically when posting any data in the grid
            var sheet = $find('<%=RadSpreadsheet1.ClientID%>');
            sheet.save();
        }

        function onclientpaste(sender, args) {

             //format data as text
            var clipboardData = args.get_clipboardContent().data;
            for (var i = 0; i < clipboardData.length; i++) {
                for (var j = 0; j < clipboardData[i].length; j++) {
                    var cellData = clipboardData[i][j];
                    cellData.format = "@"
                }
            }
        }

Here is the Radspreadsheet code:

<telerik:RadSpreadsheet runat="server" ID="RadSpreadsheet1" OnClientChange="OnClientChange" onclientpaste="onclientpaste">

Peter Milchev
Telerik team
 answered on 15 Oct 2019
1 answer
168 views

I would like to pass the status of the RadToggleButton to a SQL Datasource on the page to trigger whether it should values or not.  Running into an error 

Could not find control '_btnHideShow' in ControlParameter 'DisplayCompleted'.

DisplayCompleted is the SQL Parameter that will be passed in.  I want to pass in either the 0 or 1 from the RadButtonToggleState.  

<MasterTableView AutoGenerateColumns="false" TableLayout="Fixed" HierarchyDefaultExpanded="true" AlternatingItemStyle-BackColor="LightBlue" CommandItemDisplay="Top">
                    <CommandItemTemplate>
                        <telerik:RadButton RenderMode="Lightweight" ID="_btnHideShow" runat="server" ButtonType="StandardButton"
                            ToggleType="CustomToggle" AutoPostBack="false" Skin="Metro">
                            <ToggleStates>
                                <telerik:RadButtonToggleState SecondaryIconCssClass="rbOk" Text="Show Closed Applications" Value="1"></telerik:RadButtonToggleState>
                                <telerik:RadButtonToggleState SecondaryIconCssClass="rbCancel" Text="Hide Closed Applictaions" Value="0"></telerik:RadButtonToggleState>
                            </ToggleStates>
                        </telerik:RadButton>
                    </CommandItemTemplate>
.....
    <asp:SqlDataSource ID="GetApplications" runat="server"
        ConnectionString="<%$ ConnectionStrings:PHConn %>"
        SelectCommand="Application.sp_seManageApplications" SelectCommandType="StoredProcedure" CancelSelectOnNullParameter="true">
        <SelectParameters>
            <asp:ControlParameter ControlID="_btnHideShow" PropertyName="Value" Name="DisplayCompleted" Type="Int32" DefaultValue="0" ConvertEmptyStringToNull="true" />
        </SelectParameters>
    </asp:SqlDataSource>
Vessy
Telerik team
 answered on 15 Oct 2019
1 answer
121 views

Hi,

I have a RadMenu, and I need to show the AjaxLoadingPanel only on some items.
Deal with this approach without luck.

https://docs.telerik.com/devtools/aspnet-ajax/controls/ajaxloadingpanel/how-to/show-and-hide-ajaxloadingpanel-explicitly

any suggestions?

Eyup
Telerik team
 answered on 14 Oct 2019
1 answer
137 views

I have a RadListView similar to

<telerik:RadListView ID="RadListView1" runat="server" >
    <ItemTemplate>
        <asp:HiddenField ID="HiddenField1" runat="server" Value='<%#Eval("HiddenValue") %>' />
        <telerik:RadNumericTextBox ID="RadTextBox1" runat="server" ClientEvents-OnValueChanged="onValueChanged" DbValue='<%#Eval("Hours") %>' />
    </ItemTemplate>
</telerik:RadListView>

 

This data is bound server-side from another control.  There may be hundreds of lines with unique values.  When the text is changed in the RadNumericTextBox I wish to manipulate the data using the value in HiddenField1 in the onValueChanged function.

 

For example, when typing "5" into the RadTextBox1, onValueChanged will fire, and I would like to discover the value of HiddenField1 in this function.  I cannot seem to pin down how to access data in the specific row that I am accessing.

 

 

Eyup
Telerik team
 answered on 14 Oct 2019
12 answers
961 views
http://demos.telerik.com/aspnet-ajax/notification/examples/sessiontimeout/defaultcs.aspx

The demo at this URL is horribly confusing with unclear references to "UI counters" and a different demo than the "recommended" setup. Please cleanup this demo so it accurately portrays the application scenario!


For my project, I'm trying to implement a session timeout popup without using a postback. I've added RadNotification tag to the aspx page, assigned ShowInterval and Value properties on the RadNotification from code behind, and now I'm stuck trying to get the javascript to work for the countdown and redirect. I want the notification popup to countdown from 60 and then redirect to another page, however I can not figure out the javascript piece from the demo. Am I correct in assuming I only need the UpdateTimeLabel() and ContinueSession() functions? How do i wire these up so they start firing when the notification is displayed? Is the pageLoad() javascript function needed for this scenario (unclear from the demo)?

Here is my tag in aspx:
<telerik:RadNotification ID="RadNotification1" runat="server" Position="Center" Width="240"
                            Height="100" OnCallbackUpdate="OnCallbackUpdate" LoadContentOn="PageLoad" AutoCloseDelay="60000"
                            Title="Continue Your Session" TitleIcon="" Skin="Office2007" EnableRoundedCorners="true"
                            ShowCloseButton="false" KeepOnMouseOver="false">
                            <ContentTemplate>
                                <div class="infoIcon">
                                    <img src="images/infoIcon.jpg" alt="info icon" />
                                </div>
                                <div class="notificationContent">
                                    Time remaining:  <span id="timeLbl">60</span>
                                    <telerik:RadButton Skin="Office2007" ID="continueSession" runat="server" Text="Continue Your Session"
                                        Style="margin-top: 10px;" AutoPostBack="false" OnClientClicked="ContinueSession">
                                    </telerik:RadButton>
                                </div>
                            </ContentTemplate>
                        </telerik:RadNotification>

Code behind:
if (!IsPostBack)
            {
                //set the expire timeout for the session
                Session.Timeout = 2;
                //configure the notification to automatically show 1 min before session expiration
                RadNotification1.ShowInterval = (Session.Timeout - 1) * 60000;
                //set the redirect url as a value for an easier and faster extraction in on the client
                RadNotification1.Value = Page.ResolveClientUrl("default.aspx");
            }

And javascript (using a <script> tag directly under <body> tag):
function UpdateTimeLabel(toReset) {
            var sessionExpired = (seconds == 0);
            if (sessionExpired) {
                //stopTimer("timeLeftCounter");
                //redirect to session expired page - simply take the url which RadNotification sent from the server to the client as value
                window.location.href = $find("<%= RadNotification1.ClientID %>").get_value();
            }
            else {
                var timeLbl = $get("timeLbl");
                timeLbl.innerHTML = seconds--;
            }
        }
 
        function ContinueSession() {
            var notification = $find("<%= RadNotification1.ClientID %>");
            //we need to contact the server to restart the Session - the fastest way is via callback
            //calling update() automatically performs the callback, no need for any additional code or control
            notification.update();
            notification.hide();
 
            //resets the showInterval for the scenario where the Notification is not disposed (e.g. an AJAX request is made)
            //You need to inject a call to the ContinueSession() function from the code behind in such a request
            var showIntervalStorage = notification.get_showInterval(); //store the original value
            notification.set_showInterval(0); //change the timer to avoid untimely showing, 0 disables automatic showing
            notification.set_showInterval(showIntervalStorage); //sets back the original interval which will start counting from its full value again
 
            //stopTimer("timeLeftCounter");
            //seconds = 60;
            //updateMainLabel(true);
        }
Eyup
Telerik team
 answered on 14 Oct 2019
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?