Questions on UI for ASP.NET AJAX Forum

7 answers

1.4K+ views

[Solved] loop through each row to check if ceckbox is checked, client side

I would like to loop through every row in the grid, then check the checkbox on that row if checked, if it is I would require a datakeyvalue. This all need to be client side using javascript.

The problems I am having facing,

1) looping through the rows.
2) find a checkbox on the row.

Any help with this would be much appreciated.

Grid

answered on 05 Nov 2014

1 answer

247 views

unable to fix the height and width of column having image in it

hi,

I am want to fix the height and width of column which has image displayed. Actually, all the images being called in the cell are of different size this causes the design messed up.

I tried Item style height and width but it didn't solved the problem.

here is the code

<telerik:RadGrid ID="RadGrid_Banner_Home_Main" runat="server" AllowFilteringByColumn="True"

AutoGenerateColumns="false" AllowSorting="True" PageSize="10" ShowFooter="False"

ShowGroupPanel="False" AllowPaging="true" Skin="Vista" EnableLinqExpressions="false">

<PagerStyle Mode="NextPrevAndNumeric" />

<ExportSettings IgnorePaging="true" FileName="banner_Export" Pdf-AllowAdd="true"

Pdf-AllowCopy="true" Pdf-AllowPrinting="true" Pdf-PaperSize="A4" Pdf-Creator="a1"

OpenInNewWindow="true" ExportOnlyData="true" />

<MasterTableView DataKeyNames="banner_id" HorizontalAlign="NotSet" AutoGenerateColumns="False"

AllowFilteringByColumn="True" AllowSorting="true" AlternatingItemStyle-BackColor="#f3f3f3"

CommandItemDisplay="Top" ClientDataKeyNames="banner_id">

<CommandItemSettings ShowExportToWordButton="false" ShowExportToExcelButton="false"

ShowExportToPdfButton="false" ShowExportToCsvButton="false" ShowAddNewRecordButton="false"

ShowRefreshButton="false" />

<NoRecordsTemplate>

Banner not available

</NoRecordsTemplate>

<SortExpressions>

<telerik:GridSortExpression FieldName="image" SortOrder="Ascending" />

</SortExpressions>

<Columns>

<telerik:GridTemplateColumn HeaderText="Banner" DataField="image" UniqueName="image"

HeaderStyle-Width="100" ItemStyle-Width="100" ItemStyle-Height="100"

AutoPostBackOnFilter="true" CurrentFilterFunction="Contains" ShowFilterIcon="false" AllowFiltering="false"

GroupByExpression="image [Banner] Group By image">

<ItemTemplate>

<asp:Label ID="lbl_img_path" runat="server" Text='<%#Eval("image")%>' Visible="false"></asp:Label>

<%# IIf(Container.DataItem("banner_type") <> "HTML", "" & "<img src=" & Gogotech.SqlHelper.of_FetchKey("FrontEndServer") & IIf(Eval("image") <> "", Eval("image"), "/images/ina.jpg") & " />" & "", "" & Eval("html") & "")%>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

Grid

answered on 05 Nov 2014

4 answers

179 views

Suppress horizontal scroll bar on RadTreeList

I am using the RadTreeList and have enabled scrolling. The RadTreeList reserves room at the bottom for a horizontal scroll bar whether or not a horizontal scroll bar is needed. How do I suppress the horizontal scroll bar or change the behavior so the RadTreeList does not reserve room at the bottom? In my case I never want a horizontal scroll bar to appear whether or not it is needed.

Here is my code:

<telerik:RadTreeList ID="RadTreeView2" runat="server" DataKeyNames="ProductID" ParentDataKeyNames="ParentID" Height="350px"

OnTreeNodeDataBound="RadTreeView2_TreeNodeDataBound" OnItemCommand="RadTreeView2_UpdateCommand"

OnItemDataBound="RadTreeView2_ItemDataBound" OnCancelCommand="RadTreeView2_CancelCommand"

OnNeedDataSource="RadTreeList2_NeedDataSource" EnableViewState="true" Width="100%"

