Questions on UI for ASP.NET AJAX Forum

1 answer

82 views

Filter RadGridTemplateColumn contains RadGridList

I have a Telerik Grid contains a template column, this column holds a RadGridList and receives its data from StringCollection, this means that I have a column with multiple values.

I'm trying to filter this column using a combobox, I can filter such columns but with only single data, but how to filter a column contains multiple data represented by StringCollection?

I Usually use this way to filter columns

<telerik:GridBoundColumn DataField="ExperienceLevel" HeaderButtonType="TextButton" HeaderText="Experience Level" SortExpression="ExperienceLevel" UniqueName="ExperienceLevel">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboBoxExperienceLevel" runat="server" AppendDataBoundItems="true" DataSourceID="SqlDataSourceExperienceLevel" DataTextField="englishName" DataValueField="ExperienceLevelID" DropDownWidth="150" OnClientSelectedIndexChanged="ExperienceLevelIndexChanged" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("ExperienceLevel").CurrentFilterValue %>' Width="100">

<Items>

<telerik:RadComboBoxItem Text="All" Value="" />

</Items>

</telerik:RadComboBox>

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

<script type="text/javascript">

function ExperienceLevelIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("ExperienceLevel", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

Grid

answered on 06 Dec 2012

1 answer

38 views

BUG: Multiple GridNumericColumns can't use the same ColumnEditor

Team Telerik,

I think I have discovered a bug.

Recreation Steps:

Ensure that AJAX is turned OFF.
In any given RadGrid, create two or more GridNumericColumns.
Drag a GridNumericColumnEditor to the design surface and configure it however you want.
Set all of the GridNumericColumns in the RadGrid to use the GridNumericColumnEditor above as their "ColumnEditorID" property.
Run the form and try to insert a new record. You'll get an error that says "The property is outside the range of valid values".

Background:

I am building a page that uses several numeric columns that should all be formatted in exactly the same way. So logically, I drag one GridNumericColumnEditor to the design surface, set its properties there, and then set all of the GridNumericColumns that should be formatted that way to use that column editor. Obviously, this doesn't work, even though you can do this with other ColumnEditors for other column types.

Workaround:

Use a different GridNumericColumnEditor for each of the GridNumericColumns - even if they're all to be formatted in exactly the same way. Clearly, this isn't very efficient, but it'll have to do for now until you guys can address this.

Telerik Version: 2012.3.1016.40 (2012 Q3)

Thanks in advance for your kind attention to this matter - and keep up the great work, you guys.

Regards,
Jonathan

Grid

answered on 06 Dec 2012

1 answer

120 views

RadListView Ajax Button not Working When Filtered by RadComboBox

hello
i have 4 main control, a radcombobox, radlistview with a asp button, and a label, i want to filter radlistview data by radcombobox selected value,( i do it without problem), and after click on asp button in radlistview, that return datakey with button commandargument value to label, but my problem is after click on asp button, label show nothing.
RadComboBox code:
aspx:

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

AutoPostBack="true" Label="City :" Skin="Default" />

cs:

protected void LoadCities()

{

SqlConnection connection = new SqlConnection(

ConfigurationManager.ConnectionStrings["SiteSqlServer1"].ConnectionString);

SqlDataAdapter adapter = new SqlDataAdapter(@"", connection);

DataTable dt = new DataTable();

adapter.Fill(dt);

CityDDL.DataTextField = "Name";

CityDDL.DataValueField = "ID";

CityDDL.DataSource = dt;

CityDDL.DataBind();

// Insert the first item.

CityDDL.Items.Insert(0, new RadComboBoxItem("- Select City -"));

}

RadListView Code:
aspx:

<telerik:RadListView ID="RadListView1" runat="server" DataSourceID="SqlDataSource1"

ItemPlaceholderID="ListViewContainer" AllowPaging="True" PageSize="12"

onprerender="RadListView1_PreRender">

<LayoutTemplate>

<asp:PlaceHolder runat="server" id="ListViewContainer" />

</LayoutTemplate>

<ItemTemplate>

<fieldset style="float: left; width: 266px; height: 260px;">

<legend><b>State Name:</b>: <%#Eval("Name")%></legend>

<div class="details">

<asp:Button ID="SelectStateID" OnClick="SelectStateID_Click"



CommandArgument='<%# Eval("ID") %>' runat="server" Text="Select State"  />

<div class="data-container">

<ul>

<li>

<label>

State Code:

<%#Eval("Code")%>

</li>

</ul>

</div>

</fieldset>

</ItemTemplate>

</telerik:RadListView>

cs:

protected void RadListView1_PreRender(object sender, EventArgs e)

{

foreach (RadListViewItem item in RadListView1.Items)

{

Button lnk = item.FindControl("SelectStateID") as Button;

RadAjaxManager1.AjaxSettings.AddAjaxSetting(lnk, Label1);

}

ASP Button Code:
cs:

protected void SelectStateID_Click(object sender, EventArgs e)

{

var argument = ((Button)sender).CommandArgument;

Label1.Text = argument.ToString();

}

RadAjaxManager Code:
aspx:

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="CityDDL" EventName="SelectedIndexChanged">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadListView1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="SelectStateID" EventName="SelectStateID_Click">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="Label1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">

<asp:Image ID="Image1" runat="server" ImageUrl="~/images/WebResource.axd.gif" AlternateText="Loading..." />

</telerik:RadAjaxLoadingPanel>

ASP Label:
aspx:

<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>



please help me.

thanks

ListView

answered on 06 Dec 2012

5 answers

542 views

"Add New Item" option in Grid

Hi,

I installed the "RadControls for ASP.NET AJAX Q3 2012". I am using sharepoint 2010. I added the Rad grid in the visual webpart and bound the columns. I used the below code:

<telerik:RadGrid ID="RadGrid1" runat="server" Visible="true" ShowHeader="true" ShowFooter="true" >

<MasterTableView DataKeyNames="Title" AutoGenerateColumns="false">

<Columns>

<telerik:GridBoundColumn DataField="Title" HeaderText="Product Number" UniqueName="ProductNumber">

</telerik:GridBoundColumn>

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

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

I am able to bind the existing data in the databind code using c#. Few questions:
1) How to insert new data?
2) Also above the header and below the footer, is it possible to add a option as "Add new item" clicking on this, the textbox within the grid become editable?
3) Limit the number of items which can be added in the grid to 5.

