Questions on UI for ASP.NET AJAX Forum

3 answers

79 views

Grid column and data column alignment is distrubing

Hello,

I am regular using telerik controls. I implemented the advance feature in my project in one grid, now gird column alignemtn got distruct, please can you give me suggetion for this. for you reference I sending you some codes and output screen, you can see in screen column heading anddata both alignemnt is not good. So please can you help me in this. I will say thank in advance

<telerik:RadGrid ID="radGridInbox" runat="server" AutoGenerateColumns="false" OnItemDataBound="radGridInbox_ItemDataBound"
                                        GridLines="Horizontal" AllowPaging="true" PageSize="25" OnNeedDataSource="radGridInbox_NeedDataSource"
                                        OnPageIndexChanged="radGridInbox_PageIndexChanged" OnPageSizeChanged="radGridInbox_PageSizeChanged"
                                        Width="100%" CellPadding="0" CellSpacing="0" EnableHeaderContextFilterMenu="true"
                                        EnableHeaderContextMenu="true" BorderWidth="0" EnableAjaxSkinRendering="true"
                                        AllowFilteringByColumn="false" AllowAutomaticInserts="True" AllowAutomaticUpdates="True">
                                        <GroupingSettings CaseSensitive="false" />
                                        <HeaderContextMenu EnableAutoScroll="True" />
                                        <MasterTableView AutoGenerateColumns="false" Width="100%" CommandItemDisplay="Top" PagerStyle-AlwaysVisible="true" DataKeyNames="UserMessageId,UserId,MessageState"
                                            AllowSorting="true" AllowFilteringByColumn="false" FilterItemStyle-HorizontalAlign="Left"
                                            HorizontalAlign="NotSet"EditMode="PopUp" CellPadding="0"
                                            CellSpacing="0" IsFilterItemExpanded="false" GridLines="None" TableLayout="Auto"
                                            BorderWidth="0" EnableHeaderContextMenu="true" EnableHeaderContextFilterMenu="true">
                                            <CommandItemSettings RefreshText="Refresh List" />
                                            <PagerStyle AlwaysVisible="true" Mode="NextPrevNumericAndAdvanced" Position="Bottom" />
                                            <Columns>
                                                <telerik:GridDateTimeColumn DataFormatString="{0:MM/dd/yyyy}" ItemStyle-HorizontalAlign="Left"
                                                    HeaderText="Date" DataField="DeliverOnDate">
                                                    <HeaderStyle HorizontalAlign="Left" Width="8%"></HeaderStyle>
                                                    <ItemStyle HorizontalAlign="Left" Width="8%"></ItemStyle>
                                                </telerik:GridDateTimeColumn>
                                                <telerik:GridBoundColumn ItemStyle-HorizontalAlign="Left" HeaderText="From" DataField="FromUserName">
                                                    <HeaderStyle HorizontalAlign="Left" Width="16%"></HeaderStyle>
                                                    <ItemStyle HorizontalAlign="Left" Width="16%"></ItemStyle>
                                                </telerik:GridBoundColumn>

Thanks and Regards,
Dilip Kumar

Grid

answered on 16 Mar 2011

3 answers

104 views

ItemsRequested problem with Chrome and Firefox

Im using the ItemsRequested event to filter the contents of one combobox based on the selection in another. Evrything works fine in IE7 and Opera, but in Firefox (3) and Chrome, it doesnt work. Normally in the second combo I show a message that says 'loading' while the data is fetched via ajax without a full page postback, but in Firefox & Chrome, the ajax fetching mechanism just doest work. Has anyone else experienced this ? Is there a workaround ?

ComboBox

answered on 16 Mar 2011

1 answer

59 views

group totals when paging is on

Hi guys,

look at this sample and go to page 3 of the grid;
then, look at the last group of the page: the group header say "Group continues on the next page", that's ok but look at group footer totals, do you see what is wrong? Why group's items are not included in the group footer totals?
This is what my customer is expecting!

Is there a workaround to achieve that?

Any help in appreciated, thank you!

Grid

answered on 16 Mar 2011

2 answers

134 views

RadGrid Style Error

I've tried creating a new style in the Visual Style Builder, selecting just Grid from the control list. I;ve then downloaded the zip, and copied the files into my project.

On one page, I've disabled the embedded styles of the RadGRid, and set the style to the name of the custom style. I have also created links to the stylesheets:-

<link href="App_Themes/Grid.TestStyle.css" rel="stylesheet" type="text/css" />

