Questions on UI for ASP.NET AJAX Forum

4 answers

139 views

GridTemplateColumn inside a CompositeControl

Hello, I am trying to follow this sample

http://www.telerik.com/help/aspnet-ajax/grid-programmatic-creation.html

to create a template grid column in a grid that in my case is contained inside a CompositeControl

First attempt, using the control OnInit event

protected override void OnInit(EventArgs e)

{

base.OnInit(e);

EnsureChildControls();

…

if (!Page.IsPostBack)

{

    var boundColumn = new GridBoundColumn();

  grid.MasterTableView.Columns.Add(boundColumn);

    boundColumn.DataField = "MyColumn";

GridTemplateColumn templateColumn = new

GridTemplateColumn(); 

grid.MasterTableView.Columns.Add(templateColumn);

templateColumn.ItemTemplate = new MyTemplate(templateColumnName);

}

Result: the InstantiateIn method of the template is called only the first time, but in postbacks not.

Second attempt: subscribing to the page Init event

protected override void OnInit(EventArgs e)

{

base.OnInit(e);

EnsureChildControls();

Page.Init += PageInit;

…

private void PageInit(object sender, EventArgs e)

{



var boundColumn = new GridBoundColumn();

  boundColumn.DataField = "MyColumn";

grid.MasterTableView.Columns.Add(boundColumn);

    GridTemplateColumn templateColumn = new GridTemplateColumn();

templateColumn.ItemTemplate = new

MyTemplate(templateColumnName);

grid.MasterTableView.Columns.Add(templateColumn);

Result: the template column is correctly created, but the bound one is duplicated on every postback

What's the correct way to programmatically create a template column in a composite control?
Thanks

Grid

answered on 13 Jan 2014

2 answers

107 views

multple static header grid column alignment in IE compatibilty mode

Hi Team,

I am using telerik version 2013.2.611.35 for asp.net ajax controls.

I am having problems with IE-compatibility mode for radgrid with multiple headers, static header.
I have attached 2 images. One in normal IE9 mode and the other in IE-compatibility mode. As seen in the images in IE-compatibility mode the header columns and data columns are mis-aligned.

I also tried meta tag "<meta http-equiv="X-UA-Compatible" content="IE=edge"/>", but no use.

Please provide a possible solution.

Grid

answered on 13 Jan 2014

1 answer

116 views

Show picture for selected item of a CustomFilter combobox

Hello,

I have a grid with a customfilter column that lets filter choosing in a combobox that shows images (I'm using sprites, and the image is set through cssclass).

Here is the Custom filter class:

Public Class SeleccionFilteringColumn

Inherits GridTemplateColumn

Protected Overrides Sub SetupFilterControls(ByVal cell As TableCell)

Dim rcBox As New RadComboBox()

rcBox.Width = 55

rcBox.ID = "DropDownListSeleccion"

AddHandler rcBox.ItemCreated, AddressOf rcBox_ItemCreated

rcBox.AutoPostBack = True

rcBox.Items.Add(New Telerik.Web.UI.RadComboBoxItem("", -1))

rcBox.Items.Add(New Telerik.Web.UI.RadComboBoxItem("", 0))

rcBox.Items.Add(New Telerik.Web.UI.RadComboBoxItem("", 1))

AddHandler rcBox.SelectedIndexChanged, AddressOf rcBox_SelectedIndexChanged

cell.Controls.Add(rcBox)

End Sub

Protected Overrides Sub SetCurrentFilterValueToControl(ByVal cell As TableCell)

If Not (Me.CurrentFilterValue = "") Then

Try

DirectCast(cell.Controls(0), RadComboBox).Items.FindItemByValue(Me.CurrentFilterValue).Selected = True

Catch ex As Exception

End Try

End If

End Sub

Public Overrides Property Visible As Boolean

Get

Return MyBase.Visible

End Get

Set(value As Boolean)

MyBase.Visible = value

End Set

End Property

Protected Overrides Function GetCurrentFilterValueFromControl(ByVal cell As TableCell) As String

Dim currentValue As String = DirectCast(cell.Controls(0), RadComboBox).SelectedItem.Value

Me.CurrentFilterFunction = If((currentValue <> ""), GridKnownFunction.EqualTo, GridKnownFunction.NoFilter)

If currentValue = "-1" Then Return Nothing

Return currentValue

End Function

Private Sub rcBox_SelectedIndexChanged(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs)

DirectCast(DirectCast(sender, RadComboBox).Parent.Parent, GridFilteringItem).FireCommandEvent("Filter", New Pair())

Select Case e.Value

Case 0

CType(sender, RadComboBox).InputCssClass = "btnNoSeleccionado"

Case 1

CType(sender, RadComboBox).InputCssClass = "btnSeleccionado"

End Select

End Sub

Protected Sub rcBox_ItemCreated(o As Object, e As RadComboBoxItemEventArgs)

e.Item.Height = 34

Select Case e.Item.Value

Case 0

e.Item.CssClass = "btnNoSeleccionado"

Case 1

e.Item.CssClass = "btnSeleccionado"

End Select

End Sub

End Class

You can see the filter combobox open in the attached image. How can I do the selected picture to will be shown in the input combobox? I've tried to assign the InputCssClass in the SelectIndexChanged event but it didn't work.

Thank you

Roberto

Grid

answered on 13 Jan 2014

7 answers

1.0K+ views

[Solved] Change Grid Font Size

OK, this seems like this should be a piece of cake. I want to change the font of the entire grid (headers, items, etc) to use a font size of ".8em;". I have changed the font size at the grid level and nothing changed. I am able to override individual columns with the item styles. Isn't there an easier way to do this?

Grid

answered on 13 Jan 2014

2 answers

106 views

Rad Editor Inserting nonbreaking space

Hi

We are using Telerik control Telerik.Web.UI.dll version "2013.2.717.40" . When we have some existing value on editor and then if we remove the value completely and we do not enter any new value in the rad editor, still editor returns "<P>&nsbp</P>" as value . We are expecting value as empty if nothing is entered in RadEditor

Please suggest

Editor

answered on 13 Jan 2014

1 answer

120 views

Return text value of checked button

I have a toolbar that is dynamically created server side. Client side, I'm trying to determine which button is currently clicked and capturing the text value of the button. One of the buttons is definitely checked but I never return a value. What am I doing wrong?

function RowDblClick(sender, eventArgs) {

var toolBar = $find("<%=radtoolMonths.ClientID%>");

var intMonths = toolBar.get_items().get_count();

var datMonth='1/1/14'

for (var i = 0; i < intMonths; i++)

{

if (toolBar.get_items().getItem(i).get_checked == true) {

datMonth = toolBar.get_items().getItem(i).get_text;

}

ToolBar

answered on 13 Jan 2014

7 answers

425 views

Selected value is empty after postback

Hi,

Please provide us the solution for the following scenario.

we are having 2 combo boxes in our page as below

<telerik:RadComboBox Font-Names="Verdana" Skin="WebBlue" EmptyMessage="Select One" Height="200px"
                                        AllowCustomText="true" Filter="contains" MarkFirstMatch="false" EnableScreenBoundaryDetection="false"
                                        AutoPostBack="False" EnableLoadOnDemand="False" Width="95%" runat="server" CssClass="dropdown"
                                        ID="cbo1" OnClientBlur="OnClientBlurAdd" OnClientKeyPressing="clientKeyPressingAdd"
                                         OnClientDropDownOpening="ClientDropDownOpeningAdd">
                                    </telerik:RadComboBox>

Second combo box:

           <telerik:RadComboBox Font-Names="Verdana" Height="200px" Skin="WebBlue" EmptyMessage="Enter 3 or more characters to search"
                                        AllowCustomText="true" Filter="contains" MarkFirstMatch="true" EnableScreenBoundaryDetection="false"
                                        Width="350px" runat="server" CssClass="dropdown" ID="cboPatient" OnClientBlur="OnClientBlurPatient" HighlightTemplatedItems = "True"
                                        OnClientKeyPressing="clientKeyPressingPatient" OnClientSelectedIndexChanged="ClientSelectedIndexChangedPatient"
                                        OnClientDropDownOpening="ClientDropDownOpeningPatient" EnableLoadOnDemand="true">
                                          <HeaderTemplate>
                                            <table width = "100%">
                                                <tr>
                                                    <td align = "left" style ="font-family: Arial, Verdana, Sans-Serif; font-size:12px; font-weight:bold; width:60%">
                                                        Clinic
                                                    </td>
                                                    <td align = "left" style ="font-family: Arial, Verdana, Sans-Serif; font-size:12px; font-weight:bold; width:40%">
                                                        Patient
                                                    </td>
                                                </tr>
                                            </table>
                                         </HeaderTemplate>
                                         <ItemTemplate>
                                                <table width = "100%">
                                                        <td align = "left" style ="font-family: Arial, Verdana, Sans-Serif; font-size:11px;width:60%">
                                                             <%# DataBinder.Eval(Container.DataItem, "ClinicName") %>
                                                        </td>
                                                        <td align = "left" style ="font-family: Arial, Verdana, Sans-Serif; font-size:11px;width:40%">
                                                             <%# DataBinder.Eval(Container.DataItem, "PatientLastName") %>
                                                        </td>
                                                </table>
                                        </ItemTemplate>
                                    </telerik:RadComboBox>

and the second will be filled based on the selected value of first one. And here we are always getting cbo1.SelectedValue is empty.
but i am able to get the value here on the "OnClientBlur" event of cbo1.

function OnClientBlurAdd(sender, eventArgs)
    {
         myMultipleParametersHandlerAdd(sender, eventArgs);
    }

    function myMultipleParametersHandlerAdd(combo, eventArgs)
    {
        var item=combo.get_highlightedItem();
        if(item !=null)
        {
            combo.set_text(item.get_text());
            combo.set_value(item.get_value());     ///i am able to get the value here
        }
        else
        {
            combo.clearSelection();
            combo.set_emptyMessage("Select One");

        }
    }

what can be the issue?

Thank you,
Saranya.

ComboBox

answered on 13 Jan 2014

1 answer

109 views

[Solved] Radtabstripe TabClickEvent

Hi,

I'm using a rad tab strip with an on TabClickEvent. I've ajaxified this process and that all works but the problem is when I select a new tab the page view doesn't change. The initial page view which is RadPageView1 is always visible regardless of the tab that is selected. I didn't have this problem before using the TabClick server event. Am I doing something wrong? Here's the code...

<telerik:RadTabStrip ID="radTabStrip1" runat="server" Skin="MetroTouch"

MultiPageID="RadMultiPage1" Width="832px" BorderStyle="None" SelectedIndex="0"

OnTabClick="radTabStrip1_TabClick">

<Tabs>

<telerik:RadTab Text="History" TabIndex="0" Selected="True">

</telerik:RadTab>

<telerik:RadTab Text="Payment History" TabIndex="1" >

</telerik:RadTab>

<telerik:RadTab Text="Email History" TabIndex="2">

</telerik:RadTab>

<telerik:RadTab Text="Notes" TabIndex="3">

</telerik:RadTab>

<telerik:RadTab Text="Invoice History" TabIndex="4" >

</telerik:RadTab>

</Tabs>

</telerik:RadTabStrip>

<div id="TabBorder" runat="server" style="width:100%; height:5px; "></div>

<telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0"

Width="832px" >

<telerik:RadPageView ID="RadPageView1" runat="server" Height="508px"

Width="832px">

<telerik:RadGrid runat="server" ID="grdHistory" DataSourceID="objHistory" Width="100%"

Skin="MetroTouch" AllowPaging="true" PageSize="10" >

<MasterTableView AutoGenerateColumns="false" CssClass="GridHistory">

<PagerStyle AlwaysVisible="true" Mode="Slider" ></PagerStyle>

<HeaderStyle CssClass="HistoryGridHeader" />

<Columns>

<telerik:GridBoundColumn DataField="Status" HeaderText="Status" UniqueName="Status">

<HeaderStyle Width="140px" />

<ItemStyle CssClass="FirstColumn" Font-Bold="true" />

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn DataField="Description" HeaderText="Description" UniqueName="Description">

<HeaderStyle Width="460px" />

<ItemTemplate>

<asp:Label runat="server" id="lblDescription" Text='<%# Eval("Description") %>' />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="Date" HeaderText="Date" UniqueName="Date">

<HeaderStyle Width="234px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ClientId" HeaderText="ClientId" UniqueName="ClientId" Visible="false">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView2" runat="server" Height="508px" Width="832px">

<telerik:RadGrid runat="server" ID="grdPaymentHistory" DataSourceID="objPaymentHistory"

Skin="MetroTouch" AllowPaging="true" PageSize="10" >

<HeaderStyle CssClass="HistoryGridHeader" />

<PagerStyle AlwaysVisible="true" Mode="Slider" ></PagerStyle>

<MasterTableView AutoGenerateColumns="false" CssClass="GridHistory">

<Columns>

<telerik:GridTemplateColumn DataField="Description" HeaderText="Description" UniqueName="Description">

<ItemStyle CssClass="FirstColumn" />

<HeaderStyle Width="250px" />

<ItemTemplate>

<asp:Label runat="server" id="Label1" Text='<%# Eval("Description") %>' />

<asp:Label runat="server" id="lblUser" Text='<%# Eval("Username") %>' />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="PaymentAmount" HeaderText="Payment Amount" UniqueName="PaymentAmount"

DataFormatString="{0:C}">

<HeaderStyle Width="250px" HorizontalAlign="Center" />

<ItemStyle HorizontalAlign="Center"/>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="DateRecieved" HeaderText="Date Received" UniqueName="DateRecieved"

DataFormatString="{0:MM/dd/yyyy}">

<HeaderStyle Width="234px" HorizontalAlign="Center" />

<ItemStyle HorizontalAlign="Center" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ClientId" HeaderText="ClientId" UniqueName="ClientId" Visible="false">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView3" runat="server" Height="508px" Width="832px">

<telerik:RadGrid runat="server" ID="grdEmailHistory" DataSourceID="objEmailHistory"

Skin="MetroTouch" AllowPaging="true" PageSize="10">

<HeaderStyle CssClass="HistoryGridHeader" />

<PagerStyle AlwaysVisible="true" Mode="Slider" ></PagerStyle>

<MasterTableView AutoGenerateColumns="false">

<Columns>

<telerik:GridBoundColumn DataField="SentTo" HeaderText="To" UniqueName="SentTo">

<HeaderStyle Width="225px" />

<ItemStyle CssClass="FirstColumn"/>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Subject" HeaderText="Subject" UniqueName="Subject">

<HeaderStyle Width="115px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Date" HeaderText="Date" UniqueName="Date" DataFormatString="{0:MM/dd/yyyy}">

<HeaderStyle HorizontalAlign="Center" Width="100px" />

<ItemStyle HorizontalAlign="Center"/>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="ClientId" HeaderText="ClientId" UniqueName="ClientId" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="View Email" UniqueName="Id" HeaderStyle-HorizontalAlign="Center">

<ItemStyle BorderStyle="None" Width="57px" HorizontalAlign="Center" />

<ItemTemplate>

<a href="#" onclick="OpenWindow('<%# DataBinder.Eval(Container.DataItem, "Id") %>'); return false;">

<asp:Image ID="EmailImage" runat="server" ImageUrl="~/Images/Icons/Test/Email.png"

AlternateText="View Email" ToolTip="View Email" style="border:none" />

</a>

</div>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView4" runat="server" Height="200px"

Width="832px">

<telerik:RadTextBox ID="txtNotes" runat="server" Height="191px"

TextMode="MultiLine" Width="832px" BorderStyle="None" BorderColor="#EDEDED">

</telerik:RadTextBox>

<div style="height:100px" />

</telerik:RadPageView>

<telerik:RadPageView ID="RadPageView5" runat="server" Height="191px"

Width="832px">

<telerik:RadGrid runat="server" ID="grdInvoiceHistory" DataSourceID="objInvoiceHistory" Width="100%"

GridLines="Horizontal" Skin="Sunset" AllowPaging="true">

<ClientSettings>

<ClientEvents OnRowMouseOver="GetRowId" />

</ClientSettings>

<MasterTableView AutoGenerateColumns="false" CssClass="GridHistory" DataKeyNames="Id" ClientDataKeyNames="Id" >

<HeaderStyle CssClass="HistoryGridHeader" />

<Columns>

<telerik:GridBoundColumn DataField="Id" HeaderText="Id" UniqueName="Id" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn DataField="InvoiceNo" UniqueName="InvoiceNo" HeaderText="Invoice No">

<ItemTemplate>

<asp:LinkButton runat="server" ID="lnkInvoiceNo" Text='<%# Eval("InvoiceNo") %>'

OnClientClick="SetInvoiceParameters()" OnCommand="lnkInvoiceNo_Command" />

</ItemTemplate>

<ItemStyle CssClass="FirstColumn" />

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="InvoiceDate" HeaderText="Date Created" UniqueName="InvoiceDate" DataFormatString="{0:MM/dd/yyyy}">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Status" HeaderText="Status" UniqueName="Status">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="RecurringId" HeaderText="RecurringId" UniqueName="RecurringId" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="CustomerId" HeaderText="CustomerId" UniqueName="CustomerId" Visible="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="CompanyId" HeaderText="CompanyId" UniqueName="CompanyId" Visible="false">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</telerik:RadPageView>

</telerik:RadMultiPage>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel2" >

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="grdHistory" >

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdHistory"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="grdPaymentHistory">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdPaymentHistory"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="grdEmailHistory">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdEmailHistory"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="txtNotes">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="txtNotes"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="grdInvoiceHistory">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdInvoiceHistory"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="grdDisputeHistory">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="grdDisputeHistory"

LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="radTabStrip1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="radTabStrip1"

LoadingPanelID="RadAjaxLoadingPanel2" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

</div>

protected void radTabStrip1_TabClick(object sender, RadTabStripEventArgs e)

{

radTabStrip1.Tabs[0].BackColor = System.Drawing.ColorTranslator.FromHtml("#f9f9f9");

radTabStrip1.Tabs[0].ForeColor = System.Drawing.ColorTranslator.FromHtml("#000000");

radTabStrip1.Tabs[1].BackColor = System.Drawing.ColorTranslator.FromHtml("#f9f9f9");

radTabStrip1.Tabs[1].ForeColor = System.Drawing.ColorTranslator.FromHtml("#000000");

radTabStrip1.Tabs[2].BackColor = System.Drawing.ColorTranslator.FromHtml("#f9f9f9");

radTabStrip1.Tabs[2].ForeColor = System.Drawing.ColorTranslator.FromHtml("#000000");

radTabStrip1.SelectedTab.BackColor = System.Drawing.ColorTranslator.FromHtml(_statusColor);

radTabStrip1.SelectedTab.ForeColor = Color.White;

}

thanks,
Ron.

TabStrip

answered on 13 Jan 2014

3 answers

366 views

Setting an initial value in RadComboBox while using Load on Demand

My combo is empty until I click the dropdown (items request event is fire): so what is the best strategy to set an initial item (value and text) in RadComboBox while using Loading on Demand?

Thx

ComboBox

answered on 13 Jan 2014

1 answer

181 views

how combobox reset after postback

how show empty message in combo box after post back page.

ComboBox

answered on 13 Jan 2014