EditMode="InPlace" AllowMultiItemEdit="true" AutoGenerateColumns="False">

<Columns>

<telerik:TreeListBoundColumn DataField="ProductName" UniqueName="ProductName" Resizable="true" HeaderStyle-Width="100%"

HeaderText="Product Name" >

</telerik:TreeListBoundColumn>

<telerik:TreeListNumericColumn DataField="Supply_FTE" UniqueName="Supply_FTE" HeaderText="Supply FTE" Resizable ="true"

DecimalDigits="2" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="100px"

ItemStyle-Width="100px" NumericType="Number" ItemStyle-HorizontalAlign="Center"

DataFormatString="{0:N2}">

</telerik:TreeListNumericColumn>

<telerik:TreeListNumericColumn DataField="Supply_Percent" UniqueName="Supply_Percent" Resizable ="true"

NumericType="Percent" HeaderText="Supply Percent" HeaderStyle-HorizontalAlign="Center"

HeaderStyle-Width="100px" ItemStyle-Width="100px" ItemStyle-HorizontalAlign="Center"

DataFormatString="{0:P2}">

</telerik:TreeListNumericColumn>

<telerik:TreeListBoundColumn DataField="ResID" UniqueName="ResID" HeaderText="ResID" MaxWidth="0"

Visible="false">

</telerik:TreeListBoundColumn>

<telerik:TreeListBoundColumn DataField="UserID" UniqueName="UserID" Visible="false" MaxWidth="0"

HeaderText="UserID">

</telerik:TreeListBoundColumn>

<telerik:TreeListBoundColumn DataField="OrgID" UniqueName="OrgID" Visible="false" MaxWidth="0"

HeaderText="OrgID">

</telerik:TreeListBoundColumn>

<telerik:TreeListEditCommandColumn UniqueName="Edit" ShowAddButton="False" ButtonType="ImageButton" Resizable="false"

EditText="Edit" UpdateText="Update" Display="true" Visible="true" HeaderStyle-Width="55px" ItemStyle-Width="55px"

MinWidth="55px" MaxWidth="55px" >

</telerik:TreeListEditCommandColumn>

</Columns>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" />

<Resizing AllowColumnResize="False" EnableRealTimeResize="true" />

</ClientSettings>

</telerik:RadTreeList>

TreeList

answered on 05 Nov 2014

4 answers

199 views

Batch Edit Column Alignment

I have a RadGrid, which is in batch edit mode that functionally works fine. There is however a cosmetic issue that I would like to resolve if possible.

When there are no records in the grid and the '+Add new record' option is clicked, the columns for the blank row that appears are misaligned with the column headings unless the browser window happens to be set at a particular width.

Once there is at least one record in the grid, everything aligns perfectly with both new and existing records. If I fix the with of all the columns then it all works fine but of course I do not want to do this.

I've attach screenshots to show the misalignment problem and here is my aspx code for the grid:

<telerik:RadGrid ID="RadGrid1" DataSourceID="ds_Logbook" AutoGenerateColumns="False"

AllowSorting="True"

AllowAutomaticDeletes="False"

AllowAutomaticInserts="True"

AllowAutomaticUpdates="True"

AllowPaging="false" GridLines="None"

EnableEmbeddedSkins="false" Skin="RAMtrackStdGrid" runat="server">

<MasterTableView CommandItemDisplay="TopAndBottom" DataKeyNames="Logbook_id,Fault_Id"

DataSourceID="ds_Logbook" HorizontalAlign="NotSet" EditMode="Batch" AutoGenerateColumns="False">

<BatchEditingSettings EditType="Cell" />

<Columns>

<telerik:GridTemplateColumn UniqueName="LogDay" HeaderText="Day" DataField="LogDate" HeaderStyle-Width="40px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<asp:TextBox ID="txt_LogDay" Text='<%# Bind("LogDay") %>' Width="20px" runat="server" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridDropDownColumn UniqueName="Activity_Id" HeaderText="Activity Code" DataField="Activity_Id" ListValueField="Activity_Id" ColumnEditorID="GridDropDownColumnEditor1"

