This is a migrated thread and some comments may be shown as answers.

Using GridDateTimeColumn and GridTextBoxColumnEditor in a RadGrid

9 Answers 389 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Herman Gouw
Top achievements
Rank 1
Herman Gouw asked on 28 Jul 2009, 12:09 PM
Hi,

I have a grid with 3 columns:
Column 1 - an editable GridDateTimeColumn which displays and accepts a date
Column 2 - an editable GridBoundColumn (with GridTextBoxColumnEditor) which displays and accepts a string
Column 3 - a GridEditCommandColumn

In edit mode, I would like to do the following:
Column 1 - to force the user to select the date from the DatePicker only (i.e. to disable the text box)
Column 2 - to restrict the length of the string which can be entered by the user to 60

Can you please show me how to do these?
Can you please also show me how to set the width of the GridTextBoxColumnEditor from the code behind instead of from ASPX?

The web page is available on http://www.gouw.ws/RadGrid

The code is given below:
ASPX
====
<form id="form1" runat="server">
<div>
    <telerik:RadScriptManager ID="radScriptManager" runat="server" />
    <telerik:RadGrid ID="radGrid" AutoGenerateColumns="false" GridLines="Vertical" OnNeedDataSource="radGrid_NeedDataSource" OnUpdateCommand="radGrid_UpdateCommand" runat="server">
        <ClientSettings>
            <Scrolling UseStaticHeaders="true" />
        </ClientSettings>
        <MasterTableView EditMode="InPlace" TableLayout="Fixed">
            <Columns>
                <telerik:GridDateTimeColumn DataField="Date" PickerType="DatePicker" DataFormatString="{0:dd/MM/yyyy}" DataType="System.DateTime" HeaderText="Date" HeaderStyle-HorizontalAlign="Left" HeaderStyle-Width="13%" ItemStyle-HorizontalAlign="Left" UniqueName="Date" />
                <telerik:GridBoundColumn DataField="Description" ColumnEditorID="gridTextBoxColumnEditor" DataType="System.String" HeaderText="Description" HeaderStyle-HorizontalAlign="Left" HeaderStyle-Width="77%" ItemStyle-HorizontalAlign="Left" UniqueName="Description" />
                <telerik:GridEditCommandColumn ButtonType="LinkButton" HeaderStyle-Width="10%" UniqueName="Edit" />
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>

    <telerik:GridTextBoxColumnEditor ID="gridTextBoxColumnEditor" TextBoxStyle-Width="920px" runat="server" />
</div>
</form>

C#
==
public partial class Default : System.Web.UI.Page
{
    private List<Datum> _data = null;

    protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            this._data = (List<Datum>)Session["DATA"];
        }
        else
        {
            this._data = Datum.Load();
            Session["DATA"] = this._data;
        }
    }

    protected void radGrid_NeedDataSource(object source, GridNeedDataSourceEventArgs e)
    {
        this.radGrid.DataSource = this._data;
    }

    protected void radGrid_UpdateCommand(object sender, GridCommandEventArgs e)
    {
        if (e.Item is GridEditableItem && e.Item.IsInEditMode)
        {
            GridEditableItem item = e.Item as GridEditableItem;
            ((Datum)(this._data[item.ItemIndex])).Date = ((RadDatePicker)item["Date"].Controls[0]).SelectedDate.Value.Date;
            ((Datum)(this._data[item.ItemIndex])).Description = ((TextBox)item["Description"].Controls[0]).Text;
        }
    }
}

public class Datum
{
    public DateTime Date { get; set; }
    public string Description { get; set; }

    public Datum(DateTime date, string description)
    {
     Date = date;
     Description = description;
    }

    public static List<Datum> Load()
    {
     List<Datum> data = new List<Datum>();
        data.Add(new Datum(DateTime.Now, "This date is today"));
        data.Add(new Datum(DateTime.Now.AddDays(1), "This date is tomorrow"));
        data.Add(new Datum(DateTime.Now.AddDays(2), "This date is the day after tomorrow"));
        return data;
    }
}

Thanks &  regards,
Herman Gouw
Skype: hermangouw

9 Answers, 1 is accepted

Sort by
0
Tsvetoslav
Telerik team
answered on 31 Jul 2009, 12:01 PM

Hi Herman Gouw,

1. Concerning your first question: You need to attach an event handler to the ItemCreated event of the grid and disable the textbox in the bound column as follows:

