Questions on UI for ASP.NET AJAX Forum

1 answer

119 views

RadTimePicker do not return correct date from CustomTimeValues in JavaScript

//ASP.net

<telerik:RadTimePicker runat="server" ID="rtpStopTime" Width="80px" ValidationGroup="GridChanges" OnLoad="rtpStopTime_DataBinding"

ClientEvents-OnDateSelected="MCRPostShiftStopTimePickerOnTimeSelect">

<DateInput ID="DateInput2" runat="server" AutoCompleteType="None" TabIndex="3"></DateInput>

<TimeView ID="TimeView2" runat="server" Interval="15" Columns="8" AlternatingTimeStyle-BackColor="#F6F6F9"></TimeView>

</telerik:RadTimePicker>

//C#:

protected void rtpStartTime_DataBinding(object sender, EventArgs e)

{

RadTimePicker TimeBox = (RadTimePicker)sender;

TimeBox.TimeView.CustomTimeValues = StartTimeArray; //6:00 - 23:45 Date = '2015/01/01' ; 0:00 - 5:45 Date = '2015/01/02'

}


function MCRPostShiftStartTimePickerOnTimeSelect(sender, eventArgs) {
 
              //not sending the correct date from customvalues for values over midnight
 
              //alert("Start Time " + eventArgs.get_newValue());
              //alert("Start Date " + eventArgs.get_newDate());
              //var date = eventArgs.get_renderDay().get_date();
              //alert("Start Date " + date);
            
              //var timepicker = sender;
              //alert("timepicker " + timepicker);
              //var selectedDate = timepicker.get_selectedDate().format("yyyy/MM/dd");
              //var selectedTime = timepicker.get_selectedDate().format("HH:mm:ss")
              //alert("Start: " + selectedDate + " " + selectedTime);
 
          }

DateTimePicker

answered on 20 Jul 2015

1 answer

804 views

Radcombox checkbox Item selection in foreach loop not working when I use the OnItemsRequested event

Hello,

I use the OnItemsRequested event to get the data from database:

Below are design code:

<telerik:RadComboBox ID="ddlItem" runat="server" Width="45%" ZIndex="50000" Height="400px"
                                                DropDownWidth="500px" HighlightTemplatedItems="true" EmptyMessage="[ Search items by typing minimum 2 characters ]"
                                                AllowCustomText="true" MarkFirstMatch="true" EnableLoadOnDemand="true" OnItemsRequested="ddlItem_OnItemsRequested"
                                                Skin="Office2007" ShowMoreResultsBox="true" EnableVirtualScrolling="true" OnClientItemsRequesting="OnClientItemsRequesting"
                                                CheckBoxes="true" >
                                                <HeaderTemplate>
                                                    <table style="width: 100%" cellspacing="0" cellpadding="0">
                                                        <tr>
                                                            <td style="width: 10%" align="left">
                                                                <asp:Literal ID="Literal1" runat="server" Text="Group"></asp:Literal>
                                                            </td>
                                                            <td style="width: 60%" align="left">
                                                                <asp:Literal ID="Literal2" runat="server" Text="Item Name"></asp:Literal>
                                                            </td>
                                                            <td style="width: 15%" align="right">
                                                                Stock
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </HeaderTemplate>
                                                <ItemTemplate>
                                                    <table style="width: 100%" cellspacing="0" cellpadding="0">
                                                        <tr>
                                                            <td style="width: 10%" align="left">
                                                                <%# DataBinder.Eval(Container,"Attributes['ItemSubCategoryShortName']" )%>
                                                            </td>
                                                            <td style="width: 60%" align="left">
                                                                <%# DataBinder.Eval(Container, "Text")%>
                                                            </td>
                                                            <td style="width: 15%" align="right">
                                                                <%# DataBinder.Eval(Container, "Attributes['ClosingBalance']")%>
                                                            </td>
                                                            <td style="width: 10%; display: none;" align="right">
                                                                <%# DataBinder.Eval(Container, "Attributes['Percentage']")%>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </ItemTemplate>
                                            </telerik:RadComboBox>

And i use the following code in c#:

protected void ddlItem_OnItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
{

//write login code to get the data from database through ItemRequest event.

}