ListTextField="ActivityCode" DataSourceID="ds_ActivityCodes" SortExpression="Activity_Id" HeaderStyle-Width="60px">

<ItemStyle Width="70px" />

<ColumnValidationSettings EnableRequiredFieldValidation="true">

<RequiredFieldValidator ForeColor="Red" Text="*This field is required">

</RequiredFieldValidator>

</ColumnValidationSettings>

</telerik:GridDropDownColumn>

<telerik:GridTemplateColumn UniqueName="StartTime" HeaderText="Start Time" DataField="StartTime" HeaderStyle-Width="80px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<telerik:RadTimePicker ID="tp_StartTime" Width="60px" SelectedDate='<%# Bind("StartTime") %>' Skin="Metro" runat="server">

<DateInput ID="DateInput2" CssClass="TimeField" Width="60px" runat="server">

</DateInput>

<TimeView ID="TimeView1" Interval="00:30:00" Columns="6" runat="server"></TimeView>

</telerik:RadTimePicker>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="StopTime" HeaderText="Stop Time" DataField="StopTime" HeaderStyle-Width="80px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<telerik:RadTimePicker ID="tp_StopTime" Width="60px" SelectedDate='<%# Bind("StopTime") %>' Skin="Metro" runat="server">

<DateInput ID="DateInput2" CssClass="TimeField" Width="60px" runat="server">

</DateInput>

<TimeView ID="TimeView1" Interval="00:30:00" Columns="6" runat="server"></TimeView>

</telerik:RadTimePicker>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="ProgComment" HeaderText="Comments" DataField="ProgComment" HeaderStyle-Width="300px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<telerik:RadEditor ID="re_ProgComment" Width="280px" Height="200px" EditModes="Design" Content='<%# Eval("ProgComment") %>' Skin="Metro" runat="server">

<Tools>

<telerik:EditorToolGroup>

<telerik:EditorTool Name="Bold"></telerik:EditorTool>

<telerik:EditorTool Name="Italic"></telerik:EditorTool>

<telerik:EditorTool Name="Underline"></telerik:EditorTool>

<telerik:EditorTool Name="Cut"></telerik:EditorTool>

<telerik:EditorTool Name="Copy"></telerik:EditorTool>

<telerik:EditorTool Name="Paste"></telerik:EditorTool>

<telerik:EditorTool Name="AjaxSpellCheck"></telerik:EditorTool>

</telerik:EditorToolGroup>

</Tools>

</telerik:RadEditor>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridDropDownColumn UniqueName="Event_Id" HeaderText="Incident type" DataField="Event_Id2" SortExpression="Event_Id2" ColumnEditorID="GridDropDownColumnEditor2"

ListTextField="EventDescription" ListValueField="IncidentType" DataSourceID="ds_IncidentTypes" HeaderStyle-Width="100px">

</telerik:GridDropDownColumn>

<telerik:GridTemplateColumn UniqueName="TimeFaultOccurred" HeaderText="Time of Incident" DataField="TimeFaultOccurred" HeaderStyle-Width="80px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<telerik:RadTimePicker ID="tp_TimeFaultOccurred" Width="60px" SelectedDate='<%# Bind("TimeFaultOccurred") %>' Skin="Metro" runat="server">

<DateInput ID="DateInput2" CssClass="TimeField" Width="60px" runat="server">

</DateInput>

<TimeView ID="TimeView1" Interval="00:30:00" Columns="6" runat="server"></TimeView>

</telerik:RadTimePicker>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName="FaultSymptom" HeaderText="Symptoms" DataField="FaultSymptom" HeaderStyle-Width="300px">

<ItemTemplate>

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

</ItemTemplate>

<EditItemTemplate>

<telerik:RadEditor ID="re_Symptoms" Width="280px" Height="200px" EditModes="Design" Content='<%# Eval("FaultSymptom") %>' Skin="Metro" runat="server">

<Tools>

<telerik:EditorToolGroup>

<telerik:EditorTool Name="Bold"></telerik:EditorTool>

