RadGrid-How to keep in edit mode and display error

[Binh]

I have a radgrid using a form template to do my inserts and updates.  I was wondering how you would keep the grid in edit or update mode from the onInsertCommand/onUpdateComman event handlers?  I have tried using the onItemInserted and onItemUpdated handlers but my code never reaches the event. I would just like to display an error if validation failed. I have attached snippets of my code. 

<telerik:radgrid runat="server" id="gridSection" skin="Windows7"
                                            OnNeedDataSource="gridSection_NeedDataSource"
                                            onitemdatabound="gridSection_ItemDataBound"
                                            OnDetailTableDataBind="gridSection_DetailTableDataBind"
                                            onupdatecommand="gridSection_UpdateCommand"
                                            oninsertcommand="gridSection_InsertCommand"
                                            onitemcommand="gridSection_ItemCommand"
                                            onprerender="gridSection_PreRender"
                                            HierarchySettings-CollapseTooltip="Hide child defects."
                                            HierarchySettings-ExpandTooltip="View child defects."
                                            oniteminserted="gridSection_ItemInserted"
                                            onitemupdated="gridSection_ItemUpdated" >

protected void gridSection_UpdateCommand(object sender, GridCommandEventArgs e)
        {
            try
            {
                QASectionDTO dto = convertSelectedGridSectionItemToDto(e);
                validateSection(dto);
                update(dto);
            }
            catch (Exception ex)
            {
                //display error and keep in update mode
            }
        }

        protected void gridSection_InsertCommand(object sender, GridCommandEventArgs e)
        {
            try
            {
                QASectionDTO dto = convertSelectedGridSectionItemToDto(e);
                validateSection(dto);
                insert(dto);
            }
            catch (Exception ex)
            {
                //display error and keep in edit mode
            }
        }

        protected void gridSection_ItemInserted(object sender, GridInsertedEventArgs e)
        {
            e.KeepInInsertMode = true;
        }

        protected void gridSection_ItemUpdated(object sender, GridUpdatedEventArgs e)
        {
            e.KeepInEditMode = true;
        }

        protected void validateSection(QASectionDTO dto)
        {
            if (dto.QASectionID == 0) throw new ArgumentException("A Section was not Selected.");
            if (dto.QAQuestionID == 0) throw new ArgumentException("A Question was not Selected.");
            if (dto.Result == "0") throw new ArgumentException("A Result was not Selected.");
            if (dto.QAQuestionID == 0) throw new ArgumentException("A Question was not Selected.");
            if (dto.Result.Equals("Pass") && dto.QAQuestionID.Equals("0")) throw new ArgumentException("A Defect Code was not Selected.");
            if (dto.HasChild && (dto.ChildDefectIDs.Count == 0)) throw new ArgumentException("At least one Child Defect is required.");
        }

 

[Princy]

Hello Binh,

OnItemUpdated event will fire only when the grid is bound to DataSourceControl. Since you are using NeedDataSource event to bind the grid, try the following approach to make the grid in edit mode after update operation.

C#:

int index=-1;
 protected void gridSection_UpdateCommand(object sender, GridCommandEventArgs e)
 {
     GridEditFormItem editItem = (GridEditFormItem)e.Item;
     index = editItem.ItemIndex;
 }
protected void gridSection_PreRender(object sender, EventArgs e)
     {
        if (index > -1)
         {
             gridSection.MasterTableView.Items[index].Edit = true;
             gridSection.MasterTableView.Rebind();
         }
     }

Thanks,
Princy.

[Raymond]

How to keep values of controls in the moment of update button was clicked?
When RadGrid1.MasterTableView.Rebind(); is rebinding the RadGrid, all the controls are getting old values from db.

Thanks.

 

[Jayesh Goyani]

Hi,

protected void gridSection_UpdateCommand(object sender, GridCommandEventArgs e)
        {
            try
            {
                QASectionDTO dto = convertSelectedGridSectionItemToDto(e);
                validateSection(dto);
                update(dto);
            }
            catch (Exception ex)
            {
                       e.Canceled = true; // cancel update command event and  remain values in edit mode

                      // for display error message you can use modulpopupextender or radwindow
            }
        }

Thanks,
Jayesh Goyani

[Raymond]