How to achieve this?
Thanks

Grid

answered on 06 Dec 2012

1 answer

77 views

ContextMenu not visible after OnAjaxRequest

Hi,

I am attaching a Contextmenu to Listview. This is 2 level composite Context menu (contextmenu.jpg). Below is my source for building Contextmenu

<telerik:RadContextMenu ID="RadMenu1" runat="server" EnableRoundedCorners="true" EnableShadows="true" OnClientShowing="LoadContextMenu">

<Items>

<telerik:RadMenuItem Text="Accounting">

<Items>

<telerik:RadMenuItem Text="Sub Menu">

<ItemTemplate>

<telerik:RadTextBox ID="txtDecimal" Text="2" Label="Decimals" runat="server" Width="70px"

MaxLength="2">

</telerik:RadTextBox>

<telerik:RadListBox ID="rlbcm1" runat="server" CheckBoxes="true">

<Items>

<telerik:RadListBoxItem Text="Include Commas" Value="Include Commas" />

<telerik:RadListBoxItem Text="Include $ Sign" Value="Include $ Sign" />

</Items>

</telerik:RadListBox>

<b>Negative Number</b>

<asp:RadioButtonList ID="rbNegativeNumber" runat="server" RepeatDirection="Vertical">

<asp:ListItem Text="Use Brackets" Value="1"></asp:ListItem>

<asp:ListItem Text="Use Negative Number" Value="2"></asp:ListItem>

</asp:RadioButtonList>

</ItemTemplate>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Date">

<Items>

<telerik:RadMenuItem Text="Sub Menu">

<ItemTemplate>

<asp:RadioButtonList ID="rbDateFormat" runat="server" RepeatDirection="Vertical">

<asp:ListItem Text="01/05/2012" Value="1"></asp:ListItem>