<link href="App_Themes/Menu.TestStyle.css" rel="stylesheet" type="text/css" />

<link href="App_Themes/Input.TestStyle.css" rel="stylesheet" type="text/css" />

<link href="App_Themes/Slider.TestStyle.css" rel="stylesheet" type="text/css" />

<link href="App_Themes/Calendar.TestStyle.css" rel="stylesheet" type="text/css" />

In design mode the grid looks OK, showing the correct colours etc, but on running the page, I get the error:-

Telerik.Web.UI.GridFilterMenu with ID='rfltMenu' was unable to find embedded skin with name 'TestStyle'. Please, make sure that you spelled the skin name correctly, or if you want to use a custom skin, set EnableEmbeddedSkins=false.

The Radgrid definition is:-

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

AllowPaging="True" AllowSorting="True" DataSourceID="SqlDataSource1"

GridLines="None" Skin="TestStyle" Width="750px" AllowAutomaticDeletes="True"

AllowAutomaticUpdates="True" onitemupdated="RadGrid1_ItemUpdated"

Culture="en-GB" EnableEmbeddedSkins="False">

<MasterTableView DataSourceID="SqlDataSource1" AutoGenerateColumns="False"

DataKeyNames="Purchaser">

<CommandItemSettings ExportToPdfText="Export to Pdf" />

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

</ExpandCollapseColumn>

<Columns>

<telerik:GridBoundColumn DataField="Purchaser"

FilterControlAltText="Filter Purchaser column" HeaderText="Purchaser"

ReadOnly="True" SortExpression="Purchaser" UniqueName="Purchaser">

<ItemStyle Width="150px" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="PurchaserName"

FilterControlAltText="Filter PurchaserName column" HeaderText="Name"

SortExpression="PurchaserName" UniqueName="PurchaserName">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn AllowFiltering="False" DataField="ShortName"

FilterControlAltText="Filter ShortName column" HeaderText="Short Name"

SortExpression="ShortName" UniqueName="ShortName">

</telerik:GridBoundColumn>

<telerik:GridEditCommandColumn ButtonType="ImageButton"

FilterControlAltText="Filter EditCommandColumn column"

CancelImageUrl="Cancel.gif" EditImageUrl="Edit.gif" InsertImageUrl="Update.gif"

UpdateImageUrl="Update.gif">

</telerik:GridEditCommandColumn>

<telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete"

ConfirmText="Are you sure you wish to delete this record?"

FilterControlAltText="Filter column column" Text="Delete" UniqueName="column">

</telerik:GridButtonColumn>

</Columns>

<EditFormSettings EditFormType="Template">

<EditColumn FilterControlAltText="Filter EditCommandColumn column"

CancelImageUrl="Cancel.gif" EditImageUrl="Edit.gif" InsertImageUrl="Update.gif"

UpdateImageUrl="Update.gif">

</EditColumn>

<FormTemplate>

<table style="width:100%;">

<tr>

<td style="text-align: right; width: 129px">

Name:</td>

<td>

<asp:TextBox ID="TextBox2" runat="server" MaxLength="50"

Text='<%# Bind("PurchaserName") %>' Width="150px"></asp:TextBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"

ControlToValidate="TextBox2" Display="None" ErrorMessage="Name is required!"

ValidationGroup="VG1"></asp:RequiredFieldValidator>

<asp:ValidatorCalloutExtender ID="RequiredFieldValidator1_ValidatorCalloutExtender"

runat="server" Enabled="True" TargetControlID="RequiredFieldValidator1">

</asp:ValidatorCalloutExtender>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

Short Name:</td>

<td>

<asp:TextBox ID="TextBox3" runat="server" MaxLength="15"

Text='<%# Bind("ShortName") %>' Width="110px"></asp:TextBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"

ControlToValidate="TextBox3" Display="None"

ErrorMessage="Short name is required!" ValidationGroup="VG1"></asp:RequiredFieldValidator>

<asp:ValidatorCalloutExtender ID="RequiredFieldValidator2_ValidatorCalloutExtender"

runat="server" Enabled="True" TargetControlID="RequiredFieldValidator2">

</asp:ValidatorCalloutExtender>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

Type:</td>

<td>

<asp:DropDownList ID="DropDownList5" runat="server"

SelectedValue='<%# Bind("Type") %>'>

<asp:ListItem>Non-Midlands</asp:ListItem>

<asp:ListItem>Midlands</asp:ListItem>

</asp:DropDownList>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

Sort Order:</td>

<td>