Thanks for answer, but it is not keeping value.
For example lets say when i jut clicked on edit button the textbox's value was "test1", i changed it to "test2" and pressed update button, after the code:
 protected void UpdateCommand(object source, GridCommandEventArgs e)
{
e.Canceled = true;
}
is executed the textbox is again have value "test1", but I want it to be "test2" (the value it has just before i pressed update button).

Thanks.

[Jayesh Goyani]

Hi,

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnNeedDataSource="RadGrid1_NeedDataSource"
           AllowFilteringByColumn="true" onupdatecommand="RadGrid1_UpdateCommand">
           <GroupingSettings CaseSensitive="false" />
           <MasterTableView DataKeyNames="ID">
               <Columns>
                   <telerik:GridTemplateColumn DataField="ID" HeaderText="ID">
                       <ItemTemplate>
                           <%# Eval("ID")%>
                       </ItemTemplate>
                       <EditItemTemplate>
                           <telerik:RadTextBox ID="RadTextBox1" Text='<%# Eval("ID")%>' runat="server">
                           </telerik:RadTextBox>
                       </EditItemTemplate>
                   </telerik:GridTemplateColumn>
                   <telerik:GridTemplateColumn DataField="Name" HeaderText="Name">
                       <ItemTemplate>
                           <%# Eval("Name")%>
                       </ItemTemplate>
                       <EditItemTemplate>
                           <telerik:RadTextBox ID="RadTextBox2" Text='<%# Eval("Name")%>' runat="server">
                           </telerik:RadTextBox>
                       </EditItemTemplate>
                   </telerik:GridTemplateColumn>
                   <telerik:GridEditCommandColumn UniqueName="EditColumn">
                   </telerik:GridEditCommandColumn>
               </Columns>
           </MasterTableView>
       </telerik:RadGrid>

protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        dynamic data = new[] {
                new { ID = 1, Name ="Name1"},
                new { ID = 2, Name = "Name2"},
                new { ID = 3, Name = "Name3"},
                new { ID = 4, Name = "Name4"},
                new { ID = 5, Name = "Name5"},
                new { ID = 6, Name ="Name6"},
                new { ID = 7, Name = "Name7"},
                new { ID = 8, Name = "Name8"},
                new { ID = 9, Name = "Name9"},
                new { ID = 10, Name = "Name10"},
                new { ID = 11, Name ="Name11"},
                new { ID = 12, Name = "Name12"},
                new { ID = 13, Name = "Name13"},
                new { ID = 14, Name = "Name14"},
                new { ID = 15, Name = "Name15"}
            };

        RadGrid1.DataSource = data;
    }
    protected void RadGrid1_UpdateCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)
    {
        GridEditableItem item = (GridEditableItem)e.Item;
        RadTextBox RadTextBox1 = (RadTextBox)item.FindControl("RadTextBox1");
        RadTextBox RadTextBox2 = (RadTextBox)item.FindControl("RadTextBox2");
        e.Canceled = true;
    }

please check your code with above code.
NOTE : May be your issue is you can bind Datasource again or set any unused/affected property.

Let me know if you have any issue.

Thanks,
Jayesh Goyani

[Raymond]

It is keeping value now.

Thanks.

[Sumathi]

Is it possible to do the same in radGrid_BatchEditCommand(object sender, GridBatchEditingEventArgs e) event ?

 

I have a grid which has the Add/Save/Cancel command as CommandItems. I am using BatchEdit and EditType as Row. During insert/update, I want to validate the values after the user enters values and throw an error message on clicking Save. I tried the approach you have mentioned, but old values are only retained and not new ones entered by the user. 

[Angel Petrov]

Hi,

When using batch editing the user entered data should be first validated on the client. For that purpose you can subscibe to the OnBatchEditClosing or OnBatchEditCellValueChanging event, obtain the entered value and check whether it meets your criteria. If not you can cancel the event(thus preventing the cell from closing) and display an alert message notifying the user that the data is not valid.

One other thing, you can also validate the data on the server by subscribing to the OnBatchEditCommand event and extracting it from the event arguments as shown here. Note however that once the data gets sent to the server it can not be retrieved afterwards on the client. Meaning that the only way to preserve it is to update the database so that the grid will later visualize it.

Regards,
Angel Petrov
Telerik

