Questions on UI for ASP.NET AJAX Forum

3 answers

197 views

I followed the .NET 3.5 - LinqToSql Manual CRUD Operations to implement a quick add/update functionality to my manual Manager Screen. The example uses NumericTextBoxSetting to show how validation is being handled etc. My requirement has mostly to do with text and phone numbers with RegExp patterns.

What happens is that in runtime, if there is invalid data in fileds, the scree just flickers. No error/empty messages appear. No icon appears.

Also, I have one GridDropDownColumn. How am I to extract its value while Inserting or updating?

The RadGrid and it's RadInputManager:

<fieldset id="fieldGrid" style="width: 870px">

<legend>Managers</legend>

<telerik:RadGrid ID="RadGridManagers" runat="server" AutoGenerateColumns="False" AllowPaging="True" GridLines="None" Width="100%" Skin="Office2007" SkinID="RadGrid_UnPageable" PageSize="20" OnNeedDataSource="RadGridManagers_NeedDataSource" OnItemCreated="RadGridManagers_ItemCreated" OnInsertCommand="RadGridManagers_InsertCommand" OnUpdateCommand="RadGridManagers_UpdateCommand" DataSourceID="LinqDataSourceManagers">

<MasterTableView AutoGenerateColumns="False" CommandItemDisplay="Top" Width="100%" DataSourceID="LinqDataSourceManagers" DataKeyNames="OID" InsertItemPageIndexAction="ShowItemOnCurrentPage">

<Columns>

<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="ColumnEditCommand" ItemStyle-CssClass="MyImageButton" />

<telerik:GridBoundColumn DataField="FirstName" HeaderText="First Name" UniqueName="ColumnFirstName" Visible="false" />

<telerik:GridBoundColumn DataField="LastName" HeaderText="Last Name" UniqueName="ColumnLastName" Visible="false" />

<telerik:GridTemplateColumn HeaderText="Name" UniqueName="columnName" ReadOnly="true">

<ItemTemplate>

<%# string.Format("{0} {1}", Eval("FirstName"), Eval("LastName"))%>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn DataField="NickName" HeaderText="Nick Name" UniqueName="ColumnNickName" />

<telerik:GridDropDownColumn DataField="OID" HeaderText="Pharmacy" UniqueName="ColumnPharmacy" DataSourceID="LinqDataSourcePharmacies" ListValueField="OID" ListTextField="Name" ColumnEditorID="GridDropDownColumnEditorPharmacy" />

<telerik:GridBoundColumn DataField="PhoneNumber" HeaderText="Phone #" UniqueName="ColumnPhoneNumber" />

<telerik:GridBoundColumn DataField="MobileNumber" HeaderText="Mobile #" UniqueName="ColumnMobileNumber" />

<telerik:GridBoundColumn DataField="Email" HeaderText="Email Address" UniqueName="ColumnEmail" />

<%--

<telerik:GridButtonColumn ConfirmText="Delete this manager?" ConfirmDialogType="RadWindow" ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete" UniqueName="ColumnDelete">

<ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />

</telerik:GridButtonColumn>

--%>

</Columns>

<EditFormSettings CaptionDataField="FirstName" CaptionFormatString="Edit Manager {0}">

<EditColumn ButtonType="ImageButton" UniqueName="ColumnEditCommandE" />

<FormTableItemStyle Wrap="False" />

<FormCaptionStyle CssClass="EditFormHeader" />

<FormMainTableStyle GridLines="None" CellSpacing="0" CellPadding="3" BackColor="White" Width="100%" />

<FormTableStyle CellSpacing="0" CellPadding="2" Height="110px" BackColor="White" />

<FormTableAlternatingItemStyle Wrap="False" />

<FormTableButtonRowStyle />

</EditFormSettings>

<CommandItemSettings ShowRefreshButton="true" ShowAddNewRecordButton="true" ShowExportToWordButton="false" ShowExportToExcelButton="true" ShowExportToPdfButton="true" ShowExportToCsvButton="true" />