<asp:ListItem Text="Jan 05, 2012" Value="2"></asp:ListItem>

<asp:ListItem Text="2012-01-05" Value="3"></asp:ListItem>

<asp:ListItem Text="Custom" Value="4"></asp:ListItem>

</asp:RadioButtonList>

</ItemTemplate>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Percentage">

<Items>

<telerik:RadMenuItem Text="Sub Menu">

<ItemTemplate>

<telerik:RadTextBox ID="txtPercentageDecimal" Text="2" Label="Decimals" runat="server"

Width="70px" MaxLength="2">

</telerik:RadTextBox>

<telerik:RadListBox ID="rlbpercentage" runat="server" CheckBoxes="true">

<Items>

<telerik:RadListBoxItem Text="% symbol" Value="% symbol" />

</Items>

</telerik:RadListBox>

</ItemTemplate>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenuItem>

<telerik:RadMenuItem Text="Text">

<Items>

<telerik:RadMenuItem Text="Sub Menu">

<ItemTemplate>

<asp:RadioButtonList ID="rbText" runat="server" RepeatDirection="Vertical">

<asp:ListItem Text="Case as input" Value="1"></asp:ListItem>

<asp:ListItem Text="All Caps" Value="2"></asp:ListItem>

</asp:RadioButtonList>

</ItemTemplate>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenuItem>

</Items>

</telerik:RadContextMenu>

</div>

<telerik:RadAjaxManager ID="RadAjaxManager" runat="server" OnAjaxRequest="RadAjaxManager_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadAjaxManager">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadMenu1" LoadingPanelID="RadAjaxLoadingPanel" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel" runat="server" Skin="Vista">

</telerik:RadAjaxLoadingPanel>

As you can see I have composite contextmenu which contains various server controls inside it (i.e Textbox, Listbox, Radiobutton).

Now I want to populate these contextmenu control with the dynamic values based on right clicked listview item. So for that I am performing an OnAjaxRequest=

"RadAjaxManager_AjaxRequest" request on OnClientShowing="LoadContextMenu" client event of Contextmenu.

Now the issue is that OnClientShowing event it is going to RadAjaxManager_AjaxRequest server request & performing all the server side update on context menu.
But the contextmenu is not repainted at clientside. i.e After server side processing, it is not showing on browser.

