Questions on UI for ASP.NET AJAX Forum

2 answers

71 views

Allow Splitter to behave like CollapsiblePanel

Good afternoon,

I'm looking to replace a CollapsiblePanelExtender with a Telerik control. The closest to this seems to be a RadSplitter.

How can I make a horizontal RadSplitter, which contains two panes, change its height to keep one pane at the top as a constant, but expand and collapse with a second pane. I'm using a button in the top pane to control the second pane, rather than a RadSplitterBar.

<telerik:RadSplitter RenderMode="Lightweight" ID="RadSplitter1" runat="server" Width="900px" Orientation="Horizontal">
    <telerik:RadPane ID="RadPane1" runat="server" Height="30px" CssClass="collapsePanelHeader">
        <div style="padding:5px; padding-left:20px; cursor:pointer; vertical-align:middle;" onclick="ToggleCollapsePane()">
            <div style="float:left;">
                <asp:Label ID="lblOptionsHdr" runat="server" Text="Filter Options" Font-Bold="True" />
                </div>
        </div>
    </telerik:RadPane>
    <telerik:RadPane ID="RadPane2" runat="server" Height="270px" CssClass="collapsePanelContent">
        <div id="divContent" style="padding:20px; vertical-align:middle;">
            <table style="vertical-align:top; width:100%; border-spacing:5px; padding:5px;">
                <tr>
                    <td>
......... several filter options (dropdown lists, radiobuttons)
                    </td>
                </tr>
            </table>
        </div>
    </telerik:RadPane>
</telerik:RadSplitter>

When the <div> in pane 1 is clicked it should toggle pane 2, and the splitter adjust its height accordingly:

        function ToggleCollapsePane() {
            var splitter = $find("<%= RadSplitter1.ClientID %>");
            var pane = splitter.getPaneById("<%= RadPane2.ClientID %>");

            if (pane.get_collapsed()) {
                pane.expand();
                splitter.resize(900, 303);
            } else {
                pane.collapse();
                splitter.resize(900, 33);
            }
        }

Is what I'm trying to achievable? Or is there another Telerik control that does this?

Kind regards,

Richard

Splitter

answered on 18 Dec 2024

2 answers

257 views

Assistance Required for Telerik.Web.UI Version Upgrade Issue

Dear Progress Team,

We are currently facing an issue with upgrading Telerik.Web.UI.dll version from 2021.3.1111.40 to the 2024.4.1114.462 in our application.

Our application uses the RadScheduler component, which was functioning without any issues prior to the upgrade.

However, after upgrading to the 2024 version of Telerik.Web.UI, the Scheduler component begins throwing the attached error (stack trace attached Error2.png).

Upon investigation, it appears that the 2024 version of Telerik.Web.UI has a dependency on Newtonsoft.Json version 13.0.

Currently, our application utilizes Newtonsoft.Json version 12.0.

Upgrading to version 13.0 is not feasible in the short term due to multiple dependencies that require comprehensive testing.

We kindly seek your clarification and assistance with the following questions:

Can you confirm whether the Telerik.Web.UI 2024.4.1114.462 version has a dependency on Newtonsoft.Json version 13.0?
Is there any workaround available to resolve this issue without upgrading to Newtonsoft.Json version 13.0?

Your assistance and guidance on this matter would be greatly appreciated.

Thank you, and we look forward to your response.

Best regards,
Arvind Pandey.

UI for ASP.NET AJAX in ASP.NET MVC

answered on 18 Dec 2024

2 answers

113 views

RadMenu: the tab and arrow keys navigation through the radmenu is inconsistent.

Hello Telerik Team,

Our customers have found that using the tab and arrow keys for navigation through the radmenu is inconsistent.

For example, when a user tabs into a radmenu item, uses the arrow keys to navigate to other menu items, and then hits the tab key again, the selection jumps to the last tab location instead of the current arrow key location.

Is there any way to make the arrow keys behave the same as the tab key, please?

Thanks in advance,

Lan

Menu

answered on 16 Dec 2024

3 answers

127 views

RadMultiSelect Select All

How do I had a "Select All" option to a RadMultiSelect? I've see a couple of pages showing is but I can't find it in the docs or examples.

Thanks for any help.

Ajax

MultiSelect

answered on 11 Dec 2024

1 answer

110 views

RadAsyncUpload - Retain uploaded temp files during validation postback

