View only ItemTemplate / form template

[Ihab]

hi,

i have a task regarding to radgrid itemtemplate

i have normal rad grid showing data with ability to edit, update, cancel oporations inside formtemplated HTML table

I have 2 imageButtons btnEdit, btnView (wich i have problem with)

these 2 oporational buttons inside itemtemplated column 
the problem is that both buttons open the html table formTemplate inside the grid wich has 2 image buttons for save and cancel

i have to hide update imageButton inside the table in case of preesing View image button and to show it again in case of pressing Edit

here is HTML code for templateColumn

<

 

telerik:GridTemplateColumn AllowFiltering="False"

 

 

 

 

 

UniqueName="DeleteColum">

 

 

<HeaderTemplate>

 

 

 

</HeaderTemplate>

 

 

<ItemTemplate>

 

 

<table width="100%">

 

 

<tr align="center">

 

 

<td>

 

 

<asp:ImageButton ID="btnEdit" runat="server" CausesValidation="False"

 

 

CommandName="Edit" ImageUrl="~/RadControls/Grid/Skins/Default/Edit1.gif"

 

 

ToolTip="Edit" />

 

 

</td>

 

 

<td>

 

 

<asp:ImageButton ID="btnView" runat="server" CausesValidation="False" Visible="true"

 

 

CommandName="View" ImageUrl="~/RadControls/Grid/Skins/Default/view.gif"

 

 

ToolTip="View" />

 

 

 

</td>

 

 

</tr>

 

 

</table>

 

 

</ItemTemplate>

 

 

</telerik:GridTemplateColumn>

 

please note y=that the event

rgActions_ItemDataBound

doesnt fire when user press on btnView

changing the attribute CommandName="View"  to CommandName="Edit" enable this action to fire

any Idea,

regards

[Marin]

Hi Ihab,

You can hide the update button in the FormItemTemplate using the ItemCommand event for the RadGrid like this:

protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e)
{
  if (e.CommandName == "View")
  {
    GridEditFormItem gridEditFormItem =
    RadGrid1.MasterTableView.GetItems(GridItemType.EditFormItem)
      [RadGrid1.EditItems[0].ItemIndex] as GridEditFormItem;
    Button btnUpdate = gridEditFormItem.FindControl("btnUpdate") as Button;
    btnUpdate.Visible = false;
  }
}

Also ItemDataBound event is raised because the grid internally rebinds after it goes in edit mode. You can simulate this behavior by calling explicitly the Rebind method of the grid in the ItemCommand event above but you need to hide again the update button since this resets all the controls.

Hope this helps.

All the best,

Marin
the Telerik team

 

[Ihab]

many thanks Marin for valuable information,

actually i have related issue related to inserted data persistance as following:

 

As known Telerik provides ability to use templated Edit Form to insert/ edit data, problem we are facing is adding new record from the Grid edit form opened via add new record link that opens the template form, all entered data inside the template controls inside template form will be lost if user pressed any action button such edit button for another record (GridItem) or press again on add new record link that opens the templated form

 

I need to preserve any entered data inside templated control at the runtime regardless to another action being done to the same RadGrid.

 

please refer to this video to view the scenario

http://screencast.com/t/kfIBbdC7EyGm

another related question about add new record link
do we have any ability to attach client event such onClientClick fires once user click on this link
actually i tried to find way from itemdatabound events like following:

 

 

 

 

if(e.Item is Telerik.Web.UI.GridCommandItem)
{

((Telerik.Web.UI.GridLinkButton) e.Item.Controls[0].Controls[0].Controls[0].Controls[0].Controls[1]).onClientCleck...
//there is no available onClientCleck attribute
}

kind regards,
Ihab

[Marin]

Hello Ihab,

On your first question: RadGrid does not persist automatically values entered in the edit template form, you have to do it manually. Here is how it can be achieved:

During OnLoad of the page you save the values entered in the insert form in a hashtable, and after that on DataBound event of the grid you populate again the fields manually. The key moment is using the ExtractValues method of the GridEditableItem. More information can be found in this help topic. Here is the whole code:

private Hashtable insertValues = new Hashtable();

    protected override void OnLoad(EventArgs e)
    {
        base.OnLoad(e);

        if (RadGrid1.MasterTableView.IsItemInserted)
        {
            RadGrid1.MasterTableView.GetInsertItem().ExtractValues(insertValues);
        }
    }

    protected void RadGrid1_DataBound(object sender, EventArgs e)
    {
        if (RadGrid1.MasterTableView.IsItemInserted)
        {
           GridEditableItem insertForm  =  RadGrid1.MasterTableView.GetInsertItem();
           foreach (string key in insertValues.Keys)
           {
               if (insertValues[key]!=null)
               {
                   ((TextBox)insertForm[key].Controls[0]).Text = insertValues[key].ToString();
               }
           }
        }
    }

On your second question: You can use the OnCommand client-side event for the grid, which is fired for every command executed in the grid, and there you can handle the case when the Add new record button is clicked. For more information you can check the client-side API for the grid which has many valuable methods. Here is a sample code:

function RadGrid1_Command(sender, args) {
    if (args.get_commandName() == "<%= RadGrid.InitInsertCommandName %>") {
          alert("'Add new record' button hit!");
    }
}

and in markup:

<telerik:RadGrid ID="RadGrid1" runat="server">
        <MasterTableView>
            //...
        </MasterTableView>
        <ClientSettings ClientEvents-OnCommand="RadGrid1_Command">
        </ClientSettings>
</telerik:RadGrid>

Kind regards,
Marin
the Telerik team