<telerik:EditorTool Name="Italic"></telerik:EditorTool>

<telerik:EditorTool Name="Underline"></telerik:EditorTool>

<telerik:EditorTool Name="Cut"></telerik:EditorTool>

<telerik:EditorTool Name="Copy"></telerik:EditorTool>

<telerik:EditorTool Name="Paste"></telerik:EditorTool>

<telerik:EditorTool Name="AjaxSpellCheck"></telerik:EditorTool>

</telerik:EditorToolGroup>

</Tools>

</telerik:RadEditor>

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn UniqueName="LogDate" HeaderText="" DataField="LogDate" AllowFiltering="false" ReadOnly="true" HeaderStyle-Width="1px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Logbook_Id" HeaderText="" DataField="Logbook_Id" AllowFiltering="false" ReadOnly="true" HeaderStyle-Width="1px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Fault_Id" HeaderText="" DataField="Fault_Id" AllowFiltering="false" ReadOnly="true" HeaderStyle-Width="1px" >

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="status" HeaderText="" DataField="status" AllowFiltering="false" ReadOnly="true" HeaderStyle-Width="1px" >

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true" FrozenColumnsCount="0"></Scrolling>

<ClientEvents OnCommand="gridCommand" />

</ClientSettings>

</telerik:RadGrid>

Grid

answered on 05 Nov 2014

3 answers

348 views

[Solved] Cell visibility based on another cell value

Hi,

In it's simplest form I have a RadGrid containing a Milestone indicator column, a Title and a Value.
If the particular row is a Milestone, then this should not have an associated value.

I am unsure how to get a reference to whether the current row is a 'Milestone' row and, if so, simply hide the label that is generated for the 'External Costs' column.

My grid is structured as follows (simplified): -

<telerik:RadGrid ID="costingGrid" runat="server" RenderMode="Auto" OnNeedDataSource="costingGrid_NeedDataSource" AllowAutomaticUpdates="true" ClientSettings-AllowKeyboardNavigation="true">

<ClientSettings>

<Selecting AllowRowSelect="true" />

<ClientEvents OnRowCreated="gridRowCreated" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" />

</ClientSettings>

<MasterTableView AutoGenerateColumns="false" DataKeyNames="ID" Width="100%" EditMode="Batch" CommandItemDisplay="Top" ShowFooter="true">

<BatchEditingSettings EditType="Cell" OpenEditingEvent="Click" />

<Columns>

<telerik:GridBoundColumn UniqueName="ID" DataField="ID" Visible="false" />

<telerik:GridBoundColumn UniqueName="IsMilestone" DataField="IsMilestone" Display="false" />

<telerik:GridTemplateColumn UniqueName="Title" DataField="Title" HeaderText="Title" HeaderStyle-Width="400px" >

<ItemTemplate>

<asp:Label ID="titleLabel" runat="server" Width="100%" Text='<%#Bind("Title") %>' />

</ItemTemplate>

<EditItemTemplate>

<telerik:RadTextBox ID="titleInput" runat="server" Width="100%" TextMode="MultiLine" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn UniqueName="ExternalCosts" DataField="ExternalCosts" HeaderText="3rd Party Costs" HeaderStyle-Width="80px" DataFormatString="{0:N2}" HeaderStyle-HorizontalAlign="Right" ItemStyle-HorizontalAlign="Right" Aggregate="Sum" FooterAggregateFormatString="£{0:F2}" />

</MasterTableView>

</telerik:RadGrid>

<telerik:RadScriptBlock runat="server">

<script type="text/javascript">

function gridRowCreated(sender, args) {

}

</script>

</telerik:RadScriptBlock>

protected void costingGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)

{

costingGrid.DataSource = CurrentCosting.Lines.OrderBy(l => l.LineNumber).ToList();

}

Many thanks,
Mike.

Grid

answered on 04 Nov 2014

4 answers

275 views

[Solved] AdditionalYAxes on a RadHTMLChart

