Hello,I'm using UltraWebGrid and my actual situation let me:
I would like to:
This article explain how to do some things I want to do (delete), but not all:http://dotnetslackers.com/articles/aspnet/QuickGuideToImplementingTheNetAdvantageUltraWebGrid.aspxAnd 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
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
Thanks for the answer, it helped very much but I still have a few problems.
I created a TemplateColumn as you said, and put inside 2 input button (I'll set the image later throught css).
<igtbl:TemplatedColumn><CellTemplate> <input id="btnEditar" type="button" value="Editar" onclick="EditRow();" /> <br /> <input id="btnEliminar" type="button" value="Eliminar" onclick="DeleteRow();" /></CellTemplate></igtbl:TemplatedColumn>
function EditRow() { var oGrid; //Get a reference for the grid on the client oGrid=igtbl_getGridById('ctl00_MainContent_gridPersonas'); oGrid.beginEditTemplate(); return true; }
function DeleteRow() { if (confirm("Are you sure")) { var oGrid; //Get a reference for the grid on the client oGrid=igtbl_getGridById('ctl00_MainContent_gridPersonas'); bDeleteClicked = true; oGrid.deleteSelectedRows(); return true; } return false; }
To avoid the DEL key press deletion, I use this function (BeforeRowDeletedHandler="BeforeDelete"):
function BeforeDelete() { if (!bDeleteClicked) {//DEL key pressed return true; } else { bDeleteClicked = false; return false; } }
The insert + edit template problem is solved using:
function UltraWebGrid1_AfterRowInsertHandler(gridName, rowId, index){ var row = igtbl_getRowById(rowId); row.editRow(true); //opens the RowEditTemplate
The problems I still have (and a new one) are:
Thanks again!!
I have solved the "not open edit template with double click" problem but I still haven't found the solution to some issues and I have added a few more. Any ideas?
The solution I use for that is to set AllowUpdate="No" property for each column in the grid.
I added another line of code in the UltraWebGrid1_AfterRowTemplateCloseHandler to check if the first cell of the row is empty or not before deleting it. In case of new row it is empty.
This changes the UltraWebGrid1_AfterRowTemplateCloseHandler method as follows:
function UltraWebGrid1_AfterRowTemplateCloseHandler(gridName, rowId, bSaveChanges)
var cell = row.getCell(0); // gets the first cell in the row
var val = cell.getValue(); //gets the value of present in the first cell
//for the new row the value in the first cell is null
if(event.srcElement.id == "igtbl_reCancelBtn" && val == null )
row.deleteRow();
Would not running this code also delete any row that the cancel button was clicked on?
For example if I open rowedit template on historical data, then click cancel.
Has this been resolved? I too am looking to use validation. In the post you say that you will send the individual any updates. Can you also post them on the forums?
Bill
It looks like the row is deleted from the client side, even though there is an error. I went through the sample and think it needs more investigation. I'm going to open a case for this issue and will send you the updates.
I have seen a new problem :(
If I try to delete a row but something happens (a foreing key constraint make that you can't delete the row for example) the row dissapears from the grid even if I try to cancel the deletion (e.Cancel = true on the deleterow method).
---------------------------------------------------------------------------------------------------------
protected void gridPersonas_DeleteRow(object sender, Infragistics.WebUI.UltraWebGrid.RowEventArgs e) { try { int id = Convert.ToInt32(e.Row.Cells[columnaDatosInicio + 0].Value); portalManejador.Personas_B(id, SEmpresaCliente); } catch { e.Cancel = true; } }
Any idea of this or any of the previous unsolved posted problems?