<PagerStyle AlwaysVisible="true" Mode="NextPrevAndNumeric" Position="Bottom" />

</MasterTableView>

<ClientSettings>

<ClientEvents OnRowDblClick="RadGridManagers_OnRowDblClick" />

<Scrolling UseStaticHeaders="True" />

</ClientSettings>

<ExportSettings HideStructureColumns="false" FileName="PharmacyManagers" IgnorePaging="True">

<Excel Format="ExcelML" />

<Csv ColumnDelimiter="VerticalBar" />

</ExportSettings>

</telerik:RadGrid>

<telerik:GridDropDownListColumnEditor ID="GridDropDownColumnEditorPharmacy" runat="server" DropDownStyle-Width="228px" />

<telerik:RadInputManager runat="server" ID="RadInputManagerManagers" Enabled="true">

<telerik:TextBoxSetting BehaviorID="TextBoxSettingNameFirst" EmptyMessage="Please enter a first name" />

<telerik:TextBoxSetting BehaviorID="TextBoxSettingNameLast" EmptyMessage="Please enter a last name" />

<telerik:TextBoxSetting BehaviorID="TextBoxSettingNameNick" EmptyMessage="Please enter a nick name" />

<telerik:RegExpTextBoxSetting BehaviorID="RegExpTextBoxSettingPhone" ErrorMessage="Invalid U.K. Phone Number" ValidationExpression=

"^(((\+44\s?\d{4}|\(?0\d{4}\)?)\s?\d{3}\s?\d{3})|((\+44\s?\d{3}|\(?0\d{3}\)?)\s?\d{3}\s?\d{4})|((\+44\s?\d{2}|\(?0\d{2}\)?)\s?\d{4}\s?\d{4}))(\s?\#(\d{4}|\d{3}))?$ "

/>

<telerik:RegExpTextBoxSetting BehaviorID="RegExpTextBoxSettingMobile" ErrorMessage="Invalid U.K. Mobile Number" ValidationExpression="^(\+44\s?7\d{3}|$?07\d{3}$?)\s?\d{3}\s?\d{3}$" />

<telerik:RegExpTextBoxSetting BehaviorID="RegExpTextBoxSettingEmail" ErrorMessage="Enter a valid email address" ValidationExpression=

"^(([\\w-]+\\.)+[\\w-]+|([a-zA-Z]{1}|[\\w-]{2,}))@((([0-1]?[0-9]{1,2}|25[0-5]|2[0-4][0-9])\\.([0-1]?[0-9]{1,2}|25[0-5]|2[0-4][0-9])\\.([0-1]?[0-9]{1,2}|25[0-5]|2[0-4][0-9])\\.([0-1]?[0-9]{1,2}|25[0-5]|2[0-4][0-9])){1}|([a-zA-Z]+[\\w-]+\\.)+[a-zA-Z]{2,4})$"

/>

</telerik:RadInputManager>

</fieldset>

The code-behind relating to the InputManager:

private void ShowErrorMessage() {

RadAjaxManager manager = RadAjaxManager.GetCurrent(this.Page);

manager.ResponseScripts.Add("window.radalert(\"Please enter valid data!\")");

}

