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

How to add new row in RadGrid Clientside which should be inline and stay in editmode?

8 Answers 360 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Somnath
Top achievements
Rank 1
Somnath asked on 21 Jun 2012, 11:58 AM
Hi,

I have Rad Grid which has command button in command template
<telerik:RadGrid ID="rgUsers" AutoGenerateColumns="false" runat="server" OnNeedDataSource="OnNeedDataSource">
           <ClientSettings>
               <ClientEvents OnRowDblClick="RowDblClick" />
           </ClientSettings>
           <MasterTableView TableLayout="Fixed" CommandItemDisplay="Top" EditMode="InPlace"
               InsertItemDisplay="Bottom" AutoGenerateColumns="false">
               <CommandItemTemplate>
                   <asp:LinkButton ID="btnAddNew" runat="server" CommandName="InitInsert" Text="New"
                       Visible='<%# rgUsers.EditIndexes.Count == 0 && !rgUsers.MasterTableView.IsItemInserted %>' />
                     
                   <asp:Button ID="btnInsert" runat="server" CommandName="PerformInsert" Text="Insert" />
                     
                   <asp:Button ID="btnEditSelected" runat="server" CommandName="EditSelected" Text="Edit" />
               </CommandItemTemplate>
               <Columns>
                   <telerik:GridTemplateColumn HeaderText="UserName" UniqueName="UserName" SortExpression="UserName"
                       ItemStyle-HorizontalAlign="Left" HeaderStyle-HorizontalAlign="Center">
                       <ItemTemplate>
                           <asp:Label ID="lblUsername" runat="server" Text='<%#Eval("UserName")%>' />
                       </ItemTemplate>
                       <EditItemTemplate>
                           <telerik:RadTextBox ID="txtUsername" runat="server" Text='<%#Eval("UserName")%>'>
                           </telerik:RadTextBox>
                       </EditItemTemplate>
                   </telerik:GridTemplateColumn>                 
               </Columns>
           </MasterTableView>
       </telerik:RadGrid>
to add new row,  which is working perfectly .
But it is server side method.

I want that client side ,and new row should be inline and in edit mode.

Please suggest for the same.

Thanks 





8 Answers, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 25 Jun 2012, 02:12 PM
Hi Somnath,

Please try the following approach:
  mark-up:
<CommandItemTemplate>
        ...
  <asp:LinkButton Text="InitInsert" runat="server" ID="LinkButton1" OnClientClick="addNewItem()" />
</CommandItemTemplate>
  JavaScript:
function addNewItem() {
           var masterTable = $find("<%= rgUsers.ClientID %>").get_masterTableView();
           masterTable.fireCommand("InitInsert", "");
       }

That should do the trick.

All the best,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Somnath
Top achievements
Rank 1
answered on 27 Jun 2012, 05:44 AM
Hi ,

Thanks for the reply.

You have provided the code which fires server side "InitInsert " command from client side.
I want to create new row clientside not the server side.

Please suggest for the same.

Thanks & Regards,
Somnath 

0
Accepted
Eyup
Telerik team
answered on 28 Jun 2012, 02:07 PM
Hello Somnath,

Generally, you need to post to the server in order to open the insert form. However, if you want to do that only on client side, you could initialize an insert just on the initial load of the page and then configure the visibility of the insert form on client-side according to user preferences.

I have created a sample RadGrid web site where I implemented the described approach. Please note that in that case you will need to handle the "PerformInsert" and "Cancel" commands manually.

I hope this will prove helpful.

Kind regards,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Somnath
Top achievements
Rank 1
answered on 11 Jul 2012, 12:52 PM
Hi,

Thanks for the sample code.Its working absolutely as per my requirement.

In my project in which I am using telerik version 2011.2.915.40
I am getting
masterTable.get_insertItem() null

Can u please provide altrenate method to get InsertItem at ClientSide.

I am using rest of the thing same as you mentioned.

Thanks & Regards,
Somnath  

0
Eyup
Telerik team
answered on 13 Jul 2012, 06:27 AM
Hello Somnath,

Generally, we recommend the use of the latest RadControls release since on every new release, new changes are being made for the improvement and usability of the controls.

Nevertheless, you could change the following part of the provided application to make it work with an older version:
function pageLoad() {
    var grid = $find("<%=RadGrid1.ClientID %>");
    var rowsInEditForm = grid.get_element().getElementsByClassName("rgEditRow");
    var insertedRow;
    for (var i = 0; i < rowsInEditForm.length; i++) {
        if (rowsInEditForm[i].id == "") {
            insertedRow = rowsInEditForm[i];
            break;
        }
    }
    insertedRow.style.display = document.getElementById('HiddenField1').value;
}

That should do the trick.

Kind regards,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Dennis
Top achievements
Rank 1
answered on 08 Dec 2012, 09:18 AM
Although this works, but if you add validators on the Grid, the validators fire even for any operation performed outside the radgrid. additionally if the postback occurs on the page, the validators stop firing for the grid anymore. Any solution for that.
0
Angel Petrov
Telerik team
answered on 13 Dec 2012, 11:33 AM
Hello David,

A possible resolution for the problem is to specify validation groups. When doing so you would prevent the validators from firing always. To get a better understanding of this approach please review this online resource.

All the best,
Angel Petrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Jonathan
Top achievements
Rank 1
answered on 21 Oct 2016, 05:06 PM

I'd like to add a DT to a radgrid which is already filled by SQL statement. Is there a way to append new rows from a NEW DataTable to an existing radGrid?

BTW using VB

Tags
General Discussions
Asked by
Somnath
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Somnath
Top achievements
Rank 1
Dennis
Top achievements
Rank 1
Angel Petrov
Telerik team
Jonathan
Top achievements
Rank 1
Share this question
or