What I want is I use the checkbox to select multiple items or data from drop down and add all the checkboxs true to grid but when i use foreach loop then I can't get the checkbox true items.

Here is the code:

foreach (RadComboBoxItem ComboItem in ddlItem.CheckedItems)
        {
            if (ComboItem.Checked == true)
            {
            }
}

The above loop is not working when i try to get the checked true items.

Please help me as soon as possible.

I hope you understand my query.

Thanks

Jiten Mutum

ComboBox

answered on 20 Jul 2015

1 answer

190 views

Bind Multi-column combobox to WebMethod

multi-column RadComboBox via a web method.

ASPX

<telerik:RadComboBox runat="server" ID="RadComboBox1" Width="200px"

        MarkFirstMatch="true"

        EnableLoadOnDemand="true"

        HighlightTemplatedItems="true"

        DroDownCssClass="exampleRadComboBox">

       <HeaderTemplate>

            <tr>

                <th class="col1">Category Name</th>

             <%--   <th class="col2">Some other column</th>--%>

            </tr>

        </HeaderTemplate>

        <ItemTemplate>

            <tr>

                <td class="col1">

                    <%# DataBinder.Eval(Container.DataItem, "Category_Name") %></td>

             <%--   <td class="col2">

                    <%# DataBinder.Eval(Container.DataItem, "Some_Other_Col") %></td>--%>

            </tr>

        </ItemTemplate>

          <WebServiceSettings Method="GetCat" Path="Default.aspx" />

</telerik:RadComboBox>

Code Behind

[WebMethod]

       public static RadComboBoxData GetCatType(RadComboBoxContext context)

       {

           var x =

               "[{'CoachingSessionActivityCategoryID':0,'CoachingSessionActivityTypeID':1000005,'Category_Name':'Skills Conditioning','TeamID':0,'ClubID':1,'Type_Name':'Skills Con - Small Sided Games (Attack)'}]";

           var data = JsonConvert.DeserializeObject<DataTable>(x);

           RadComboBoxData comboData = new RadComboBoxData();

           var itemOffset = context.NumberOfItems;

           var endOffset = Math.Min(itemOffset + 10, data.Rows.Count);

           comboData.EndOfItems = endOffset == data.Rows.Count;

           List<RadComboBoxItemData> result = new List<RadComboBoxItemData>(endOffset - itemOffset);

           for (int i = itemOffset; i < endOffset; i++)

           {

               RadComboBoxItemData itemData = new RadComboBoxItemData();

               itemData.Text = data.Rows[i]["Category_Name"].ToString();

               itemData.Value = data.Rows[i]["Category_Name"].ToString();

               result.Add(itemData);

           }

           comboData.Items = result.ToArray();

           return comboData;

       }

The question is:

1) How do I bind the combobox to the web method?

2) How do I bind multiple columns to the combo box with the web method?

ComboBox

answered on 20 Jul 2015

2 answers

42 views

iPod Style Combobox with Filter

Hi,

We're working on an application which has a RadComboBox multiple tiers which can be clicked through.

Similar to https://www.filamentgroup.com/examples/menus/ipod.html#

Menu 1

Food

Drinks

-> Click Food

Menu 2 appears

Starters

Main

Dessert

-> Click Dessert

Menu 3 appears

Ice Cream
Meringue with Orange

All within the same ComboBox?

Is it possible in UI for ASP.NET AJAX to achieve a similar result out of the box?

Additionally one of the requirements is the ability to filter the items based on the path.

So if the user types "Orange" it will bring back results of Meringue with Orange from Food > Dessert menu and Orange Juice from Drinks > Squash menu?

I hope that I've made sense.

ComboBox

answered on 20 Jul 2015

2 answers

483 views

Dynamically adding RadButtons

