Forums Retired Products and Controls
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
RaY
215
Edit and Delete button on UltraWebGrid
posted

Hello,

I'm using UltraWebGrid and my actual situation let me:

  • delete rows using DEL key
  • edit a row making a double click on any cell, using an edit template
  • add a new row and enter data using the edit template, but I have to click the add... button on the bottom of the grid and double clicking the blank row


I would like to:

  • add a button with a "delete image" to delete the row by clicking it (maybe disable the DEL key too)
  • add a button with an "edit image" to edit the row using the template by clicking it and not any other part of the grid
  • add a new row and enter data using the edit template with only one click on the "add button".


This article explain how to do some things I want to do (delete), but not all:

http://dotnetslackers.com/articles/aspnet/QuickGuideToImplementingTheNetAdvantageUltraWebGrid.aspx

And in the infragistics sample page (http://samples.infragistics.com/2008.3/WebFeatureBrowser/Default.aspx) also have an example of a column with an edit image, but looking at the sourcecode I don't know how it creates that button (it isn't a "normal button column"). It also let you edit the row clicking in any part of the row. The example I mean is "WebGrid -> Row Templates".

Thanks in advance

Parents
  • 3732
    posted

    Hi,

    It looks like you are trying to include two image button columns in the WebGrid to handle the editing and deleting of rows. This can be done using template columns. The following Knowledge Base article explains how to do this with examples:

    http://devcenter.infragistics.com/Support/KnowledgeBaseArticle.aspx?ArticleID=4876

    The following link to our online documentation also explains this with step-by-step example:

    http://help.infragistics.com/Help/NetAdvantage/NET/2008.3/CLR3.5/html/WebGrid_Templating.html

    Once the image button column is placed in the Grid, then the client side CellButtonClick event can be handled and the row object can be made to enter the edit mode, which will result in opening the RowEditTemplate for editing. The javascript method should look like as follows:

    function

    UltraWebGrid1_ClickCellButtonHandler(gridName, cellId)

    {

    var row = igtbl_getRowById(cellId);

    row.editRow(true);

    }

    To open the RowEditTemplate after the Add button is clicked, you can handle client side AfterRowInsert event and set the row to be in edit mode as follows:

    function UltraWebGrid1_AfterRowInsertHandler(gridName, rowId, index)

    {

    var row = igtbl_getRowById(rowId);

    row.editRow(true); //opens the RowEditTemplate

    }

    To include the client side event handlers, in the properties window expand DisplayLayout--> ClientSideEvents and then navigate through the events and click on the right side box to add a new handler. This creates the method signature in the HTML source page.

    Now the last question is still open, i.e. how to disable the delete key. I'm doing a research on this and will get back to you once I have an answer.

    Hope this helps.

    Thanks

     

Reply Children