private void SetupInputManager(GridEditableItem editableItem) {

InputSetting inputSetting;

// style first name

var textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnFirstName")).TextBoxControl;

textBox.ID = "TextBoxFirstName";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("TextBoxSettingNameFirst");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

inputSetting.Validation.IsRequired = true;

// style last name

textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnLastName")).TextBoxControl;

textBox.ID = "TextBoxLastName";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("TextBoxSettingNameLast");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

inputSetting.Validation.IsRequired = true;

// style nick name

textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnNickName")).TextBoxControl;

textBox.ID = "TextBoxNickName";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("TextBoxSettingNameNick");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

// style phone number

textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnPhoneNumber")).TextBoxControl;

textBox.ID = "TextBoxPhoneNumber";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("RegExpTextBoxSettingPhone");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

// style mobile number

textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnMobileNumber")).TextBoxControl;

textBox.ID = "TextBoxMobileNumber";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("RegExpTextBoxSettingMobile");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

// style email

textBox = ((GridTextBoxColumnEditor)editableItem.EditManager.GetColumnEditor("ColumnMobileNumber")).TextBoxControl;

textBox.ID = "TextBoxEmail";

inputSetting = RadInputManagerManagers.GetSettingByBehaviorID("RegExpTextBoxSettingEmail");

inputSetting.InitializeOnClient = true;

inputSetting.TargetControls.Add(new TargetInput(textBox.UniqueID, true));

}

The code-behind relating to the RadGrid:

#region Grid Related

protected void RadGridManagers_NeedDataSource(object source, GridNeedDataSourceEventArgs e) {

RadGridManagers.DataSource = LinqDataSourceManagers;

}

protected void RadGridManagers_ItemCreated(object sender, GridItemEventArgs e) {

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

GridEditableItem editableItem = (GridEditableItem)e.Item;

SetupInputManager(editableItem);

}