I am trying to dynamically add RadButtons to a page by simply sticking the HTML in on the page load. The buttons are not showing up on the page. I have tried using AddControl which does display the buttons, but after I call AddControl, I can no longer modify the InnerHtml. Any ideas how I can make this work? See Code below.

    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsCallback)
            return;

        CompSubMenuDiv.InnerHtml = "";

        int ItemNum = 0;
        AddMenuHTML("Item Title 1",
                    "Item Description 1",
                    "~\\Comparison.aspx", "~\\Comparison.aspx", "~\\Comparison.aspx",
                    ItemNum);

        AddMenuHTML("Item Title 2",
                    "Item Description 2.",
                    "~\\Comparison.aspx", "~\\Comparison.aspx", "~\\Comparison.aspx",
                    ItemNum);

    }

    protected void AddMenuHTML(string ModTitle, string ModDesc,
                               string LearnMoreURL, string SampleURL, string CreateIllURL,
                               int ItemNum)
    {
        // Add the html for one menu item.
        ItemNum++;
        string Button1Name = "RadButton" + Convert.ToString(ItemNum);
        ItemNum++;
        string Button2Name = "RadButton" + Convert.ToString(ItemNum);

        CompSubMenuDiv.InnerHtml = CompSubMenuDiv.InnerHtml + "<br /><br /><br />" +
          "<span class=\"SubMenuItemTitle IISMenuItemText1\">" + ModTitle + "</span><br />" +
          "<div class=\"SysSubMenuLevel2Div\">" +
          "   <div class=\"SubMenuItemDescDiv\">" +
          "       <span class=\"SubMenuItemText\">" + ModDesc + " <a href=\"~\\comparisons.aspx\">learn more...</a> </span>" +
          "       <br />" +
          "       <telerik:RadButton ID=\"" + Button1Name + "\" runat=\"server\" " +
          "           Text=\"Show me a sample case...\"" +
          "           BorderColor=\"Black\" Height=\"1.5em\" ForeColor=\"#666666\" Style=\"padding-top: 2px; " +
          "           padding-bottom: 2px; margin-top: 0.5em; visible: true;\">" +
          "       </telerik:RadButton>" +
          "   </div>" +
          "   <div class=\"SubMenuCreateIllDiv\">" +
          "       <telerik:RadButton ID=\""+Button2Name+"\" runat=\"server\" " +
          "           Text=\"Create Illustration\" BorderColor=\"Black\"" +
          "           Height=\"1.5em\" Style=\"padding-top: 2px; padding-bottom: 2px; margin-top: 0.5em;" +
          "            float: right\" BackColor=\"Gray\" ForeColor=\"White\">" +
          "       </telerik:RadButton>" +
          "   </div>" +
          "</div>";
    }

Button

answered on 20 Jul 2015

2 answers

219 views

Server-side column selected event

Hi,

I have a grid where the user will click a column and I want to handle that column-click server-side. I tried handling OnSelectedCellChanged (with EnablePostBackOnRowClick="true") but that only works when clicking cells, not columns headers. How can I achieve this?

Grid

answered on 20 Jul 2015

2 answers

276 views

Export to PDF performance issues

Hello,

We are using Telerik Grid control and having performance issues with the PDF export.
The details:

Grid control is used in a webpart under SharePoint 2013
Datasource is a SQL table, but accessing via ORM (LLBLGen Pro framework)
It is a Master-Detail view (details are closed by default and not exported to PDF) - source code attached below
It takes 60 seconds to generate a PDF from ~7000rows (it will be a ~24Mb PDF file, ~700pages)

I did some profiling from the C# webpart side and from the DB side too.
As you can see in the attachments there is only one SQL query which takes less than a second (381ms) to get the data.

1.EventClass StartTime EndTime Duration (ms) TextData Reads Writes RowCounts

2.Trace Start 2015-07-14 15:15:33.577

3.SQL:BatchCompleted 2015-07-14 15:15:33.577 2015-07-14 15:15:33.957 381 SELECT xx 1023 0 7632

4.Trace Stop 2015-07-14 15:15:33.957

But the other attachment is about the hot path in the code and it clearly shows that the Grid's internal methods are working hard for 60 seconds (!) to produce the PDF.

Telerik.Web.UI.RadAjaxControl.RenderPageInAjaxMode
Telerik.Web.UI.Grid.Export.TableViewExporter.PrepareForExportInternal

These two methods are running 98% percent of the time.

I've created an excel file with MS Excel 2010 on my local machine with the same data and saved it as a PDF. It took less then 10 seconds to generate and save the file.