I'm using server side validation for certain controls on an asp.net web form page, which also contains a RadAsyncUpload control.

When a user clicks save, I check to make sure these certain controls contain a value. If this fails, we stop the save process and display a message to the user.

During this process, any files to be uploaded are lost. I need to retain them.

In the load event following this post back, the RadAsyncUpload control still has the uploaded files, but after fully loading the page, they're gone.

I'm already using the Post back Triggers property and this save button just happens to be the post back trigger.

How can I capture these files and "re-load" them into the control?

AsyncUpload

answered on 10 Dec 2024

1 answer

120 views

Inquiry About TDF Files and Additional Language Support in RadSpell Checker

Hi ,

I’m currently using the RadSpell checker in Telerik AJAX UI and specifically need a TDF (Telerik Dictionary Format) file to support the Latvian language. While researching, I came across mentions of a "Dictionary Configurator Tool" in some of your references, but I couldn’t find this tool in my installation package.

Additionally, I’d like to ask about the availability of TDF files for languages not included in the default installation.. Is there a way to obtain or create these files for unsupported languages? Any suggestions or resources you could provide would be really helpful.

Editor

Spell

updated answer on 09 Dec 2024

0 answers

165 views

How to use mouse hover on dropdownlist item

I success show the full length ddl.item.text(selected choice) in limited length ddl. But I want to use it in ddl items too, what should I do?

Form.aspx

<tr>
   <td>
      <asp:Label ID="lblFolderPath" runat="server" Width="75px" Text="Folder Path: " ></asp:Label>

      <ToolTip1>
         <telerik:RadDropDownList ID="ddlFolderPath" runat="server" Skin="Windows7" 
            Width="650px" Height="23px" AutoPostBack="True" 
            onClientSelectedIndexChanged="loadingAnimation">
            <Items>
               <telerik:DropDownListItem runat="server" DropDownList="ddlFolderPath " Text="" />
            </Items>
         </telerik:RadDropDownList>
      </ToolTip1>
   </td>
</tr>

Form.aspx.vb

Select Case GetMMRCode("CueSheetImportSegmentRoot", CurrentSide, ReturnTable) 'CurrentSide = DEV
   Case 0
      '// Get ddl choices from DB
      ddlFolderPath.Items.Clear()  'Prevent do items.add multiple times

      For Each row As DataRow In ReturnTable.Rows
         ddlFolderPath.Items.Add(New DropDownListItem(CType(row.Item("Opt1"), String), CType(row.Item("Code"), String)))  
     Next
End Select

ToolTip

updated question on 09 Dec 2024

1 answer

80 views

Multiple RadAsyncUpload with Progress Bar

I am working with multiple RadAsyncUpload controls, and for each RadAsyncUpload, I use a RadProgressBar to track the progress of the file uploads. However, I am encountering an issue when uploading multiple files to one of the RadAsyncUpload controls. In this case, all the RadProgressArea components display unexpectedly, as shown in the screenshot below.

Can anyone help by providing sample code or advice to handle this case?

AsyncUpload

ProgressArea

answered on 05 Dec 2024

1 answer

58 views

Working with Telerik RadScheduler for ASPX - binding to child controls

This Telerik aspx-ajax RadScheduler is driving me nuts. Normally i prefer Telerik Web UI to DevExpress anything, but I'm banging my head against a wall here and not getting anywhere.I have two interdependent selections to make when adding an appointment on the scheduler. I need to select a doctor, and I need to select a patient (patients filtered by the selected doctor). The rest is your standard date and time and subject gumpf.For this I'm using the <AdvancedInsertTemplate> and <AdvancedUpdateTemplate> elements of the scheduler:

