Questions on UI for ASP.NET AJAX Forum

6 answers

115 views

SingleInputRendering and IE8 Compat Mode

So I have a simple RadWindow setup like so:

<telerik:RadWindow ID="rwCreateChecklist" runat="server" Width="300px" Height="150px"

Behaviors="Move,Close" Title="Create Checklist" VisibleStatusbar="false" Modal="true">

<ContentTemplate>

<div class="wndCreateChecklist">

<div class="row">

<label>

Reference Number:</label>

<telerik:RadTextBox ID="txtReferenceNumber" runat="server" Width="80px" MaxLength="50">

</telerik:RadTextBox>

<asp:RequiredFieldValidator ID="reqReferenceNumber" runat="server" Text="Required"

ValidationGroup="CreateChecklist" ControlToValidate="txtReferenceNumber" SkinID="noFloat"></asp:RequiredFieldValidator>

</div>

<div class="button-row">

<telerik:RadButton ID="btnCreateChecklist" runat="server" Text="Create Checklist"

ValidationGroup="CreateChecklist">

</telerik:RadButton>

<telerik:RadButton ID="btnCancel" runat="server" Text="Cancel">

</telerik:RadButton>

</div>

</ContentTemplate>

</telerik:RadWindow>

The issue I'm finding is that the RequiredFieldValidator shows up behind the RadTextBox when viewed in IE8 Compatibility Mode (as shown in attached image). I am using the latest version, so EnableSingleInputRendering is set to true by default.

I've found that the RadTextBox is setting the width of the span element, that the input control is placed in, while applying padding to the input element itself. Why does the control set the width of the span and the input element? When you have this setting turned off, the only element that has it's width set is the input element itself, not the span element.

Is there some reason why both elements have their width property set?

Input

answered on 07 Jun 2012

1 answer

84 views

NumericPager not working but Next/Prev works

I have a RadGrid setup and everything on it works great except for my Numeric Pager. I placed my pager in my PagerTemplate like so:

<asp:Panel runat="server" ID="NumericPagerPlaceHolder" />

And then in my code behind, here is how I set it up:

protected void HandleOnItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridPagerItem)

{

var gridPager = e.Item as GridPagerItem;

var numericPagerControl = gridPager.GetNumericPager();

var placeHolder = gridPager.FindControl("NumericPagerPlaceHolder");

placeHolder.Controls.Add(numericPagerControl);

}

The numeric pager is getting setup properly but when I click on a page number, it does a very fast postback and then the numeric pager disappears completely. I feel like I am missing a step where I should be binding and event. All the Google and forum searches I have done haven't turned anything up. The only thing I found was including this JavaScript:

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

<script type="text/javascript">

var tableView = null;

function pageLoad(sender, args) {

tableView = $find("<%= TransactionsGrid.ClientID %>").get_masterTableView();

}

function changePage(argument) {

tableView.page(argument);

}

</script>

</telerik:RadScriptBlock>

But still nothing. I've even tried setting up an event handler for OnPageIndexChanged but that didn't work either. Any help would be appreciated.

Grid

answered on 07 Jun 2012

1 answer

86 views

Why does Add new record clear but not disappear?

When trying to clear the radgrid, if the edit command is open when clearing it will clear and disappear. When the Add new record control is open, it clears but does not disappear. Is there any reason for why that is, and if so is there anyway to change it so it disappears as well?

Grid

answered on 07 Jun 2012

1 answer

191 views

Sort icon on the left or Always show sort icon when column width is fixed

Hi,
in the grid,
1) is there a way to show the sort icon on the left side of the column header?
2) can the sort icon be always shown (if sorted) even if the column width is set and if the header text exceeding the column width?

Grid

answered on 07 Jun 2012

1 answer

93 views

Cannot put columns into edit mode

I know this should be simple and I have done it before, but for some reason I can't see why this isn't working. I have a very small grid with 3 columns and all I want to do is place one of two columns into edit mode in the PreRender method. If a hidden column in the row is a certain value, I want to place it's corresponding visible column into edit mode and color the first column red. In debug the values are being compared properly and it does hit the line of code that sets the column into edit mode, however it sets both columns into edit mode for every row instead of the just the column that I want it to (even though it doesn't hit the code to set the other column into edit mode it still somehow is set to edit). If both hidden columns are invalid I want to set both visible columns into edit mode. As for coloring the text of the first column red it simply has no effect even thoguh the code is hit.

