This is a migrated thread and some comments may be shown as answers.

Delete issue in grid with subgrids

2 Answers 80 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Admin asked on 02 Mar 2016, 09:22 AM

Hi,

I have a grid with subgrids on page. And I had to make custom delete button which shows delete dialog window (default kendo behaviour - show alert, not acceptable in my app).
But when someone press delete-button in subgrid, it invokes click on delete button in main grid (via injected.js, I understood that in debug proccess in chrome). I dont need that behaviour. How to prevent click on delete button in main grid?

Provide part of code here, and all code of this page in Attachment

Code :

//Main grid

@(Html.Kendo().Grid<TerminalViewModel>()

.Name("TerminalsGrid")

.Columns(c =>

{

c.Bound(x => x.Brand.Name)

c.Bound(x => x.TerminalModel.Name)

c.Bound(x => x.SerialNumber)

c.Bound(x => x.CommissioningDate)

c.Bound(x => x.CurrentAZS)

c.Command(command => command.Edit()

.HtmlAttributes(new { style = "text-align: center;" })

.Width(131);

c.Command(command => command.Custom("Delete")

.Text("<span class='k-icon k-delete'></span>Удалить")

.Click("prepareToDelete"))

.HtmlAttributes(new { style = "text-align: center;" });

})

.Events(x => x

.Save("onSaveDisableUpdateButton")

.DataBound("onDataBoundHideControlButtons"))

.DataSource(ds => ds

.Ajax()

.Events(e => e

.Error("onErrorInCatalogs"))

.Model(m =>

{

m.Id(x => x.Id);

m.Field(x => x.Brand).DefaultValue(new ListItemIntViewModel { Name = "" });

m.Field(x => x.TerminalModel).DefaultValue(new ListItemIntViewModel { Name = "" });

m.Field(x => x.Organization).DefaultValue(new ListItemViewModel { Name = "" });

m.Field(x => x.Contractor).DefaultValue(new ListItemViewModel { Name = "" });

})

.Read(r => r.Action("JsonRead", "Terminals"))

.Create(c => c.Action("JsonCreate", "Terminals"))

.Update(u => u.Action("JsonUpdate", "Terminals"))

)

.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditTerminal")

.Window(x => x.Width(550).Title("Данные терминала")))

.ToolBar(t => t.Create())

.Sortable(s => s.AllowUnsort(true))

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

.ClientDetailTemplateId("template")

.Scrollable(scroll => scroll.Height("auto"))

.Pageable()

.Events(events => events

.DetailExpand("detailExpand")

.DetailCollapse("detailCollapse"))

)

// Helper for Delete Window

@Html.DeleteModal()

//Subgrid

@helper StateChanges()

{

@(Html.Kendo().Grid<TerminalStatesChangeHistoryViewModel>()

.Name("grid_state_changes_#=Id#")

.Columns(columns =>

{

columns.Bound(col => col.TerminalState.Name)

.EditorTemplateName("EditTerminalState");

columns.Bound(col => col.StartTime)

.EditorTemplateName("DateTimeEditor");

columns.Bound(col => col.EndTime)

.EditorTemplateName("DateTimeNullableEditor");

columns.Command(c => c.Edit())

.HtmlAttributes(new { style = "text-align: center;" });

columns.Command(command => command.Custom("Delete")

.Text("<span class='k-icon k-delete'></span>Удалить")

.Click("prepareToDeleteInSubgrid"))

.HtmlAttributes(new { style = "text-align: center;" });

})

.Sortable()

.Events(x => x

.Save("onSaveDisableUpdateButton")

.DataBound("onDataBoundHideControlButtons"))

.Editable(editable => editable.Mode(GridEditMode.InLine))

.ToolBar(toolbar => { toolbar.Create(); })

.DataSource(data => data

.Ajax()

.Sort(sort => sort.Add("StartTime").Descending())

.Events(events =>

{

events.Error("onErrorInSubgrid.bind({ WidgetID: 'grid_state_changes_#=Id#'})");

events.Sync("onSubgridSync.bind({ WidgetID: 'grid_state_changes_#=Id#'})");

})

.Model(model =>

{

model.Id(m => m.Id);

model.Field(x => x.TerminalState).DefaultValue(new ListItemIntViewModel());

model.Field(x => x.StartTime).DefaultValue(DateTime.Now);

})

.Create(update => update.Action("StateChangesCreate", "Terminals", new { terminalId = "#= Id #" }))

.Read(read => read.Action("StateChangesRead", "Terminals", new { terminalId = "#= Id #" }))

.Update(update => update.Action("StateChangesUpdate", "Terminals"))

)

.Pageable(pager => pager.Refresh(true))

.ToClientTemplate()

)

}


<script>
function prepareToDeleteInSubgrid(e) {
        e.preventDefault();
        var gridId = this.element[0].id;
        if (gridId.indexOf("state_changes") > 0) {
            deleteUrl = deleteStateChangeUrl;
        }
        else if (gridId.indexOf("fuel_station_changes") > 0) {
            deleteUrl = deleteFuelStationChangeUrl;
        }
        else return;
        showDelete(e, this);
    }
    function prepareToDelete(e) {
        var gridId = this.element[0].id;
        deleteUrl = deleteTerminalUrl;
        showDelete(e, this);
    }


function showDelete(e, gridWidget) {
    if (gridWidget == undefined) {
        gridWidget = this;
    }
    var target = $('#deleteModal');
    var id = gridWidget.dataItem($(e.currentTarget).closest("tr")).id;
    gridname = '#' + gridWidget.element[0].id;
    target.find('#entryId').val(id);
    $('#PopupDeleteExceptionSection').css("display", "none");
    target.modal();
}


</script>

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Delete issue in grid with subgrids

2 Answers, 1 is accepted