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

Event behind 'Add new record' in RadGrid

10 Answers 773 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Gareth
Top achievements
Rank 1
Gareth asked on 01 Jul 2014, 04:30 PM
Hi,

I have a quick question.

I'm trying to implement the RadGrid in BatchEdit mode.

I need to customise validation on some fields, and to do so I need to 'wire up' the event behind 'Add new record' button embedded on the grid.
E.g. the user added a new row/record and before adding another one I need to validate the added data.

I'm able to capture the events behind the 'Save changes' and 'Cancel changes' grid buttons but haven't been able to track down the 'Add new record'.

What are the client side and server side events behind this button?

Thank you in advance.

10 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 02 Jul 2014, 08:07 AM
Hi Gareth,

Please have a look into this help documentation which discuss about Batch Editing.

Thanks,
Shinu.
0
Gareth
Top achievements
Rank 1
answered on 02 Jul 2014, 08:56 AM
Hi Shinu,

Thanks for the prompt reply.

I've already gone through this doc... it doesn't answer my question.

I've tried to wire up the OnCommand to the ClientSettings and call my javascript function with the simple args.get_commandName() == "...";

This works fine for the 'Save changes', 'Cancel changes', 'Page' buttons, but it is not fired for the grid's 'Add new record' button.

So I guess my question is - how do I capture the event behind the grid's built in 'Add new record' button client side?

Any further help appreciated.
Thank you in advance.
0
Shinu
Top achievements
Rank 2
answered on 03 Jul 2014, 03:10 AM
Hi Gareth,

Try to use the OnRowCreating  or onRowCreated event based on your requirement. OnRowCreating event will fire when the row is being created and the OnRowCreated event will fire after the row is created.

Thanks,
Shinu.
0
Gareth
Top achievements
Rank 1
answered on 03 Jul 2014, 08:55 AM
Hi Shinu,

Thanks. Not quite what I've been looking for since these events are also fired at the early stage of the page lifecycle when the actual grid/row is constructed. It will fire for each row created coming from your datasource...

Since my last post I've found the OnBatchEditClosing and it does the trick; however I have the following question (dead easy to reproduce):

function ValidateInputData(sender, args) {
    var grid = $find('<%= myGrid.ClientID %>');
    var masterTable = grid.get_masterTableView();
    var rows = masterTable.get_dataItems();   var rowArgs = args.get_row();
    var rowIndex = rowArgs.sectionRowIndex;
    var row = rows[rowIndex];
    if (args.get_columnUniqueName() === "column1") {
            var txtColumn = (isNaN(parseFloat(row.get_cell("column1").outerText)))
                  ? 0 
                  : parseFloat(args.get_cell("column1").outerText);
            if (txtPd < 1) {
                   alert("Fix it");
                   args.set_cancel(true);
     }
}

The above is a mere validation example. I'm trying to see if the cell has any values and if not - prompt the user and cancel the edit process. It works fine for the already populated cells, e.g. if there's any data in the cell it will read the content fine and behaves as expected; however, it always returns '0' for the new cell and doesn't pick the value I've just put in that cell... Could you please advise?
(I've tried .innerHTML, .outerHTML, .Text and all possible options I've found online without luck).

Thanks for your prompt replies and help so far.

Gareth.
0
Gareth
Top achievements
Rank 1
answered on 03 Jul 2014, 09:06 AM
...small correction to the lower part of the function. It is obviously:
...​ 
   if (txtColumn < 1) {
                   alert("Fix it");
                   args.set_cancel(true);

     }
0
Gareth
Top achievements
Rank 1
answered on 04 Jul 2014, 08:47 AM
Could you please advised regarding the above?

Note that we use the grid in EditMode="Batch" edit and EditType="Row".

So the question is how do I retrieve the edited/newly input values from the cells?

Thanks in advance.
0
Shinu
Top achievements
Rank 2
answered on 04 Jul 2014, 11:07 AM
Hi Gareth,

You can use the OnBatchEditSetCellValue to check for the new value entered:

ASPX:
<ClientSettings>
  <ClientEvents OnBatchEditSetCellValue="OnBatchEditSetCellValue" />
</ClientSettings>

JS:
<script type="text/javascript">
    function OnBatchEditSetCellValue(sender, args) {
        if (args._columnUniqueName === "ColumnUniqueName") {
            if (args._value < 1) {
                alert("Fix it");
                args.set_cancel(true);
            }
        }
    }
</script>

Thanks,
Shinu
0
Gareth
Top achievements
Rank 1
answered on 04 Jul 2014, 12:16 PM
Great, thanks Shinu,

That works fine.

Thanks for your help.
0
Akshay
Top achievements
Rank 1
answered on 29 Oct 2014, 08:31 PM
Hi,
IDK where to create a post for a new question but I think my question reflects the subject of this post.
My question is which event gets called when I add a record in a radgrid, which is in batch edit mode and then save those changes. I would like to fire that event for each row created and use the values populated in that row. I'm using textbox,raddropdownbox and radDateTimepicker as 3 columns of radgrid.
0
Konstantin Dikov
Telerik team
answered on 03 Nov 2014, 09:58 AM
Hi Akshay,

When using Batch edit mode, once you insert a new item and click the Save Changes button, the server-side InsertCommand will fire for each inserted item. As documented in our help article "RadGrid - Batch Editing", "When RadGrid performs CRUD operations ItemCommand, InsertCommand, DeleteCommand, UpdateCommand events are fired. To continue this trend when batch editing is enabled the events will be called multiple times for each operation made on the client. The event argument passed to the event handler will be of type GridBatchEditingEventArgument which contains OldValues and NewValues Hashtables. They hold the original values and the newly entered ones."

You could also handle the OnBatchEditCommand event, where all the command will be available in the arguments e.Commands collection. You could then use each command CommandName property for determining if the command is for update, insert or delete.

For detailed information and examples I would suggest that you refer to the mentioned help article.


Best Regards,
Konstantin Dikov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Gareth
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Gareth
Top achievements
Rank 1
Akshay
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or