Can somebody please help me with this it seems like it should be very simple. Thanks!

Private Sub rgC_PreRender(sender As Object, e As System.EventArgs) Handles rgC.PreRender

If Not IsPostBack Then

For Each item As GridItem In rgC.MasterTableView.Items

If (TypeOf item Is GridDataItem) Then

Dim lblEmpId As Label = CType(item.FindControl("lblEmpId"), Label)

Dim lblEmpNo As Label = CType(item.FindControl("lblEmpNo"), Label) 'Contains the null value if invalid

Dim lblJobCode As Label = CType(item.FindControl("lblJobCode"), Label)

Dim lblJobNum As Label = CType(item.FindControl("lblJobNum"), Label) 'Contains the null value if invalid

Dim lblCardId As Label = CType(item.FindControl("lblCardId"), Label)

If (lblEmpNo.Text = "") Then

lblCardId.ForeColor = Drawing.Color.Red

item.Edit = True

End If

If (lblJobCode.Text = "") Then

lblCardId.ForeColor = Drawing.Color.Red

item.Edit = True

End If

Next

rgC.Rebind()

End If

End Sub

Grid

answered on 07 Jun 2012

1 answer

306 views

Is it possible to set multiple RadComboBoxItems as selected in code behind?

I’m using a RadComboBox where a user can select multiple items and save them against a news article.

When the user visits back I need to be able to pre-populate all of the items which were previously saved against the article.

I’m trying to work out how to set multiple items as selected, from what I can see you can only ever set one.

Something like this:

RadComboBoxItem _item1 = new RadComboBoxItem();

_item1.Value = "1";

_item1.Text = "One";

_item1.Selected = true;

RadComboBoxItem _item2 = new RadComboBoxItem();

_item2.Value = "2";

_item2.Text = "Two";

_item2.Selected = true;

RadComboBox _radComboBox = new RadComboBox();

_radComboBox.Items.Add(_item1);

_radComboBox.Items.Add(_item2);

Thank you!!

ComboBox

answered on 07 Jun 2012

1 answer

125 views

Replace Filter text box with a Button in Grid Filtering

Hi All,

I saw this post "Google like Filtering" using RadGrid in the below link.

http://demos.telerik.com/aspnet-ajax/controls/examples/integration/gridandcombo/defaultcs.aspx?product=grid

It's something like filtering with a text box below the Grid's header..

I need to have 5 columns in my grid..For the first 3 columns alone i should have this filtering option. For the 4th and 5th column i should have a button in place of Filter box(TextBox).. On that button click i need to accomplish certain tasks too..

Any idea on how to do this will help me.

Grid

answered on 07 Jun 2012

0 answers

501 views

Setting or Binding From Column Item Template Text/Value To Selected Value In Custom Edit Temple

UPDATE: Decided just to use session variables to track the state and that works.

Hello,
For the past two days I have been having a difficult time with a particular issue related to selecting or binding the selected value in a RadComboBox within a custom grid edit template column that I cannot find examples for exactly and have not been able to get the scenario to work.

Scenario
There is a 100% programmatically created RadGrid where the columns are dynamically created. There is a GridTemplateColumn that can be created with a custom item template and edit template. The item template is relatively simple with just a literal control in it, while the edit template has a RadComboBox. The reason a GridDropDownColumn is not utilized is that the items in the RadComboBox contain localized text based on the user's context/language and this cannot be determined through a DataSourceID. When the user edits a row they see the correct items populated in the RadComboBox for that particular template and column, and the item template reflects their change (e.g. if they selected "Female" from the RadComboBox and save/insert their change they see the text "Female" in the item/non-edit tample). However when they edit a row after inserting the value the RadComboBox does not select the value they previously entered as the selected value.

Issue
The issue is that I cannot seem to find a way to bind the RadComboBox within the EditTemplate's selected value to the matching value from the text/item template. Every time the user clicks edit (the edit mode is PopUp) all the regular column values get set to the same values they were in read/non-edit mode, except the RadComboBox in the custom edit column template.

