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

RadGrid inline editing issues ?

3 Answers 306 Views

Grid

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

cha asked on 14 Mar 2011, 04:56 PM

I have a telerik radgrid with editmode="Inplace" and with custom images specified for cancel/insert/delete. I have a button outside the grid that initiates the insert action. I am using this button instead of commanditem template displayed by the telerik grid.

I have these issues.

1.When I click the edit image for a row, some kind of postback happens but it does not enter into edit mode.
2.When I click the delete image for a row, it asks a alert for delete confirmation and some kind of postback happens, but InquiryGrid_DeleteCommand is not fired.
3.When I click the insert button that is outside the form, it enteres into insert mode, and some of columns are editable, but the images displayed are incorrect. I want to display same update/cancel images for both insert/edit mode. but the image displayed for insert is wrong and missing image for cancel. Clicking on these images have no action.

If I change the ButtonType to "LinkButton" instead of "ImageButton" all these actions works as expected.
What am I missing here ? Below is the code for my grid.
Appreciate your help.

<div>

<telerik:RadGrid ID="InquiryGrid" runat="server" AllowPaging="false" AllowSorting="false"

AutoGenerateColumns="false" ClientSettings-Scrolling-AllowScroll="true" ClientSettings-Scrolling-EnableVirtualScrollPaging="false"

EnableEmbeddedSkins="false" EnableViewState="false" GridLines="none" ImagesPath="Images/" PagerStyle-AlwaysVisible="true" PagerStyle-Mode="NextPrevAndNumeric" PageSize="400"

OnNeedDataSource="InquiryGrid_NeedDataSource"

Skin="Gray" Height="100%"

OnUpdateCommand="InquiryGrid_UpdateCommand"

OnDeleteCommand="InquiryGrid_DeleteCommand"

OnInsertCommand="InquiryGrid_InsertCommand" >

<ClientSettings>

<Scrolling AllowScroll="true" SaveScrollPosition="true" UseStaticHeaders="true" />

</ClientSettings>

<MasterTableView ClientDataKeyNames="inquiry_id" TableLayout="Fixed" EditMode="InPlace">

<HeaderStyle Height="25px" />

<EditFormSettings>

<EditColumn UniqueName="EditCommandColumn" ButtonType="ImageButton"

CancelImageUrl="images/edit_cancel.gif"

UpdateImageUrl="images/edit_update.gif"

InsertImageUrl="images/edit_update.gif" EditText="Edit" InsertText="Insert" UpdateText="Update"

>

</EditColumn>

</EditFormSettings>

<columns>

<telerik:GridBoundColumn DataField="maturity_range" HeaderText="Maturity Range" SortExpression="maturity_range"

UniqueName="maturity_range">

<HeaderStyle width="100px" CssClass="th-inquiry-lastupdate_dt" />

<ItemStyle width="100px" CssClass="inquiry-lastupdate_dt" />

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="active" HeaderText="Active ?" SortExpression="active"

UniqueName="active">

<HeaderStyle width="50px" CssClass="th-inquiry-lastupdate_dt" />

<ItemStyle width="50px" CssClass="inquiry-lastupdate_dt" />

</telerik:GridBoundColumn>

<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn" EditImageUrl="images/edit.gif">

</telerik:GridEditCommandColumn>

<telerik:GridButtonColumn ConfirmText="Delete this inquiry?" ConfirmDialogType="RadWindow"

ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"

UniqueName="DeleteColumn" ImageUrl="images/delete.gif">

</telerik:GridButtonColumn>

</columns>

</MasterTableView>

</telerik:RadGrid>

</div>

<br>

<div>

<asp:Button ID="btnAdd" runat="server" CssClass="pc-btn" OnClick="AddNew_Click" Text="Add New" />

</div>

protected void AddNew_Click(object sender, EventArgs e)

{

InquiryGrid.MasterTableView.IsItemInserted = true;

InquiryGrid.Rebind();

}

3 Answers, 1 is accepted

answered on 17 Mar 2011, 10:46 AM

Hello Cha,

Since you are using InPlace editing you will have to configure your GridEditCommandColumn:

<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn"

EditImageUrl="images/edit.gif" CancelImageUrl="images/edit_cancel.gif" InsertImageUrl="images/edit_update.gif"

UpdateImageUrl="images/edit_update.gif" EditText="Edit" InsertText="Insert" UpdateText="Update">

</telerik:GridEditCommandColumn>

The EditColumn properties that are part of the EditFormSettings section are intended to customize the edit column (buttons, text etc) that is inside an EditForm when InForms editing is used. For more information on the matter I would suggest that you review the following help article:

Localizing edit command column

I hope this helps.

Kind regards,
Martin
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!