I'm trying to add a lineseries on an existing RadhtmlChart that is a columnseries. Image attached - this is as far as I got following your page Multiple Y-axes demo. The Columnseries values and lineseires values are different that is why i created a AdditionalAxis (sample below). I'm populating the data via datatable to RadHTMLChart.Datasource()
1. how do i populate seperate Y axis
2. how to show the lineseries.
Please advice, thank you.

<telerik:RadHtmlChart runat="server" Width="700px" Height="500px" ID="DashboardMonthlyChart" Skin="Vista">

<PlotArea>

<Series>

<telerik:ColumnSeries DataFieldY="TotalClicks" Name="Total Clicks" Stacked="True">

<LabelsAppearance Visible="false"></LabelsAppearance>

<TooltipsAppearance Color="White" />

</telerik:ColumnSeries>

<telerik:ColumnSeries DataFieldY="TotalCalls" Name="Total Calls">

<LabelsAppearance Visible="false"></LabelsAppearance>

<TooltipsAppearance Color="White" />

</telerik:ColumnSeries>

<telerik:LineSeries AxisName="AdditionalAxis" Name="Cost Per Contact">

<LabelsAppearance Visible="false"></LabelsAppearance>

<TooltipsAppearance Color="White" />

</telerik:LineSeries>

</Series>

<XAxis DataLabelsField="Month">

<LabelsAppearance RotationAngle="75" Step="1">

</LabelsAppearance>

<TitleAppearance Text="">

</TitleAppearance>

<AxisCrossingPoints>

<telerik:AxisCrossingPoint Value = "0" />

<telerik:AxisCrossingPoint Value = "12" />

</AxisCrossingPoints>

</XAxis>

<YAxis>

<TitleAppearance Text="">

</TitleAppearance>

</YAxis>

<AdditionalYAxes>

<telerik:AxisY Name="AdditionalAxis" Color="Red" Width="3">

<TitleAppearance Text = "Cost Per Contact">

<TextStyle Color="Black" />

</TitleAppearance>

<LabelsAppearance>

<TextStyle Color="Black" />

</LabelsAppearance>

</telerik:AxisY>

</AdditionalYAxes>

</PlotArea>

<Legend>

<Appearance Visible="true" Position="Top">

</Appearance>

</Legend>

</telerik:RadHtmlChart>

Private Sub LoadDashboardDetails()

Dim dtPerformance As DataTable

Dim IYPPerformanceInfo As XElement = Nothing

'//Rerence WCF service.

Dim oypmservice As New CL_ADOMDService.WCFAdomdServiceClient

'//Data returned as XElement

IYPPerformanceInfo = oypmservice.GetIYPDashboardByMonth(Session("AcctNum"), ViewState("PubInitID"), ViewState("StartDate"), ViewState("EndDate"), True)

''//Convert XElement to Datatable

dtPerformance = clMisc.GetDataTableFromXMLElement(IYPPerformanceInfo)

'//Store data in Session

Dim dtPerformanceRows As DataTable

dtPerformanceRows = dtPerformance.Select("Month<>'GroupHeader'").CopyToDataTable

dtPerformanceRows.Columns.Add(New DataColumn("MonthNumber", GetType(Date)))

For Each dr In dtPerformanceRows.Rows

dr("MonthNumber") = CDate(dr("Month")) 'Split(dr("Month").ToString.Trim, " ")(0)

Next

ViewState("IYPDashboard") = dtPerformanceRows

'testgrid.DataSource = dtPerformanceRows

'testgrid.DataBind()

If dtPerformance IsNot Nothing Then

If dtPerformanceRows.Columns.Contains("Total Clicks") = False Then

dtPerformanceRows.Columns.Add("Total Clicks", GetType(Integer))

End If

If dtPerformanceRows.Columns.Contains("Total Calls") = False Then

dtPerformanceRows.Columns.Add("Total Calls", GetType(Integer))

End If

If dtPerformanceRows.Columns.Contains("Cost Per Contact") = False Then

dtPerformanceRows.Columns.Add("Cost Per Contact", GetType(Double))

End If

LoadDetailChart()

DashboardDetailsListView.DataSource = dtPerformanceRows.Select("", "MonthNumber Asc").CopyToDataTable