<asp:TextBox ID="TextBox4" runat="server" MaxLength="3"

Text='<%# Bind("SortOrder") %>' Width="50px"></asp:TextBox>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

Corp Forms Group:</td>

<td>

<asp:DropDownList ID="DropDownList6" runat="server"

DataSourceID="SqlDataSource2" DataTextField="corpformsgroup"

DataValueField="corpformsgroup" SelectedValue='<%# Bind("CorpFormsGroup") %>'>

</asp:DropDownList>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

Corp Forms Sort:</td>

<td>

<asp:TextBox ID="TextBox5" runat="server" MaxLength="3"

Text='<%# Bind("CorpFormsSort") %>' Width="50px"></asp:TextBox>

</td>

</tr>

<tr>

<td class="style4" style="width: 129px; text-align: right">

NHS Net Address:</td>

<td>

<asp:TextBox ID="TextBox6" runat="server" Text='<%# Bind("NHSNetAddress") %>'

Width="350px"></asp:TextBox>

</td>

</tr>

</table>

<br />

<table style="width: 300px;">

<tr>

<td style="width: 94px">

<telerik:RadButton ID="RadButton1" runat="server" CommandName="Update"

Skin="WebBlue" Text="Update" ValidationGroup="VG1">

</telerik:RadButton>

</td>

<td>

<telerik:RadButton ID="RadButton2" runat="server" CausesValidation="False"

CommandName="Cancel" Skin="WebBlue" Text="Cancel">

</telerik:RadButton>

</td>

</tr>

</table>

</FormTemplate>

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>

</telerik:RadGrid>

Any ideas why this is happening.

Thanks

Visual Style Builder

answered on 16 Mar 2011

5 answers

168 views

Grid with editable column

Hi,

I want to have a grid with five columns, where I need only one of the column data to be editable. Any directions would be very much appreciated.

Regards,
Vijay

Grid

answered on 16 Mar 2011

6 answers

538 views

RadDatePicker OnDateSelected e.get_newDate() doesn't work

Hi there, title says it all I'm calling the OnDateSelected(sender,e) and trying to use the e.get_newDate() just like your demo and it doesn't return anything. I need to get the date selected or being selected is there something I'm missing? Thanks.

Calendar

answered on 16 Mar 2011

3 answers

87 views

loading message & Preformance in Releated combo boxes

Hi

I am Using 6 Releated Combo boxes

Loading Message
all these comboxes are showing loading message with previous valus and im able to select previos value when loading message is shown
even in the demo in the below link its showing both loading message and Previos select values
http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/multiplecomboboxes/defaultcs.aspx

while showing Loading message i should not show Previous values

Performance
Ifi select the value in first combo box and click search button its taking 10 secs to fire
if i select 5or6 drop down combo box and click search button its taking 2 secs
Why such a huge difference in preformance

Please help me fixing these two issues ASAP

Thanks
Harin

General Discussions

answered on 16 Mar 2011

2 answers

155 views

Ajaxified multicolumn Combobox with checkbox fires a full refresh on checkbox click

Hi,

I am currently using the Q3 2010 NET40 version of the ajax controls, and I am trying ot have a multi column combobox with checkboxes fire off an ajax request to refresh a grid on the same page. But no matter what I do, when I click on the checkbox, a full page refresh is fired, making it impossible for the user to click on multiple checkboxes. I already did everything that was recommended by the below support link - although am not sure if its still applicable to this version.

http://www.telerik.com/help/aspnet-ajax/troubleshooting-ajaxified-control-item-template-full-postback.html

I built a separate page with almost no code behind just to simulate the issue, with a datasource that brings data from my database. The code is as below

I am currently developing for one of your clients, and I can get the support details if need be. Please advise how I can ajaxify the checkbox, multi column combobox. Your early response would be highly appreciated.

Thank you.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ManageData.aspx.cs" Inherits="MasterDataManagementSystem.ManageData" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head runat="server">

<title></title>

<style type="text/css">

.rcbHeader ul,

.rcbFooter ul,

.rcbItem ul, .rcbHovered ul, .rcbDisabled ul

{

width: 100%;

display: inline-block;

margin: 1;

padding: 0;

list-style-type: none;

font-family : Verdana;

font-size:8pt;

}

.rcbColumn

{

font-family:Verdana;

font-size:8pt;

float: left;

margin: 1;

line-height: 14px;

padding: 2px 5px 2px 0;

}

.rcbColumn li

{

vertical-align:middle;

}

</style>

