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

Hide Edit button in a group

2 Answers 152 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Derek
Top achievements
Rank 1
Derek asked on 23 May 2015, 03:15 PM

Hi

I used this code to hide Edit and Delete button if a column in the grid has value of 1

function onDataBoundgridCreditors(e) {
 
    var grid = $("#gridCreditors").data("kendoGrid");
    var gridData = grid.dataSource.view();
 
    for (var i = 0; i < gridData.length; i++) {
        var currentUid = gridData[i].uid;
        if (gridData[i].CREDITOR_SOURCE_ID == 1) {
            var currenRow = grid.table.find("tr[data-uid='" + currentUid + "']");
            var editButton = $(currenRow).find(".k-grid-edit");
            editButton.hide();
            var deleteButton = $(currenRow).find(".k-grid-delete");
            deleteButton.hide();
        }
    }
}

I added a group and now gridData[i].CREDITOR_SOURCE_ID  from the function above is not recognize.

What should I use to hide the buttons in the group?

Here is the grid:

@(Html.Kendo().Grid<ShowCreditCheck>()
    .Name("gridCreditors")
.Columns(columns =>
{
    columns.Bound(c => c.CREDITOR_ID).Hidden(true);
    columns.Bound(c => c.ASSIGNMENT_ID).Hidden(true);
    columns.Bound(c => c.ACCOUNT_REFERENCE).Title("Ref#").Width(70).HtmlAttributes(new { title = " #= ACCOUNT_REFERENCE # " });
    columns.Bound(c => c.CREDITOR_TYPE).Title("Type").Width(90);
    columns.Bound(c => c.creditorClass).Title("Class").Width(70);
    columns.Bound(c => c.CREDITOR_NAME).Title("Creditor").Width(110);
    columns.Bound(c => c.CREDITOR_SOURCE).Title("Source").Width(80);
    columns.Bound(c => c.applicantNumber).Title("Applicant").Width(60);
    columns.Bound(c => c.CREDIT_CHECK_CURRENT_BALANCE).Title("Balance").Width(60).Format("{0:#,##}").HtmlAttributes(new { style = "text-align:right" })
                        .ClientFooterTemplate("<div style='text-align:right'>#= kendo.format('{0:0,00}', sum)#</div>")
                        .ClientGroupFooterTemplate("<div style='text-align:right'>#= kendo.format('{0:0,00}', sum)#</div>");
    columns.Bound(c => c.DATE_CREATED).Title("Checked").Width(75).Format("{0:dd/MM/yyyy}");
    columns.Bound(c => c.CREDITOR_SOURCE_ID).Hidden(true);
    columns.Bound(c => c.OWNER_ID).Hidden(true);
    columns.Bound(c => c.CREDIT_STATUS_ID).Hidden(true);
    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(70);
})
.ToolBar(toolbar => toolbar.Create().Text("Add Creditor"))
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ProvidedCreditCheckTemplate"))
.Pageable(pager => pager.Refresh(true))
.Sortable()
.Scrollable()
.Resizable(resize => resize.Columns(true))
.HtmlAttributes(new { style = "height:420px;" })
.Events(e => e.DataBound("onDataBoundgridCreditors"))
.Groupable()
.DataSource(dataSource => dataSource
    .Ajax()
    .PageSize(20)
    .Group(group => group.Add(p => p.creditorClass))
    .ServerOperation(false)
    .Aggregates(aggregates =>
    {
        aggregates.Add(p => p.CREDIT_CHECK_CURRENT_BALANCE).Sum();
    })
    .Events(events => events.Error("error_handlerCreditorProvided"))
    .Model(model => model.Id(p => p.CREDITOR_ID))
    .Create(update => update.Action("GridCreditCheck_Create", "Home", new { id = Model.Item1.ASSIGNMENT_ID }))
    .Read(read => read.Action("GridCreditCheck_Read", "Home", new { id = Model.Item1.ASSIGNMENT_ID }))
    .Update(update => update.Action("GridCreditCheck_Update", "Home"))
    .Destroy(update => update.Action("GridCreditCheck_Destroy", "Home"))
)
 
)

2 Answers, 1 is accepted

Sort by
0
Dimiter Madjarov
Telerik team
answered on 25 May 2015, 12:45 PM

Hello Derek,

In this case the view() method of the dataSource returns a collection of the groups, not the rows, which is the reason for the unexpected behavior. As a workaround you could iterate the Grid rows directly instead of the dataSource items.
E.g.

function dataBound(e) {
    var grid = this;
 
    grid.tbody.find("tr[role='row']").each(function () {
        var dataItem = grid.dataItem(this);
 
        if (dataItem.UnitPrice > 30) {
            $(this).find(".k-grid-delete").remove();
        }
    });
}

In the above example I am removing the delete button for items with UnitPrice above 30.

Regards,
Dimiter Madjarov
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Derek
Top achievements
Rank 1
answered on 25 May 2015, 01:23 PM

Thank you!

Worked.

Tags
Grid
Asked by
Derek
Top achievements
Rank 1
Answers by
Dimiter Madjarov
Telerik team
Derek
Top achievements
Rank 1
Share this question
or