if (e.Item.InEditMode && e.Item is GridEditableItem)  
{  
 
 GridEditableItem item = e.Item as GridEditableItem;  
 item["BoundColumnUniqueName"].Controls[0].Enabled = false;  
 
}  
 

2. With regards to the second issue - just set the MasLength property of the bound column to the desired value.

I hope this helps.

Kind regards,

Tsvetoslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Herman Gouw
Top achievements
Rank 1
answered on 01 Aug 2009, 12:08 AM
Hi Tsvetoslav,

Thank you for your reply.

1. I got the following syntax error when trying to compile this.

'System.Web.UI.Control' does not contain a definition for 'Enabled' and no extension method 'Enabled' accepting a first argument of type 'System.Web.UI.Control' could be found (are you missing a using directive or an assembly reference?)

2. This one works.

Thanks & regards,
Herman
0
Princy
Top achievements
Rank 1
answered on 03 Aug 2009, 07:25 AM
Hello Herman,

To disable the textbox for a GridBoundColumn when the grid is in EditMode, you can use the following code:
c#:
 if (e.Item is GridEditableItem && e.Item.IsInEditMode)  
        { 
            GridEditableItem item = (GridEditableItem)e.Item; 
            ((TextBox)item["BoundColumnUniqueName"].Controls[0]).Enabled = false
         } 

Thanks
Princy.
0
Herman Gouw
Top achievements
Rank 1
answered on 03 Aug 2009, 01:42 PM
Hi Princy,

Thank you for your reply.

Now I got the following compilation error message:
Unable to cast object of type 'Telerik.Web.UI.RadDatePicker' to type 'System.Web.UI.WebControls.TextBox'.

Regards,
Herman
0
Herman Gouw
Top achievements
Rank 1
answered on 03 Aug 2009, 01:46 PM
Hi Princy,

I meant to say that I got the following runtime error when I clicked the Edit button:
Unable to cast object of type 'Telerik.Web.UI.RadDatePicker' to type 'System.Web.UI.WebControls.TextBox'.

The web page is available on http://www.gouw.ws/RadGrid

Regards,
Herman

0
Tsvetoslav
Telerik team
answered on 06 Aug 2009, 05:43 AM
Hi Herman,

If you need to disable the box of the bound column you need to cast the first control of the TableCell to a TextBox type. On the other hand, if you should disable the datepicker of the date time column (which evidently is the case given the exception you are getting), you need to cast the control in question to a RadDatePicker type:

    if (e.Item is GridEditableItem && e.Item.IsInEditMode)  
    {  
      GridEditableItem item = e.Item as GridEditableItem;  
 
      ((RadDatePicker)item["DateTimeColumnUniqueName"].Controls[0]).Enabled = false;  
 
    } 


All the best,
Tsvetoslav
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Herman Gouw
Top achievements
Rank 1
answered on 06 Aug 2009, 06:20 AM
Hi Tsvetoslav,

Thank you for your reply.

I just want to disable the box of the bound column and not the DatePicker of the date time column.

The reason being I want to force the user to change the date by using the date picker instead of typing in the new date.

If I use
((TextBox)item["BoundColumnUniqueName"].Controls[0]).Enabled = false
I got the following runtime error:
Unable to cast object of type 'Telerik.Web.UI.RadDatePicker' to type 'System.Web.UI.WebControls.TextBox'.

The web page is available on http://www.gouw.ws/RadGrid

Regards,
Herman
0
Princy
Top achievements
Rank 1
answered on 06 Aug 2009, 09:48 AM
Hello Herman,

You can try out the following code to disable the date input of the RadDatePicker when the DateTime column is in edit mode:
c#:
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e) 
    { 
        if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
        { 
            GridEditableItem item = e.Item as GridEditableItem; 
            RadDatePicker picker = (RadDatePicker)item["Date"].Controls[0]; 
            picker.DateInput.Enabled = false
        }  
    } 

Thanks
Princy.
0
Herman Gouw
Top achievements
Rank 1
answered on 06 Aug 2009, 09:38 PM
Thanks a lot Princy. It works now.

Best regards,
Herman
Tags
General Discussions
Asked by
Herman Gouw
Top achievements
Rank 1
Answers by
Tsvetoslav
Telerik team
Herman Gouw
Top achievements
Rank 1
Princy
Top achievements
Rank 1
Share this question
or