Maybe in the RadGrid's ItemDataBound event there is a way to get the value from the the label control in the item template and use that to set (or try to find then set) the selected value in the RadComboBox in the edit template? Or maybe i'm missing something crucial to the process.

Links Previously Viewed:
http://www.telerik.com/community/forums/aspnet/grid/radgrid-bind-dropdownlist-after-edit-mode.aspx (I cannot use the DataRowView type code without an exception like 'Unable to cast object of type 'Telerik.Web.UI.GridInsertionObject' to type 'System.Data.DataRowView'.

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

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

{

GridEditableItem editForm = (GridEditableItem)e.Item;

(editForm.FindControl("ddlGridAdjBy") as DropDownList).SelectedValue = ((System.Data.DataRowView)(editForm.DataItem)).Row.ItemArray[1].ToString(); // throws an exception here

}

Many other links and of course http://www.telerik.com/help/aspnet-ajax/grid-programmatic-creation.html.

Code
Please note I utilized the converter at http://converter.telerik.com to convert VB.NET to C# since most people are working in C#. The converter sometimes does not convert things exactly.

protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)

{

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

GridEditFormItem editItem = (GridEditFormItem)e.Item;

RadComboBox dropdownUOM = (RadComboBox)editItem.FindControl("editList");

// This PopulateDropDown works in populating the control with items

//

//For Each item As Something In CollectionThatGetsIterated

// Dim NewListItem As New RadComboBoxItem()

// NewListItem.Text = GetLocalizedText(item.Something1, item.Something2)

// NewListItem.Value = GetValue(item.Value)

// theDropDownControl.Items.Add(NewListItem)

//Next

PopulateDropDown(21, dropdownUOM);

dropdownUOM.DataBind();

}

This is the setup specific to this type of column, assume the column unique name, etc. have already been set.

// This is what sets the item and edit templates.  Since the items in the dropdown are added to the Items collection in a loop vs. against a dataset/collection the ListTextField and ListValueFields are not set.

private void BuildLookupListColumn(string columnName, GridTemplateColumn existingTemplateColumn)

{

existingTemplateColumn.ItemTemplate = new CustomItemTemplate(columnName);

KeyValuePair<string, string> emptyListItem = new KeyValuePair<string, string>("Select", string.Empty);

existingTemplateColumn.EditItemTemplate = new CustomEditTemplate(columnName, emptyListItem);

existingTemplateColumn.ConvertEmptyStringToNull = true;

}

Edit Template:

public class CustomEditTemplate: ITemplate, IBindableTemplate

