I have enabled delete row and I also have row selection turned on. The problem is when i click the dlete the row selectionChanging function fires and the delete never happens. Is there a workaround for this. I have this same problem when i put links in my grid. if i click a link the rowSelectionChanging will fire.
Thanks
Sy
Here is my grid.
template = "<tr><td> <img alt='' src='" + data.imagePath + "${CatID}" + ".jpg'' /> <p><a href='" + data.imagePathLarge + "${CatID}" + ".jpg' class='pzoom'>Zoom</a></p> </td> <td> ${CatID} </td> <td> ${Name} </td> <td> ${CreatedBy} </td> <td> ${QuantityOfItems} </td> <td> ${CreatedDateTime} </td><td> ${ExpirationDate}</td><td> ${PublishDate}</td></tr>";
tablecolumns = [{ headerText: "Image", key: "Name", dataType: "string", width: "75" }, { headerText: "Catalog ID", key: "CatID", dataType: "string", width: "100" }, { headerText: "Name", key: "Name", dataType: "string", width: "200" }, { headerText: "Created By", key: "CreatedBy", dataType: "string", width: "100" }, { headerText: "Item Count", key: "QuantityOfItems", dataType: "number", width: "75" }, { headerText: "Created", key: "CreatedDateTime", dataType: "date", width: "75" }, { headerText: "Expiration", key: "ExpirationDate", dataType: "date", width: "100" }, { headerText: "Published", key: "PublishDate", dataType: "date", width: "100"}];
$("#catalogsearch").igGrid({
autoGenerateColumns: false,
rowTemplate: template,
columns: tablecolumns,
jQueryTemplating: true,
dataSourceType: 'json',
dataSource: data.json,
width: '100%',
height: '100%',
features: [
{
name: 'Paging',
type: 'local',
pageSize: 100
},
name: 'Sorting',
type: "local"
name: 'Selection',
mode: 'row',
rowSelectionChanging: function (ui, args) {
var col = document.getElementById("catalogsearch_CatID").cellIndex;
var row = $("#catalogsearch").igGrid('activeRow');
var cell = $("#catalogsearch").igGrid('cellAt', col, args.row.index);
if (debug) {
console.log('rowSelectionChanging event fired. Row Index = ' + args.row.index + '-' + $(cell).text());
}
window.open('../dashboard/catalogbuilder.aspx?id=' + $(cell).text(), '_self', false);
name: 'Updating',
enableAddRow: false,
editMode: 'none',
enableDeleteRow: true,
// event raised before row was deleted
rowDeleting: function (evt, ui) {
var answer = confirm("Are you sure you want to delete this catalog?");
if (answer) {
try {
showLoader("Deleting Catalog..."); //Loader hidden in comm_findproduct_trackSuccess()
} catch (error) {
console.log("showLoader() error: " + error.description);
simpleLoad('../clientadmin/stats.aspx/deleteCatalog', { CatID: $(cell).text() }, function (data) {
if (data.success) {
alert("Catalog Deleted");
} else {
alert("There was a problem deleting the catalog");
});
hideLoader(); //Loader shown in find_product()
console.log("hideLoader() error: " + error.description);
// event raised after row was deleted
rowDeleted: function (evt, ui) {
// var cell = $("#b2busers").igGrid('cellAt', 0, ui.rowID);
// console.log("rowDeleted event fired. Row Index = " + ui.rowID + '--cellValue = ' + $(cell).text());
name: 'Filtering',
type: "local",
filterDropDownItemIcons: false,
filterDropDownWidth: 200
name: 'GroupBy',
columnSettings: [
columnsettings: "CreatedDateTime",
isGroupBy: true,
dir: "asc"
]
I am using 11.2.20112.2045, I may go ahead and upgrade and see if that fixes my problem. I will let you know if have any issues after i upgrade.
Hello, saevar
I updated one of the HTML online samples
http://samples.infragistics.com/jquery/grid/editing
in order to replicate the behavior but I wasn’t able to.
If I delete the row using the delete button which pops up when mouse on it , the rowSelectionChanging is not fired.
Only the rowDeleting is fired.
I also added link in the row template and after clicking on it is opened.
Regarding the rowSelectionChanging , it is expected to be fired when clicking on a cell of the row because you have Selection turned on.
I am attaching the modified html snippet.
Can you share what version and build are you using?
Hope hearing from you.