[Phil]

Like Sumathi above, we have the same business requirement.  Can you give an example of comparing old and new values when subscribing to OnBatchEditClosing?  So far we are only seeing the old values.

 

Thanks in advance

[Angel Petrov]

Hi,

If you want to compare the old and new value and prevent the cell from closing you can subscribe to the OnBatchEditCellValueChanging event. From the arguments you can extract previous value (available under args.get_cellValue()) and new value (available under args.get_editorValue()) thus you can compare them if needed.

Regards,
Angel Petrov
Telerik

[Sam]

Hi, when I use the OnBatchEditClosing event and call args.set_cancel(true) it cancels the event. However, nothing will close the editor after the first cancel except clicking on another grid row. Is there a way to manually close the editor when in Batch Edit Mode?

[Angel Petrov]

Hello,

Can you please share with us the page code and elaborate on the scenario so we could try and find out what prevents the cell from closing? Generally you can call an our internal method (provided below) that closes the edited cell/cells but the use of internal methods is not the suggested way.

JavaScript:

$telerik.findControl(document,"RadGrid1").get_batchEditingManager()._tryCloseEdits(document.body)

Regards,
Angel Petrov
Telerik by Progress

[Sam]

Basically I want an additional tooltip to show when a user edits a row to gather additional data. So I'm using the following code when the user clicks on a field in the grid to edit:

                function Day_OnFocus(sender, args) {
                    var tt = $find("<%=ttNotes.ClientID%>");
                    tt.set_targetControlID(sender.get_id());
                    tt.show();
                    CurDay = sender.get_id().substring(sender.get_id().length - 1);
                    var grid = $find("<%=grdData.ClientID%>");
                    var masterTableView = grid.get_masterTableView();
                    var batchEditManager = grid.get_batchEditingManager();
                    currentDataItem = $find(CurRow.id);
                    InitNotes = true;
                    if (CurNotes[CurDay]) 
                        $find("<%=txtNotes.ClientID%>").set_value(CurNotes[CurDay]);
                    else
                        $find("<%=txtNotes.ClientID%>").set_value(batchEditManager.getCellValue(currentDataItem.get_cell("Notes" + CurDay)));
                    InitNotes = false;
                }

Then I have to prevent the batch editor from closing because the row loses focus because the user clicks on the additional notes field from the tooltip. 

                function grdData_OnBatchEditClosing(sender, args) {
                    if (InNotes) { args.set_cancel(true); }
                }

However when I cancel out of the batch edit closing, by clicking anywhere else in the document, it will not close the row being edited. The only way to close it is to click on another row. Ideally I'd like it to close normally. So I'm assuming the only other way to do it would be to manually close on document.click and checking the target. 

[Sam]

By the way, the $telerik.findControl(document,"RadGrid1").get_batchEditingManager()._tryCloseEdits(document.body) works perfectly. Thanks. 

[Sam]

Sorry Angel, spoke too soon. The _tryCloseEdits() does not work. Let me know if there is another way to close the editor. 

 

[Angel Petrov]

Hi,

I am not sure about the exact solution here but probably the row is prevented from closing because args.set_cancel is set to true in the grdData_OnBatchEditClosing event handler. In order for the row to close one should ensure that the action is not cancelled. In cases like the described where multiple clicks will be performed our of the grid and it will try to close the cell/row you will have to ensure that the InNotes flag value is correct and that it will only cancel the event when you need it to.

Regards,
Angel Petrov
Telerik by Progress

[Sam]

Angel, that is correct. Once the args.set_cancel is set to true, the row will not close manually through code. Is there no other way to accept the changes entered and close the row? What is happening is if the user clicks the save button, the current edited row is not being saved on the client side. Seems there would be some way to manually close the editor even if it has been canceled prior. 

[Angel Petrov]

Hello,

If the batch editing event is cancelled (setting args.set_cancel to true) the row can not close. Note that when you click the save button the row will try to close and will call the event. Meaning that at this time you should not cancel it.

Regards,
Angel Petrov
Telerik by Progress

[Sam]

Hi Angel, the save button is external to the grid and I'm calling saveAllChanges separately. It does not close the currently edited row. In fact, nothing closes the current row except editing another row. So we've just kind of hacked it by calling openRowForEdit on another row just before the save.