Is it possible to increase the export's performance and decrease the necessary time to ~15 seconds?
What can cause this long rendering time? Maybe the master-detail view?

Thanks for your tips in advance!

<telerik:RadGrid ID="RadGrid_BoatGrid" runat="server"

Skin="Metro"

OnNeedDataSource="RadGrid_BoatGrid_OnNeedDataSource"

AllowPaging="True"

OnDetailTableDataBind="RadGrid_BoatGrid_OnDetailTableDataBind"

EnableLinqExpressions="True">

<ExportSettings IgnorePaging="True" OpenInNewWindow="True" HideStructureColumns="True">

<Pdf DefaultFontFamily="Arial" PageWidth="297mm" PageHeight="210mm" PageTitle="Boats" PaperSize="A4"></Pdf>

</ExportSettings>

<MasterTableView AutoGenerateColumns="False"

NoMasterRecordsText="There are no Boats."

AllowSorting="True"

DataKeyNames="Id">

<DetailTables>

<telerik:GridTableView runat="server" Name="Actions" DataKeyNames="Id" Width="100%" AutoGenerateColumns="False"

NoDetailRecordsText="There are no Actions associated with this Boat.">

<Columns>

<telerik:GridTemplateColumn UniqueName="ActionNumber"

HeaderText="Number"

DataField="Id">

<ItemTemplate>

................

</ItemTemplate>

</telerik:GridTemplateColumn>

..............

<telerik:GridBoundColumn HeaderText="% Complete" DataField="PercentComplete">

</telerik:GridBoundColumn>

</Columns>

</telerik:GridTableView>

</DetailTables>

<Columns>

.......

<telerik:GridBoundColumn UniqueName="Title"

HeaderText="Title"

DataField="Title"

SortExpression="Title">

<HeaderStyle Width="160px"></HeaderStyle>

</telerik:GridBoundColumn>

.......

</Columns>

</MasterTableView>

</telerik:RadGrid>

Grid

answered on 20 Jul 2015

2 answers

301 views

Set One Time DataSource for SearchBox

Is is possible to set SearchBox Datasource only one time(when page is not postback)?

Because i have to populate 10,000 Names in SearchBox each time if my page get post back

here is my code

protected void Page_Load(object sender, EventArgs e)
{

radSearchEmployeeName.DataSource = GetEmployeeNameList();
radSearchEmployeeName.DataTextField = "LeadFullName";
radSearchEmployeeName.DataValueField = "LeadID";
radSearchEmployeeName.DataBind();

}

I am getting "DataSource not set" error for below code

if (!IsPostBack)
{

radSearchEmployeeName.DataSource = GetEmployeeNameList();
radSearchEmployeeName.DataTextField = "LeadFullName";
radSearchEmployeeName.DataValueField = "LeadID";
radSearchEmployeeName.DataBind();

}

SearchBox

answered on 19 Jul 2015

14 answers

321 views

US Counties map

I need to color some of US counties with specific colors.

Ideally some kind of "heat map" (meaning different tints of the same color depending on the number supplied. Bigger number results in deeper color tint).

Not sure how to approach this task.

Thank you

Map

answered on 17 Jul 2015

9 answers

492 views

Treeview styling the nodes with extra buttons and checkboxes

Hi there,

I am building an App which reads data from a table and populates using a heirarchicaldataset class.

This works fine in the standard Ajax Treeview but I am struggling with the limitations of this control.

The data populates perfectly ok, but I need to conditionally add up to 5 icons to the node text on the LHS and even one or two on the RHS. I will need to have these potentially firing off functions in Javascript and/or code behind.

But I do not want to have to manage the node population in code, once I have populated my datasource I want the treeview to display with a minimal amount of fuss. I want to set up indicators in my data structure to say which icons appear and also to have checkbox for selection on the LHS.

The documentation/demo online does not seem to happily or simply support population from a dataset directly which is why I chose to use the standard asp treeview.

Does RadTreeview support node population via a heirarchicaldataset (recursive dataset) method and does it support a templated node layout?

I was thinking of a layout with a number of TD's ..

I can't see examples of this sort of thing on the demos pages.

jON

TreeView