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

On Edit, set fields to Read Only

4 Answers 939 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jamie
Top achievements
Rank 1
Jamie asked on 08 May 2019, 02:35 PM

I have a simple grid that allows the user to add new contacts. Certain need to be pre-populated and set to read only so the user cannot change then.

 

I've tried using <telerik:GridBoundColumn DataField="STATUS" HeaderText="Status" ReadOnly="true"/> but this hides the column when you try to add a new contact. I've tried various different way to render the column as read only including using a prerender function and attempting to set the read only status using javascript but i'm struggling to find the correct syntax for it.

 

My full code:

 

<telerik:RadGrid RenderMode="Lightweight" runat="server" ID="RadGridContats" AutoGenerateColumns="false" AllowPaging="true"
                        OnNeedDataSource="RadGridContats_NeedDataSource" OnUpdateCommand="RadGridContats_UpdateCommand"
                        OnInsertCommand="RadGridContats_InsertCommand" >
                        <MasterTableView DataKeyNames="ContactID" CommandItemDisplay="Top" InsertItemPageIndexAction="ShowItemOnCurrentPage">
                            <CommandItemSettings AddNewRecordText="Add Contact" />
                            <Columns>
                                <telerik:GridEditCommandColumn />
                                <telerik:GridBoundColumn DataField="ContactID" HeaderText="ID" ReadOnly="true" Visible="false"
                                    ForceExtractValue="Always" ConvertEmptyStringToNull="true" />
                                <telerik:GridBoundColumn DataField="Firstname" HeaderText="First Name">
                                <ColumnValidationSettings EnableRequiredFieldValidation="true" >
                                <RequiredFieldValidator ForeColor="Red" ErrorMessage="  Please enter a first name"></RequiredFieldValidator>
                                </ColumnValidationSettings></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Lastname" HeaderText="Last Name">
                                 <ColumnValidationSettings EnableRequiredFieldValidation="true" >
                                <RequiredFieldValidator ForeColor="Red" ErrorMessage="  Please enter a last name"></RequiredFieldValidator>
                                </ColumnValidationSettings></telerik:GridBoundColumn>   
                                <telerik:GridBoundColumn DataField="Email" HeaderText="Email">
                                <ColumnValidationSettings EnableRequiredFieldValidation="true" >
                                <RequiredFieldValidator ForeColor="Red" ErrorMessage="  Enter a valid email address"></RequiredFieldValidator>
                                </ColumnValidationSettings></telerik:GridBoundColumn>
                                <telerik:GridBoundColumn DataField="Workphone" HeaderText="Phone" />
                                <telerik:GridBoundColumn DataField="Title" HeaderText="Title" />
                                <telerik:GridBoundColumn DataField="Status" HeaderText="Status" ReadOnly="true"/>
                                <%--<telerik:GridButtonColumn HeaderStyle-Width="20px" Text="&lt;img src=/_layouts/15/Styles/LeadGen/images/deactivate4.png border=0 align=absmiddle alt='Select this Item'&gt;" CommandName="Select"></telerik:GridButtonColumn>--%>
                            </Columns>
                        </MasterTableView>
                        <PagerStyle Mode="NextPrevAndNumeric" />
                    </telerik:RadGrid>

 

Any help is greatly appreciated.

4 Answers, 1 is accepted

Sort by
0
Attila Antal
Telerik team
answered on 13 May 2019, 11:48 AM
Hi Jamie,

To have different forms when editing and inserting in RadGrid, one way would be by using Template columns where you could have a specific form for Inserting and other for editing. You can then disable the control when it enters into edit mode.

Example: 

<telerik:GridTemplateColumn DataField="Freight" DataType="System.Decimal"
    FilterControlAltText="Filter Freight column" HeaderText="Freight"
    SortExpression="Freight" UniqueName="Freight">
    <InsertItemTemplate>
        <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("Freight") %>'></asp:TextBox>
    </InsertItemTemplate>
    <EditItemTemplate>
        <asp:TextBox ID="TextBox2" runat="server" Text='<%# Eval("Freight") %>' Enabled="false"></asp:TextBox>
    </EditItemTemplate>
</telerik:GridTemplateColumn>

You can also try using the built-in column and disable the controls manually in the code behind:


<telerik:GridNumericColumn DataField="Freight" DataType="System.Decimal"
    FilterControlAltText="Filter Freight column" HeaderText="Freight"
    SortExpression="Freight" UniqueName="Freight">
</telerik:GridNumericColumn>


C# - Code behind:

protected void RadGrid1_PreRender(object sender, EventArgs e)
{
    foreach (GridDataItem item in RadGrid1.EditItems)
    {
        GridEditFormItem editItem = item.EditFormItem;
        RadNumericTextBox numericTextBox = editItem["Freight"].Controls[0] as RadNumericTextBox;
        numericTextBox.Enabled = false;
    }
}


Result:



See also:

Kind regards,
Attila Antal
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Jamie
Top achievements
Rank 1
answered on 14 May 2019, 11:24 AM

Morning Attila, thank you or the code samples so far. The methods you posted do the opposite of what I need, I need the Insert template to have a read only field and for that field to be editable in the edit template.

 

The logic behind this is that when a Contact is added, it will insert with the default status of "Active". You can then edit the contact and mark it as Inactive. I've tried using your code and reversing it to show as read only on insert and as editable on edit but can't make any progress.

 

This is what I have:

 

 protected void RadGridContats_PreRender(object sender, EventArgs e)
        {
            foreach (GridDataItem dataItem in RadGridContats.Items)
            {   
                dataItem["Status"].Visible = false;
            }
            foreach (GridDataItem item in RadGridContats.EditItems)
            {
                GridEditFormItem editItem = item.EditFormItem;
                RadTextBox TextBox = editItem["Status"].Controls[0] as RadTextBox;
                TextBox.Enabled = false;
            }
        }

I'm obviously going wrong somewhere but after a day of testing and searching, I'm still not further ahead

0
Jamie
Top achievements
Rank 1
answered on 14 May 2019, 02:36 PM

The last post wasn't that clear so figured I'd explain it a bit better!

 

My scenario. I have a Contacts grid with multiple fields, ID, First Name, Last Name, Email & Status. The name fields & email are both free text, the ID and Status fields are assigned in the backend when the data is inserted into the database.

 

Basically I want the Insert function to hide the ID and Status column as they both have default values assigned. However, when you edit the item, I want the Status field to be editable. 

 

I've tried both these functions:

  protected void RadGridContats_PreRender(object sender, EventArgs e)
        {
            foreach (GridDataItem dataItem in RadGridContats.Items)
            {
                dataItem["Status"].Enabled = false;
            }
        }
        protected void RadGridContats_ItemDataBound(object sender, GridItemEventArgs e)
        {
            GridDataItem dataItem = e.Item as GridDataItem;
            dataItem["Status"].Enabled = false;
        }

How do I adapt your previous code Attila:

protected void RadGrid1_PreRender(object sender, EventArgs e)
{
    foreach (GridDataItem item in RadGrid1.EditItems)
    {
        GridEditFormItem editItem = item.EditFormItem;
        RadNumericTextBox numericTextBox = editItem["Freight"].Controls[0] as RadNumericTextBox;
        numericTextBox.Enabled = false;
    }
}

 

To work on the insert item and not edit item?

 

Kind regards,

0
Accepted
Attila Antal
Telerik team
answered on 17 May 2019, 10:52 AM
Hi Jamie,

Please check out the How To Distinguish Edit or Insert Mode article to get a better understanding on the two different modes and when to access controls, values accordingly. Furthermore, the Accessing Cells and Rows article would provide you with a good overview of how to access values, cells, controls in cells and more.

The following example snippet will disable the TextBox when inserting a new item:

protected void RadGrid1_PreRender(object sender, EventArgs e)
{
    RadGrid grid = sender as RadGrid;
 
    // Edit items
    foreach (GridDataItem item in grid.EditItems)
    {
        //GridEditFormItem editItem = item.EditFormItem;
        //RadNumericTextBox numericTextBox = editItem["Freight"].Controls[0] as RadNumericTextBox;
        //numericTextBox.Enabled = false;
    }
 
    // If the grid has an insert item rendered
    if (grid.MasterTableView.IsItemInserted)
    {
        // get the insert item
        GridEditFormInsertItem insertItem = grid.MasterTableView.GetInsertItem() as GridEditFormInsertItem;
        // find the controls in the insert item
        RadNumericTextBox numericTextBox = insertItem["Freight"].Controls[0] as RadNumericTextBox;
        // disable the controls
        numericTextBox.Enabled = false;
    }
}

If you would like specific Forms different for both insert and edit mode, you may consider using the options I have listed in my previous reply such as the Form Template, WebUserControls, etc..

Kind regards,
Attila Antal
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Jamie
Top achievements
Rank 1
Answers by
Attila Antal
Telerik team
Jamie
Top achievements
Rank 1
Share this question
or