How to use Row Editing Template to add new row.

235

Yousef posted over 12 years ago

I have a RowEditingTemplate that is being used to edit the row. How can I use the same templte to add a row?

I've checked http://forums.infragistics.com/forums/p/60144/305361.aspx#305361 but that solution requires commiting the record first.

I need to display the RowEditingTemplate when the user wants to add new row and based on OK buttion of the RowEditingTemplate commit the record.

235

Yousef posted over 12 years ago in reply to [Infragistics] Petar Ivanov

I need to turn off RowAdding behaviour. Just have Editing Core & Row Editing Template and have an "Add" button which onClick should display the RowEdititingTemplate.

Following http://blogs.infragistics.com/aspnet/articles/webdatagrid-client-side-crud.aspx

I've turned off the AutoCRUD, onClick calls addUserRow() which creates a new row & adds to grid.

In WebDataGridUser_Editing_RowAdding     RET.enterEditMode(row); should the template but:

1. It does not display the added record

2. Ok & cancell buttons do not  generate WebDataGridUser_RowEditing_TemplateClosed

function addUserRow() {

var grid = window.$find("<%= WebDataGridUser.ClientID %>");

var ret = grid.get_behaviors().get_editingCore).get_behaviors).get_rowEditingTemplate();

var rows = grid.get_rows();

var data = [0, "Test1", "Test1", "Test1", "Test", 1, 1];

rows.add(data);

}

function WebDataGridUser_Editing_RowAdding(sender, eventArgs) ar RET = ig_controls.WebDataGridUser.get_behaviors().get_editingCore().get_behaviors().get_rowEditingTemplate();

var row = eventArgs.get_row(); //Add code to handle your event here.

{

v

RET.enterEditMode(row);

}
Cancel
Reply

Cancel
49378

[Infragistics] Petar Ivanov posted over 12 years ago in reply to Yousef

Hi akhavany,

Thank you for your reply.

As the samples collection is updated with each release and occasionally samples change, the links to samples do indeed change. For instance the above sample may now be found at:

http://samples.infragistics.com/aspnet/Samples/WebDataGrid/EditingAndSelection/DropDownEditors/Default.aspx?cn=data-grid&sid=a01f7736-5540-4cb6-9526-873efd65f20b

Please let me know if you need more information.
Cancel
Reply

Cancel
235

Yousef posted over 12 years ago in reply to [Infragistics] Petar Ivanov

Thank you very much. Works perfectly.

On a separate note, it seems most of the older sample links in Infragistics.com are broken.

For example

https://ko.infragistics.com/samples/aspnet/data-grid/dropdown-editors

Whishc is refered to in:

http://community.infragistics.com/forums/p/43644/265048.aspx
Cancel
Reply

Cancel
49378

[Infragistics] Petar Ivanov posted over 12 years ago
Hi akhavany,

Thank you for posting in the community.

I am attaching a sample demonstrating how the Row editing template may be used for adding new rows in the grid by handling the template closed event of the template along with displaying the RET upon clicking on the AddRow selector. Below is the relevant javascript code used:

Code Snippet

function WebDataGrid1_RowEditing_TemplateClosed(sender, eventArgs)

{

    ///<summary>

    ///

    ///</summary>

    ///<param name="sender" type="Infragistics.Web.UI.WebDataGrid"></param>

    ///<param name="eventArgs" type="Infragistics.Web.UI.EditRowEventArgs"></param>

    //check if the row to be updated is the new row (always returns index of -1)

    if (eventArgs.get_row().get_index() == -1) {

        ig_controls.WebDataGrid1.get_behaviors().get_editingCore().get_behaviors().get_rowAdding()._commitRow();

        //Add code to handle your event here.

    }

}

function WebDataGrid1_Grid_Click(sender, eventArgs)

{

    ///<summary>

    ///

    ///</summary>

    ///<param name="sender" type="Infragistics.Web.UI.WebDataGrid"></param>

    ///<param name="eventArgs" type="Infragistics.Web.UI.ItemEventArgs"></param>

    //check if the clicked item is the AddRow selector

    if ((eventArgs.get_item().get_index() != null) && (eventArgs.get_item().get_index()==-1)) {

        //debugger;

        var RET = ig_controls.WebDataGrid1.get_behaviors().get_editingCore().get_behaviors().get_rowEditingTemplate();

        RET.enterEditMode(eventArgs.get_item());

    }

}

Please let me know if this helps.
Cancel
Reply

Cancel
49378

[Infragistics] Petar Ivanov posted over 12 years ago
Hi akhavany,

Thank you for posting in the community.

I am attaching a sample demonstrating how the Row editing template may be used for adding new rows in the grid by handling the template closed event of the template along with displaying the RET upon clicking on the AddRow selector. Below is the relevant javascript code used:

Code Snippet

function WebDataGrid1_RowEditing_TemplateClosed(sender, eventArgs)

{

    ///<summary>

    ///

    ///</summary>

    ///<param name="sender" type="Infragistics.Web.UI.WebDataGrid"></param>

    ///<param name="eventArgs" type="Infragistics.Web.UI.EditRowEventArgs"></param>

    //check if the row to be updated is the new row (always returns index of -1)

    if (eventArgs.get_row().get_index() == -1) {

        ig_controls.WebDataGrid1.get_behaviors().get_editingCore().get_behaviors().get_rowAdding()._commitRow();

        //Add code to handle your event here.

    }

}

function WebDataGrid1_Grid_Click(sender, eventArgs)

{

    ///<summary>

    ///

    ///</summary>

    ///<param name="sender" type="Infragistics.Web.UI.WebDataGrid"></param>

    ///<param name="eventArgs" type="Infragistics.Web.UI.ItemEventArgs"></param>

    //check if the clicked item is the AddRow selector

    if ((eventArgs.get_item().get_index() != null) && (eventArgs.get_item().get_index()==-1)) {

        //debugger;

        var RET = ig_controls.WebDataGrid1.get_behaviors().get_editingCore().get_behaviors().get_rowEditingTemplate();

        RET.enterEditMode(eventArgs.get_item());

    }

}

Please let me know if this helps.
WebDataGridShowRowAddTemplate.zip
Cancel
Reply

Cancel