{

private string _columnName;

private KeyValuePair<string, string> _emptyListItem;

public CustomEditTemplate()

{

}

public CustomEditTemplate(string columnName, KeyValuePair<string, string> emptyListItem)

{

this.ColumnName = columnName;

}

public string ColumnName {

get { return _columnName; }

set { _columnName = value; }

}

public KeyValuePair<string, string> EmptyListItem {

get { return _emptyListItem; }

set { _emptyListItem = value; }

}

public void InstantiateIn(Control container)

{

RadComboBox displayControl = new RadComboBox();

displayControl.ID = "editList";

displayControl.DataBinding += DisplayControl_DataBinding;

container.Controls.Add(displayControl);

}

private void DisplayControl_DataBinding(object sender, EventArgs e)

{

//Dim target As RadComboBox = DirectCast(sender, RadComboBox)

//Dim container As GridEditFormItem = DirectCast(target.NamingContainer, GridEditFormItem)

//Dim displayControl As RadComboBox = DirectCast(sender, RadComboBox)

//'Note: This line below throws a binding error on insert DataBinding: 'Telerik.Web.UI.GridInsertionObject' does not contain a property with the name 'AccountSettings'.

//displayControl.SelectedValue = DataBinder.Eval(container.DataItem, ColumnName).ToString()

//displayControl.SelectedValue = displayControl.SelectedValue

}

public System.Collections.Specialized.IOrderedDictionary ExtractValues(Control container)

{

OrderedDictionary dict = new OrderedDictionary();

string value;

value = (((RadComboBox)((GridEditFormItem)container).FindControl("editList")).SelectedValue);

dict.Add(ColumnName, value);

return dict;

}

Item Template:

public class CustomItemTemplate : ITemplate

{

private string _columnName;

public CustomItemTemplate()

{

}

public CustomItemTemplate(string columnName)

{

this.ColumnName = columnName;

}

public string ColumnName {

get { return _columnName; }

set { _columnName = value; }

}

public void InstantiateIn(Control container)

{

LiteralControl displayControl = new LiteralControl();

displayControl.ID = "litEditList";

displayControl.DataBinding += DisplayControl_DataBinding;

container.Controls.Add(displayControl);

}

private void DisplayControl_DataBinding(object sender, EventArgs e)

{

LiteralControl target = (LiteralControl)sender;

GridDataItem container = (GridDataItem)target.NamingContainer;

target.Text = (DataRowView)container.DataItem(_columnName).ToString();

}

I want to do this without using Session variables. It seems really "hacky" to utilize them to store the drop down/combobox's selected state. Also imagine the case, where there are 20 rows of data in the RadGrid with multiple columns in each row that could be of this EditTemplate type with the dropdons, there are quite a few session variables that would be around just to track the selected state and they'd stick around until session expiration unless they are explicitly removed.

Grid

asked on 07 Jun 2012

0 answers

232 views

Binding RadGrid to Data from Session

Hi,

I am putting DataSource of RadGrid into a Session and when I've to re-bind the RadGrid I want to use the Session. I tried by using the following code.

Binding the RdaGrid for the first time,

var mentors = (dynamicModuleManager.GetDataItems(mentorType)).Where(i => i.Visible == true &&
i.Status == ContentLifecycleStatus.Live &&
(i.GetValue<IList<Guid>>("mentorshipcategories").Any(j => CategoriesChecked.Contains(j)) ||
i.GetValue<IList<Guid>>("industries").Any(j => CategoriesChecked.Contains(j)) ||
i.GetValue<IList<Guid>>("businessstages").Any(j => CategoriesChecked.Contains(j))));

MentorDetailsGrid.DataSource = mentors;
MentorDetailsGrid.DataBind();
Session["TempMentorsResult"] = mentors;

So ultimately mentors variable is of type IQueryable<DynamicContent>.

Now while rebinding the RadGrid, here are the lines used,

MentorDetailsGrid.DataSource= Session["TempMentorsResult"];
MentorDetailsGrid.DataBind(); //At this point I am getting the run-time error

The ObjectScope has already been disposed and it's managed persistent objects can no longer be accessed. The ObjectScope should be disposed at the end of the life cycle of your business logic instance. This can also be done in the Dispose of your ASP page or MVC controller.
Object name: 'OpenAccessRuntime.EnlistableObjectScope'.

Can someone please tell me where I am doing wrong?

Thanks.

General Discussions

asked on 06 Jun 2012

4 answers

126 views

HierarchicalDataTemplate in ASP.NET Treeview?

I'm working on a project for a client, where the app I'm building will serve to edit an XML file consumed by a live application. The application is written in Flash, and quite unstable, so I am kind of stuck with the less than optimal XML setup.

The XML is made up (simplified) like the following:

<MenuItem id="1" label="category1">

<Description>Description for Category 1</Description>

<Image>Image for category 1</Image>

<Item label ="Category1Item1">

<Price>12.99</Price>

<Type>Wood</Type>

<additionalElementsHere />

</Item>

<Item label ="Category1Item2">

<Price>112.99</Price>

<Type>Stone</Type>

<additionalElementsHere />

</Item>

<AdditionalItemsHere />

</MenuItem>

<AdditionMenuITemsHere />

I've been using a Telerik treeview bound to an XMLDataSource to display the data and allow users to interact with it (add/delete nodes, move nodes by means of drag and drop, or copy nodes and the underlying elements). So far, so good.

Now my client would like to know if it is somehow possible to use the <Type> Element of the Item elements as grouping containers.

So currently the treeview looks like this:

category1
--Category1Item1
--Category1Item2

And ideally, it should end up looking like this:

category1
--Wood
----Category1Item1
----Category1Item123
--Stone
----Category1Item2
----Category1Item456

I read up on HierarchicalDataTemnplates, but have not managed to figure out if these work in the ASP.NET controls supplied by Telerik. I would like to try and stick to what I have so far, as many hours of work have already gone into the product so far.

I'd appreciate it if someone could point me in the right direction of how to tackle this particular issue.

Thanks in advance :)

Peter

TreeView

answered on 06 Jun 2012