</head>

<body>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type="text/javascript">

<!--

function stopPropogation(e) {

e.cancelBubble = true;

if (e.stopPropagation) {

e.stopPropagation();

}

function callAttachDropDown() {

var combo = $find("<%= rcbSourceElement.ClientID %>");

combo.attachDropDown();

}

-->

</script>

</telerik:RadScriptBlock>

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

<div>

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadComboBox1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server"

Skin="Default">

</telerik:RadAjaxLoadingPanel>

<telerik:RadComboBox ID="rcbSourceElement" runat="server"

HighlightTemplatedItems="True" DataTextField="PrimaryFieldValue" AutoPostBack="true"

Width="400px" Height="200px" DataValueField="ELEMENT_VALUE_KEY" DataSourceID="odsSourceElement"

AllowCustomText="True" EmptyMessage="Choose an option here...">

<ItemTemplate>

<div onclick="stopPropagation(event)">

<asp:CheckBox ID="chkSourceElementValue" runat="server" AutoPostBack="true" onclick="callAttachDropDown()" Text='<%# Eval("PrimaryFieldValue") %>'

oncheckedchanged="chkSourceElementValue_CheckedChanged"/>

</div>

</ItemTemplate>

</telerik:RadComboBox>

<asp:ObjectDataSource ID="odsSourceElement" runat="server"

SelectMethod="GetSourceElementValuesForDisplayInSubjectTab"

TypeName="MasterDataMgmt.BL.Helper">

<SelectParameters>

<asp:Parameter Name="TargetSubjectKey" DefaultValue="1" Type="Int32" />

</SelectParameters>

</asp:ObjectDataSource>

<telerik:RadGrid ID="RadGrid1" runat="server">

</telerik:RadGrid>

</div>

</form>

</body>

</html>

Thank you.

ComboBox

answered on 16 Mar 2011

2 answers

82 views

Getting JS error while selecting number fields for displaying in Rad Grid with Filter option to true.

Hi @

I am using Rad Grid with Auto Generate Columns to true.

I am getting the following error when I select a Numeric field to be displayed. I have set the Allow Filter option to true.

Since I am getting this JS error my UI disrupts completely.

Microsoft JScript runtime error: Sys.ArgumentException: Value must not be null for Controls and Behaviors.

If I set this Allow Filter option to false then I don't get this error.

Please let me know how to get rid of this error.

Grid

answered on 16 Mar 2011

1 answer

208 views

Expand/collapse server side

I have the following RadPanelBar in my page with individual the items bound programatically server-side to their respective datasources.

<telerik:RadPanelBar ID="rpbHomePanel" runat="server" ExpandMode="MultipleExpandedItems"

Height="100%" PersistStateInCookie="true">

<items>

<telerik:RadPanelItem runat="server" Text="My People" Expanded="true" ChildGroupHeight="250px" Value="MyPeople"

PostBack="true">

<ContentTemplate>

<asp:UpdatePanel ID="updMyPeople" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc1:ucMyPeople ID="ucMyPeople" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem runat="server" Text="My Dealers" ChildGroupHeight="250px" Value="MyDealers">

<ContentTemplate>

<asp:UpdatePanel ID="updMyDealers" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc2:ucMyDealers ID="ucMyDealers" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

<telerik:RadPanelItem runat="server" Text="My Alerts" ChildGroupHeight="250px" Value="MyAlerts">

<ContentTemplate>

<asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">

<ContentTemplate>

<uc1:ucMyAlerts ID="ucMyAlerts" runat="server" />

</ContentTemplate>

</asp:UpdatePanel>

</ContentTemplate>

</telerik:RadPanelItem>

</items>

</telerik:RadPanelBar>

I also have the following code in an event handler to iterate through the items to expand/collapse the items based on certain conditions

protected void ucMyPeople_OnDataChanged(String name)

{

foreach (RadPanelItem rpi in rpbHomePanel.Items)

{

if (name == "D")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = true;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = false;

}

if (name == "P")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = true;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = false;

}

if (name == "A")

{

if (rpi.Value == "MyPeople")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyDealers")

{

rpi.Expanded = false;

}

if (rpi.Value == "MyAlerts")

{

rpi.Expanded = true;

}

None of this is working. Only the top item is ever expanded – the others remain collapsed no matter whether I set expand to true or not. I have even tried setting the second item up with Expanded=”true” in the page declaration. Still no joy.

Can you suggest what I might be dong wrong please?

PanelBar

answered on 16 Mar 2011