protected void RadGridManagers_UpdateCommand(object source, GridCommandEventArgs e) {

var editableItem = ((GridEditableItem)e.Item);

var editManagerID = (long)editableItem.GetDataKeyValue("OID");

//retrieve entity form the Db

var editManager = DbContext.Managers.Where(maan => maan.OID == editManagerID).FirstOrDefault();

if (editManager != null) {

try {

//update entity's state

editableItem.UpdateValues(editManager);

//submit changes to Db

DbContext.SubmitChanges();

} catch (Exception) {

ShowErrorMessage();

}

protected void RadGridManagers_InsertCommand(object source, GridCommandEventArgs e) {

var editableItem = ((GridEditableItem)e.Item);

//extract properties

Hashtable values = new Hashtable( );

editableItem.ExtractValues(values);

//create new entity

Manager newManager = new Manager() {

FirstName = (string)values["FirstName"] ?? String.Empty,

LastName = (string)values["LastName"] ?? String.Empty,

NickName = (string)values["NickName"] ?? String.Empty,

PhoneNumber = (string)values["PhoneNumber"] ?? String.Empty,

MobileNumber = (string)values["MobileNumber"] ?? String.Empty,

Email = (string)values["Email"] ?? String.Empty

};

DbContext.Managers.InsertOnSubmit(newManager);

try {

//submit changes to Db

DbContext.SubmitChanges();

} catch (Exception) {

ShowErrorMessage();

}

#endregion

I'm missing something here right? Have I hooked up everything right? This is a Content Page and the ShowErrorMessage() first traces-out the parent's WindowManager.

Any pointer please... this was suppose to be a simple screen and I have like 7 others to do today. Thank you.

*EDIT*

Also, using Firefox + FireBug, I see a warning whenever I interact with the grid I mentioned above. Attached.

Input

answered on 10 Nov 2010

1 answer

92 views

[Solved] Keep trailing zero with Radinputmanager during ajax call

Hi,

I'm using RadinputManager in Radgrid.
During grid postback, trailing decimal zero are removed and reappear after.
Is there a way to keep them ?

thanks.

Input

answered on 10 Nov 2010

3 answers

375 views

Want Rad Confirm on Selected Item Changed

Hello i have one combox i want to gives the confirm message "Are you sure you wnt to select ?" when the user selected or changed the item how to do using selected index changes in rad combox ?

urgentttt

ComboBox

answered on 10 Nov 2010

3 answers

62 views

[Solved] MultiDayView between DayView and the WeekView

I have to put the MultiDayView between DayView and WeekView.
For to make sense had to be between DayView WeekView and not the last.

Scheduler

answered on 10 Nov 2010

1 answer

93 views

No dataformatstring for GridDropDownColumn?

Can someone please confirm that the GridDropDownColumn doesnt have a dataformatstring property. If it doesnt, can one be implemented without messing up the grid editing/inserting? If it matters, I am trying to use "<div class="xxxxxx">{0}</div>".

Additionally, I have temporarily created a TemplateColumn with a radcombobox. When using the radgrid automatic updates, everything updates correctly except for the combobox values which dont appear to do anything. When in edit mode, the combobox displays as it should with the correct selectedvalue. Should I be using a controlparameter with my sqldatasource, because a regular parameter is having no effect?

Thanks for any help with my problems above.

Joshua Zimmerman

Grid

answered on 10 Nov 2010

1 answer

97 views

[Solved] Server side event before Upload

Hi,

Is there a way to execute server-side code before the upload starts or have I to call a webmethod from OnClientProgressUpdating?

Upload (Obsolete)

answered on 10 Nov 2010

3 answers

344 views

set visible true on button click

hi,
how can i set visible footer true inside rad grid on click of button that is outside from rad grid.
thanks

Grid

answered on 10 Nov 2010

3 answers

78 views

Are these bugs fixed yet?????

'Cursor jumps to top of the text edito' (http://www.telerik.com/community/forums/sharepoint-2007/full-featured-editor/cursor-jumps-to-top-of-the-text-edito.aspx)

and 'Upgrade messes up html' (http://www.telerik.com/community/forums/aspnet-ajax/editor/upgrade-messes-up-html.aspx) middle of page

I am having the same problem and would like to know if this has been fixed. If so we will upgrade our package.

I have a client whose .net app contains the editor complaining about this issue.

Thanks

Editor

answered on 10 Nov 2010

1 answer

93 views

Grid trying to bind to custom Filtering Template column

I'm following the demo for Grid/Filtering Template Columns and am able to create and add my custom filter column (with a dropdownlist for selecting the value) but when the bind occurs on the grid I am getting an error that indicates that the grid is attempting to bind data to the row containing the filtering control.

My FilteringTemplateColumn is almost exactly the same as in the demo, except for how the droplist is populated. I'm using a generic dictionary to populate the droplist. There error I am receiving is

Object of type System.Collections.Generic.KeyValuePair`2[System.String,System.String] does not have a CreatedBy.ID property.

CreatedBy.ID is the DataField property for my custom filtering template column and is also used in the template in a label control via an Eval("CreatedBy.ID")

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

<div>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

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

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="FilterableRadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="FilterableRadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManagerProxy>

<telerik:RadGrid ID="FilterableRadGrid1" Width="97%" runat="server" GridLines="None" AllowFilteringByColumn="True" AutoGenerateColumns="False">

<MasterTableView AllowFilteringByColumn="true" TableLayout="Fixed">

<Columns>

<telerik:GridBoundColumn DataField="Created" HeaderText="Created" UniqueName="column"

AllowFiltering="true">

</telerik:GridBoundColumn>

<cc1:SICustomFilteringDropListColumn FilterControlWidth="180px" HeaderText="Created By"

FilterField="CreatedBy.ID" DataField="CreatedBy.ID">

<ItemTemplate>

<asp:Label ID="lblCreatedBy" runat="server"><%# Eval("CreatedBy.ID")%></asp:Label>

</ItemTemplate>

</cc1:SICustomFilteringDropListColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

</div>

</form>

I'm sure I'm missing something simple. Thank you for your help.

Sean M. Severson

Grid

answered on 10 Nov 2010

3 answers

400 views

[Solved] radtreeview set image size

hi,

i searched the online help and the forum, but i couldn't find a way to help me with image size.

i set the image url for every Treenode, but i don't know how to limit the size / set the size of the treenode's image.

it should scare down the image's size to like 16px x 16px.

thanks Mario

TreeView

answered on 10 Nov 2010