function LoadContextMenu(menu, args) {

if (listItemIndex) {

InitiateAsyncRequest(listItemIndex);

}

function InitiateAsyncRequest(argument) {

var ajaxManager = $find("<%= RadAjaxManager.ClientID %>");

ajaxManager.ajaxRequest(argument);

return false;

}

Can you please help me how to reshow / repaint the contextmenu after AjaxRequest is performed.

Menu

answered on 06 Dec 2012

3 answers

230 views

Problem creating Radgrid GridTemplateColumn dynamically

Hello,

I am facing lot of problem creating GridTemplateColumn dynamically, i tried it using implementing ITemplate interface but was not successful.

I have other columns too in grid, which i create dynamically and do databinding also dynamically which works perfect,

Please can someone help me through this, its urgent.

Thanks in advance!

with regards,
Peeyush pandey

<telerik:GridTemplateColumn AllowFiltering="False" UniqueName="columnAction" >

<HeaderStyle Width="30px" />

<HeaderTemplate>

<asp:Label ID="lblHeaderAction" runat="server" Text="Action"></asp:Label>

</HeaderTemplate>

<ItemTemplate>

<asp:Panel ID="editButtonPanel" runat="server" CssClass="custom-Action-column" Width="50px">

<asp:ImageButton ID="TagCloudButton" runat="server" Width="15px"

Height="15px" CommandName="TagCloud" CausesValidation="False" ImageUrl="~/images/icon_grid.gif" />

</asp:Panel>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn AllowFiltering="False" UniqueName="ProfileImage" >

<HeaderStyle Width="50px" />

<HeaderTemplate>

<asp:Label ID="lblHeaderActionImage" runat="server" Text="Image"></asp:Label>

</HeaderTemplate>

<ItemTemplate>

<asp:Panel ID="ImagePanelPos" runat="server" CssClass="custom-Action-column" Width="50px">

<asp:Image ID="Image1" runat="server" Height="35px" Width="35px" ImageUrl='<%#Convert.ToString(Eval("Url")) %>' />

</asp:Panel>

</ItemTemplate>

</telerik:GridTemplateColumn>

Grid

answered on 06 Dec 2012

1 answer

136 views

RadListBox header Templet from Server side

How to access RadListBox header Templet elements in server side and in ItemDataBound?

ListBox

answered on 06 Dec 2012

3 answers

81 views

Setting multiple ListTextField values to a GridDropDownColumn in RadGrid View mode (NOT in RadGrid Edit mode)

Hello,

i have a GridDropDownColumn connected to a DataSource and i get an error when i try to set the ListTextField property like this: ListTextField = "Field1, Field2". How can i achieve this programmatically in radgrid view mode?

I have written the following code to achieve this in radgrid edit mode:

if (e.Item is GridEditableItem && e.Item.IsInEditMode)

{

GridEditableItem editItem = (GridEditableItem)e.Item;

RadComboBox combo = (RadComboBox)editItem["Field1"].Controls[0];

combo.ItemDataBound += new RadComboBoxItemEventHandler(combo_ItemDataBound);

}

void combo_ItemDataBound(object sender, RadComboBoxItemEventArgs e)

{

RadComboBoxItem item = (RadComboBoxItem)e.Item;

DataRowView dr = (DataRowView)e.Item.DataItem;

item.Text = item.Text + " ( " + dr["Field2"].ToString() + " " + dr["Field3"].ToString() + " ) ";

}

Thank you very much.

Grid

answered on 06 Dec 2012

1 answer

112 views

Missing PageSizeComboBox.

Hi

I have inherited a site with a lot of Telerik components, and I'm having trouble with adding a PageSizeComboBox to a RadGrid.

For some reason the ComboBox doesn't show. How can I get it to show itself?

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

OnPreRender="ListView_RadGrid_OnPreRender"

EnableViewState="True"

GridLines="None"

TabIndex="5"

AllowPaging="True"

AllowSorting="True"

OnSortCommand="ListView_RadGrid_SortCommand"

OnDataBound="ListView_RadGrid_DataBound"

OnDataBinding="ListView_RadGrid_DataBinding"

OnPageIndexChanged="ListView_RadGrid_PageIndexChanged"

OnNeedDataSource="ListView_RadGrid_OnNeedDataSource"

OnRowDrop="ListView_RadGrid_OnRowDrop"

AllowMultiRowSelection="True"

ShowDesignTimeSmartTagMessage="True"

AllowCustomPaging="True"

OnPageSizeChanged="ListView_RadGrid_PageSizeChanged"

>

<PagerStyle Mode="NextPrevNumericAndAdvanced" Position="TopAndBottom" ShowPagerText="True" AlwaysVisible="True" />

<MasterTableView ShowHeader="true" AllowMultiColumnSorting="false" AutoGenerateColumns="False"

EnableViewState="False" ClientDataKeyNames="ObjectId,Status" DataKeyNames="ObjectId" >

<CommandItemSettings ExportToPdfText="Export to Pdf" />

</MasterTableView>

</telerik:RadGrid>

Grid

answered on 06 Dec 2012

1 answer

130 views

GridDateTimeColumnEditor TextBoxStyle CssClass not applied

Unlike a GridTextBoxColumnEditor (which works), the CssClass on the TextBoxStyle for the GridDateTimeColumnEditor doesn't work - the class isn't applied on the "input" box. Can anyone please confirm?

<telerik:GridDateTimeColumn PickerType="DatePicker" DataField="InstallationDate" FilterControlAltText="Filter Install Date" HeaderText="Install Date" SortExpression="InstallationDate" UniqueName="InstallationDate" ReadOnly="false" AllowFiltering="true" MaxLength="50" ColumnEditorID="gceSmallDateBox">

</telerik:GridDateTimeColumn>

<telerik:GridDateTimeColumnEditor runat="server" ID="gceSmallDateBox">

<TextBoxStyle CssClass="smallTextBox" />

</telerik:GridDateTimeColumnEditor>

Grid