DashboardDetailsListView.DataBind()

End If

DashboardMonthlyChart.ChartTitle.Text = ViewState("PubName")

DashboardMonthlyChart.PlotArea.XAxis.AxisCrossingPoints(1).Value = Decimal.Parse(12)

DashboardMonthlyChart.ChartTitle.Appearance.TextStyle.Bold = True

DashboardMonthlyChart.ChartTitle.Appearance.Align = Telerik.Web.UI.HtmlChart.ChartTitleAlign.Left

DashboardMonthlyChart.Legend.Appearance.TextStyle.Margin = "8"

DashboardMonthlyChart.PlotArea.XAxis.MajorGridLines.Visible = False

DashboardMonthlyChart.PlotArea.XAxis.MinorGridLines.Visible = False

DashboardMonthlyChart.PlotArea.YAxis.MajorGridLines.Visible = True

DashboardMonthlyChart.PlotArea.YAxis.MinorGridLines.Visible = False

End Sub

Private Sub LoadDetailChart()

Dim dtMonthlyDetail As DataTable

dtMonthlyDetail = ViewState("IYPDashboard")

Dim dtChartData As DataTable

Dim ColumnNames() As String

Dim dc As DataColumn

ColumnNames = "Month,Total Clicks,Total Calls,Total Contacts,Cost Per Contact,MonthNumber".Split(",")

Dim view As DataView

view = New DataView(dtMonthlyDetail)

dtChartData = view.ToTable(True, ColumnNames).Select("", "MonthNumber Asc").CopyToDataTable

For Each dc In dtChartData.Columns

dc.ColumnName = dc.ColumnName.Replace(" ", "")

Next

DashboardMonthlyChart.DataSource = dtChartData

DashboardMonthlyChart.DataBind()

End Sub

General Discussions

answered on 04 Nov 2014

1 answer

201 views

StoreFile overriding my override.

I'm trying to override a RadEditor DocumentManager upload control and it's mysteriously appending root path to my path...

public override string StoreFile(Telerik.Web.UI.UploadedFile file, string path, string name, params string[] arguments)
{
string uploadPath = this.GetPhysicalFromVirtualPath(path);
return base.StoreFile(file, uploadPath, name, arguments);
}

GetPhysicalFromVirtualPath() builds the UNC \\\\servername\\store\\{product}\\docs\\ path properly. But the override then bombs because path wasn't found for this directory c:\projects\DocManagerProject\servername\store\{product}\docs\.

Why is the StoreFile function overriding my override?

General Discussions

answered on 04 Nov 2014

12 answers

448 views

[Solved] RadDatePicker rendering problem in IE9 Compatibility Mode

Hello team,

I have two RadDatePicker that I'm showing next to eachother to pick a from and upon date.
It displays always fine in Chrome, FireFox, IE8, IE9, except in IE9 Compatibility Mode (which has to be supported for our clients)

In IE9 Compatibility Mode the boxes are shown like this:
[RadDatePicker1 here]
until
[RadDatePicker2 here]

While in any other browser and IE9 non Comp.Mode it shown like this (as I want):

[RadDatePicker1 here] until [RadDatePicker2 here]

(see attached screenshot for clarification)

I tried wrapping all controls in a div with white-space:nowrap; and/or display:inline; but nothing seems to work.
However, when I remove the following line, it works, but removing this line is not an option.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

Do you have any suggestions to make this work? Using Q3 2011 SP1 and Asp.Net 3.5
Thanks in advance!

Regards,
Jasper

My code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2.aspx.cs" Inherits="Tests_Test2" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

<title></title>

</head>

<body>

<form id="form1" runat="server">

<asp:ScriptManager EnableScriptGlobalization="true" runat="server" ID="scriptManager" EnablePartialRendering="True" />

<div>

<telerik:RadDatePicker ID="RadDatePicker1" runat="server"

MinDate="1900-01-01" MaxDate="2099-12-31" Width="110px">

<DateInput ID="DateInput1" runat="server" DateFormat="dd-MM-yyyy" DisplayDateFormat="dd-MM-yyyy"></DateInput>