<AdvancedInsertTemplate>
   <div class="rsAdvancedEdit rsAdvancedModal" style="position: relative; height: 300px;">
       <div class="rsModalBgTopLeft">
       </div>
       <div class="rsModalBgTopRight">
       </div>
       <div class="rsModalBgBottomLeft">
       </div>
       <div class="rsModalBgBottomRight">
       </div>
       <div class="rsAdvTitle">
           <h1 class="rsAdvInnerTitle">
               <%# Container.Appointment.Owner.Localization.AdvancedEditAppointment %></h1>
           <asp:LinkButton runat="server" ID="LinkButton1" CssClass="rsAdvEditClose"
               CommandName="Cancel" CausesValidation="false" ToolTip='<%# Container.Appointment.Owner.Localization.AdvancedClose %>'>
               <%# Container.Appointment.Owner.Localization.AdvancedClose%>
           </asp:LinkButton>
       </div>
       <div class="rsAdvContentWrapper">
           <div class="form-horizontal">
               <div class="form-group">
                   <label class="col-md-2 control-label">Subject</label>
                   <div class="col-md-10">
                       <asp:TextBox runat="server" ID="AppointmentSubject" CssClass="col-md-10 form-control" />
                   </div>
               </div>
               <div class="form-group">
                   <label class="col-md-2 control-label">Start time:</label>
                   <div class="col-md-10">
                       <telerik:RadDateTimePicker RenderMode="Lightweight" ID="StartTime" SelectedDate='<%# DateTime.Now.Date %>' runat="server"
                           EnableSingleInputRendering="false" />
                   </div>
               </div>
               <div class="form-group">
                   <label class="col-md-2 control-label">Doctor:</label>
                   <div class="col-md-10">
                       <asp:DropDownList runat="server" ID="DoctorsList"
                           CssClass="form-control" />
                   </div>
               </div>
               <div class="form-group">
                   <label class="col-md-2 control-label">Patient Name:</label>
                   <div class="col-md-10">
                       <asp:DropDownList runat="server" ID="PatientsList"
                           CssClass="form-control" />
                    </div>
               </div>
           </div>
           <asp:Panel runat="server" ID="Panel1" CssClass="rsAdvancedSubmitArea">
               <div class="rsAdvButtonWrapper">
                   <asp:LinkButton CommandName="Insert" runat="server" ID="LinkButton2" CssClass="rsAdvEditSave">
                       <span><%# Container.Appointment.Owner.Localization.Save%></span>
                   </asp:LinkButton>
                   <asp:LinkButton runat="server" ID="LinkButton3" CssClass="rsAdvEditCancel" CommandName="Cancel"
                       CausesValidation="false">
                       <span><%# Container.Appointment.Owner.Localization.Cancel%></span>
                   </asp:LinkButton>
               </div>
           </asp:Panel>
       </div>
   </div>
</AdvancedInsertTemplate>

Now in all cases, I would prefer a telerik RadComboBox in place of the DropDownList for the Patients selection as I can allow the user to type the patient's name and get an item back, but the damn thing won't bind.If I use the RadComboBox here, the markup errors while creating the form saying that there is no data source for the list.Here's my binding code:

protected void RadScheduler_FormCreated(object sender, SchedulerFormCreatedEventArgs e)
{
	if (e.Container.Mode == SchedulerFormMode.AdvancedEdit || e.Container.Mode == SchedulerFormMode.AdvancedInsert)
	{
		var doctorsDropdown = e.Container.FindControl("DoctorsList") as DropDownList;
		_doctorsList = doctorsDropdown;
		var patientsDropdown = e.Container.FindControl("PatientsList") as DropDownList;
		_patientsList = patientsDropdown;
		DoInitialBindings(doctorsDropdown, patientsDropdown);
		e.Appointment.End = e.Appointment.Start.AddHours(1);
	}
}
private void DoInitialBindings(DropDownList doctorsList, DropDownList patientsList)
{
   var doctorHelper = new DoctorsHelper();
   var doctorItems = new List<DoctorsViewModel>();
   var patientHelper = new PatientsHelper();
   var patientItems = new List<PatientsViewModel>();
   // Gets all the doctors and patients relevant to the Medical Practice
   // where the user is a receptionist.
   if (Roles.IsUserInRole(nameof(UserRole.Receptionist)))
   {
       int.TryParse(Request.Cookies["lcyduh"]["practice"], out int practiceId);
       doctorItems = doctorHelper.ListItemsForParent(practiceId);
       foreach (var doctor in doctorItems)
       {
           patientItems.Add(patientHelper.ListItemsForDoctor(doctor.Id));
       }
   }
   doctorsList.DataSource = doctorItems;
   doctorsList.DataTextField = "Name";
   doctorsList.DataValueField = "Id";
   doctorsList.DataBind();
   patientsList.DataSource = patientItems;
   patientsList.DataTextField = "Firstname"; // Firstname and Lastname fields are concatenated into the Firstname field by the helper function that retrieves the data.
   patientsList.DataValueField = "Id";
   patientsList.DataBind();
}

This works but its just a little bit blegh in terms of user friendly.Any ideas how I can bind this to a RadComboBox?

Scheduler