Client Side commands and some Grid issues

[Ivaylo]

Hi,

I am using a Rad Grid control that should support editing on the client side.
Currently, I have implemented this by sending custom ajax requests (via RadAjaxmanager) that send the data to be processed.
However, I experience some issues with the UI:
 1) When I enter edit mode (currently on row doubleclick) I would like to commit the editing by pressing enter. My Ajax request is sent and processed successfully, but the enter key also triggers the delete button on the current row and I get the delete confirmation message. Is there a way to ignore the delete button (or any button) when pressing enter?

 2) When I press enter by first focusing the grid itself (single click outside the edited row), I skip the delete button confirmation and all works fine, except that the row remains in edit mode (I want it to return to normal mode. I used some code on the server side to hide the edit mode but it either does nothing or hides the edit mode, along with the cell values (I get an empty row). I am using Grid.MasterTableView.ClearEditItems() to hide the active editors.

 3) (this is a more a suggestion) I think if there is a way to trigger the update/inset commands from javascript and leave the data processing for the server side, it will be OK. Also, I suppose the edit form will be closed. Is there a way to trigger an Update or Insert command for the grid to be handled by the
Grid_ItemCommand or the correspoding ItemInserted/ItemUpdated events?

Regards,
Ivaylo Slavov

UPDATE

I was able to call the commands from client side. Now the only problems I have are the enter key and the edit form not hiding.

UPDATE 2
Using <grid>.get_masterTableView().cancelAll(); hides the edit forms.

[Mira]

Hello Ivaylo,

The cause of the described behavior is that when you have multiple buttons in a form the first one rendered is set as Default button and its events are fired when you press Enter.
To update the corresponding grid row when Enter is pressed, you can use the following code:
Code behind:

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
{
    if (e.Item is GridEditableItem && e.Item.IsInEditMode)
    {
        foreach (Control c in e.Item.Controls)
        {
            foreach (Control c1 in c.Controls)
            {
                if (c1 is TextBox)
                {
                    (c1 as TextBox).Attributes.Add("onkeypress", "updateRow(" + e.Item.ItemIndex + ");");
                }
            }
        }
    }
}

Javascript:

function updateRow(arg) {

    if (event.keyCode == 13) {
        var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
        masterTable.updateItem(arg);
    }

}

I hope this helps.

Kind regards,
Mira
the Telerik team

[Ivaylo]

Hi,

Well, is there any difference if add the corresponding javascript in the edit item template on the textbox instead from the server-side, because this is what i have tried already - it works, but it works only when the textbox is focused, and somehow, just after editing the value of the textbox, it seems to loose focus. If I click the textbox just after editing it's value and press enter it is OK, but if I don't, I end up with the undesired button on-enter.

Regards,
Ivaylo Slavov

[Mira]

Hello Ivaylo,

Please try using the following code to make the Update button default button of the form:

protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridEditableItem && e.Item.IsInEditMode)
        {
            LinkButton button = e.Item.FindControl("UpdateButton") as LinkButton;
            form1.DefaultButton = button.UniqueID;
        }
    }

I hope this helps.

Sincerely yours,
Mira
the Telerik team