<DatePopupButton ImageUrl="~/images/calendar.png" HoverImageUrl="~/images/calendar.png" />

</telerik:RadDatePicker>

until

<telerik:RadDatePicker ID="RadDatePicker2" runat="server"

MinDate="1900-01-01" MaxDate="2099-12-31" Width="110px">

<DateInput ID="DateInput2" runat="server" DateFormat="dd-MM-yyyy" DisplayDateFormat="dd-MM-yyyy"></DateInput>

<DatePopupButton ImageUrl="~/images/calendar.png" HoverImageUrl="~/images/calendar.png" />

</telerik:RadDatePicker>

</div>

</form>

</body>

</html>

Calendar

answered on 04 Nov 2014

4 answers

121 views

[Solved] Google-like Filtering Problem

Hello,

I am working on a project with RadGrid.
I am trying to apply Google-like Filtering on my project.
(http://www.telerik.com/help/aspnet-ajax/grid-google-like-filtering.html)

I have some problems:

1.) After I filter a column, I don’t see any data in my grid.
2.) Is it possible to filter a numeric field that I do not know in advance its name? (data source of my grid is dynamic and I don’t know in advance the type of each column)

My code so far:

001.Public Class Google_Like_Filter2

002. Inherits System.Web.UI.Page

003. Dim dd As New DummyData

004. Dim dt As New DataTable

005. Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

006. If Not IsPostBack Then

007. dt = dd.GenTableData2

008. Me.RadGrid1.MasterTableView.Columns.Clear()

009.

010. For Each dataColumn As DataColumn In dt.Columns

011. Dim gridColumn As New MyCustomFilteringColumnVB()

012. Me.RadGrid1.MasterTableView.Columns.Add(gridColumn)

013. gridColumn.DataField = dataColumn.ColumnName

014. gridColumn.HeaderText = dataColumn.ColumnName

015. Next

016. End If

017. End Sub

018.

019. Private Sub RadGrid1_ColumnCreating(sender As Object, e As Telerik.Web.UI.GridColumnCreatingEventArgs) Handles RadGrid1.ColumnCreating

020. If (e.ColumnType = GetType(MyCustomFilteringColumnVB).Name) Then

021. e.Column = New MyCustomFilteringColumnVB()

022. End If

023. End Sub

024.

025. Private Sub RadGrid1_ItemCommand(sender As Object, e As Telerik.Web.UI.GridCommandEventArgs) Handles RadGrid1.ItemCommand

026. If (e.CommandName = "Filter") Then

027. For Each column As GridColumn In e.Item.OwnerTableView.Columns

028. column.CurrentFilterValue = String.Empty

029. column.CurrentFilterFunction = GridKnownFunction.NoFilter

030. Next

031. End If

032. End Sub

033.

034. Private Sub RadGrid1_NeedDataSource(sender As Object, e As Telerik.Web.UI.GridNeedDataSourceEventArgs) Handles RadGrid1.NeedDataSource

035. RadGrid1.DataSource = dt

036.

037. End Sub

038.End Class

039.

040.Public Class MyCustomFilteringColumnVB

041. Inherits GridBoundColumn

042. Dim dd As New DummyData

043. 'RadGrid will call this method when it initializes the controls inside the filtering item cells

044. Protected Overloads Overrides Sub SetupFilterControls(ByVal cell As TableCell)

045. MyBase.SetupFilterControls(cell)

046. cell.Controls.RemoveAt(0)

047. Dim combo As New RadComboBox()

048. combo.ID = ("RadComboBox1" + Me.UniqueName)

049. combo.ShowToggleImage = False

050. combo.Skin = "Office2007"

051. combo.EnableLoadOnDemand = True

052. combo.AutoPostBack = True

053. combo.MarkFirstMatch = False

054. combo.Height = Unit.Pixel(100)

055. combo.EnableAutomaticLoadOnDemand = False

056. AddHandler combo.ItemsRequested, AddressOf Me.list_ItemsRequested

