ClientEvent onEdit arguments all undefined (mode, dataItem, etc)

[Steve]

Hi,

     I tried to intercept "Edit" ClientEvent and argument properties are all undefined.  

 Here is the function and alerts are displayed, so I know the event is called.  What did I miss?

 

Thank you

        function onEdit(e)
        {
            alert(e.dataItem);
            alert(e.mode);
            alert(e.form);
            alert(e.isNew);
            if (e.mode == "edit" && (typeof e.dataItem != 'undefined') && (e.dataItem != null)) {
                alert('a');
                $(e.form).find('#Description').hide();
            }

        }

[Slav]

Hello Steve,

The API of the Edit event data object is a bit different than the one used in the code snippet you sent. You can check the following help article for more information: http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-edit

The updated example will look similar to the following code snippet:

<script>
    function onEdit(e) {
        alert(e.model);
        alert(e.model.isNew());
        if (!e.model.isNew() && (e.model != 'undefined') && (e.model != null)) {
            alert('a');
        }
    }
</script>

As for the part that uses e.form most probably you are using it to modify the edit container element. If this is the case, you can use e.container, which is covered in the linked article, for this purpose.

 

Regards,
Slav
Telerik

[Steve]

Thank you, it helps me a lot.

I have a little problem with container, I would like to hide or disable column description for this row according to value in number column.  the find seems to work, but I don't see how to hide the column.

e.container.find("input[name=description]").hide();

Thank you

 

[Slav]

Hello Steve,

I am not sure I completely understand your scenario. I guess you are trying to hide some of the fields in the edit form. If this is the case, you can find attached a sample Home View that shows how to hide an input field when editing a record from the grid in the following example: https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/grid/ajax-editing

If this is not what you are after, please modify the sample so that it matches your scenario. This will allow me to inspect your setup and provide a more to the point answer.

 

Regards,
Slav
Telerik

[Steve]

Thank you, it is exactly what I want to do, but hide does not seems to work.  Here is th code:

 

Thank you

 

@(Html.Kendo().Grid<DataModel.TM.PROJECTS>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Command(command => command.Edit()).Width(40);
        columns.Command(command => command.Destroy().Text(" ").HtmlAttributes(new { style = "width:15px;", cssClass = "k-icon k-i-close", title = "Delete" })).Width(40);
        columns.Bound(p => p.PNUMBER).Title("Numéro").Width(140);
        columns.Bound(p => p.DESCRIPTION).Title("Description").Width(200);
        columns.Bound(p => p.STARTDATE).Title("Date de début").Format("{0: yyyy-MM-dd}").Width(100);
        columns.Bound(p => p.ENDDATE).Title("Date de fin").Format("{0: yyyy-MM-dd}").Width(100);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create();
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Pageable()
    .Navigatable()
    .Sortable(s => s.SortMode(GridSortMode.MultipleColumn))
    .Scrollable()
    .Groupable()
    .Filterable()
    .AllowCopy(true)
    .Events(e => e.Edit("onEdit"))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .PageSize(20)
        .ServerOperation(false)
        .Events(events => events.Error("telerikErrorHandler"))
        .Model(model => model.Id(p => p.ID))
        .Create("Create", "Project")
        .Read("Read", "Project")
        .Update("Update", "Project")
        .Destroy("Delete", "Project")
        .Sort(s => s.Add(p => p.PNUMBER))
    )

)

    <script type="text/javascript">
        function onEdit(e)
        {
            //alert(e.model);
            //alert(e.model.isNew());
            if (!e.model.isNew() && (e.model != 'undefined') && (e.model != null)) {
                //alert('a');
                //e.container.find("input[name=description]").hide();
                e.container.find("#Description").parent().hide().prev().hide();
            }

        }
    </script>

[Steve]

It works.  It was only because my title is Description, but my model is DESCRIPTION.

 

Thank you

[Slav]

Hello Steve,

Indeed, I should have clarified that the id attribute of the input field is based on the corresponding property of the utilized model, which in your case appears to be DESCRIPTION.

 

Regards,
Slav
Telerik