057. AddHandler combo.SelectedIndexChanged, AddressOf Me.list_SelectedIndexChanged

058. cell.Controls.AddAt(0, combo)

059. cell.Controls.RemoveAt(1)

060. End Sub

061. 'RadGrid will cal this method when the value should be set to the filtering input control(s)

062. Protected Overloads Overrides Sub SetCurrentFilterValueToControl(ByVal cell As TableCell)

063. MyBase.SetCurrentFilterValueToControl(cell)

064. Dim combo As RadComboBox = DirectCast(cell.Controls(0), RadComboBox)

065. If (Me.CurrentFilterValue <> String.Empty) Then

066. combo.Text = Me.CurrentFilterValue

067. End If

068. End Sub

069. 'RadGrid will cal this method when the filtering value should be extracted from the filtering input control(s)

070. Protected Overloads Overrides Function GetCurrentFilterValueFromControl(ByVal cell As TableCell) As String

071. Dim combo As RadComboBox = DirectCast(cell.Controls(0), RadComboBox)

072. Return combo.Text

073. End Function

074. Private Sub list_ItemsRequested(ByVal o As Object, ByVal e As RadComboBoxItemsRequestedEventArgs)

075. Dim dt As DataTable = dd.GenTableData2

076. CType(o, RadComboBox).DataTextField = Me.DataField

077. CType(o, RadComboBox).DataValueField = Me.DataField

078. 'If (Me.ColumnType Is GetType(String)) Then

079.

080. 'dt = dt.Select(String.Format(Me.UniqueName + " LIKE '*{0}*'", e.Text)).CopyToDataTable

081. dt = dt.Select(Me.UniqueName + " LIKE '%" + e.Text + "%'").CopyToDataTable

082. Dim dv As DataView = New DataView(dt)

083. dt = dv.ToTable("dt", False, Me.UniqueName)

084. ''Else

085. 'End If

086.

087.

088.

089. CType(o, RadComboBox).DataSource = dt

090.

091. CType(o, RadComboBox).DataBind()

092. End Sub

093.

094. Private Sub list_SelectedIndexChanged(ByVal o As Object, ByVal e As RadComboBoxSelectedIndexChangedEventArgs)

095. Dim filterItem As GridFilteringItem = DirectCast((DirectCast(o, RadComboBox)).NamingContainer, GridFilteringItem)

096. If (Me.UniqueName = "Index") Then

097. 'If (Me.ColumnType Is GetType(Integer)) Then

098. 'this is filtering for integer column type

099. filterItem.FireCommandEvent("Filter", New Pair("EqualTo", Me.UniqueName))

100. End If

101. 'filtering for string column type

102. filterItem.FireCommandEvent("Filter", New Pair("Contains", Me.UniqueName))

103. End Sub

104.End Class

105.

106.Public Class DummyData

107. Public Function GenTableData2(Optional records = 30)

108. Dim dt As New DataTable

109. dt.Columns.Add("ID", GetType(Integer))

110. dt.Columns.Add("First", GetType(String))

111. dt.Columns.Add("Last", GetType(String))

112. dt.Columns.Add("Birth", GetType(DateTime))

113.

114.

115. For index = 1 To records

116. dt.Rows.Add(index, "First" & index, "Last" & index, Date.Now.AddDays(-index))

117. Next

118.

119. Return dt

120. End Function

121.End Class

Thanks,
Daniel.

Grid

answered on 04 Nov 2014

4 answers

178 views

Disable specific tokens

Hi,

Is it possible to disable specific tokens in an AutoCompleteBox?

I found that tokens have a 'isDisabled' property, but changing it does nothing as far as I can tell.

This is my code so far

function AddNewEntry(pText, pDisabled) {

var autoCompleteBox = $find("<%=RdtCmpltBx_Data.ClientID %>");

var entry = new Telerik.Web.UI.AutoCompleteBoxEntry();

entry.set_text(pText);

autoCompleteBox.get_entries().add(entry);

if (pDisabled == true) {

var token = entry.get_token();

token.isDisabled = true;

}

AutoCompleteBox