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

On using editor template my grid is posting previous values to the controller

1 Answer 13 Views
Grid
This is a migrated thread and some comments may be shown as answers.
amit
Top achievements
Rank 1
amit asked on 27 Jan 2014, 05:11 PM
I am using an editor template for a popup editor and I have Image uploader inside that I want to place the new image name in a field. But instead, after updating I see the previous image name getting posted.

In the template this is the field.
=========================================================================================
<input type="file" name="file" id="dataPhoto" />
<script>
    $("#dataPhoto").kendoUpload({

        async: {
            saveUrl: '@Url.Action("ImageSave","Data")',
            autoUpload: true
        },
        multiple: false,
        success: function (data) {
            alert(data.response.fileName);
            $('#DatumImageName').val(data.response.fileName);
        }
    });
</script>
<div class="editor-field">
    @Html.TextBoxFor(model => model.DatumImageName)
</div>
========================================================================================
@model Lifetech.Service.ApiModels.DatumApiModel
@(Html.Kendo().Grid<Lifetech.Service.ApiModels.DatumApiModel>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(d => d.Title).Title("Title");
        columns.Bound(d => d.DatumImageName).ClientTemplate(
            "<img src='" + Url.Content("~/Images/Data/") +
            "#:data.DatumImageName#' alt='#: data.Title #' />"
            );

        columns.Bound(d => d.Description).Title("Description");
        columns.Bound(d => d.IsActive).Title("Is Active");
        columns.Bound(d => d.DisplayOrder).Title("Display Order");

        columns.Command(command => { command.Edit(); command.Destroy(); }).Title("Commands").Width(172);
    })        
    .ToolBar(toolbar => toolbar.Create())
        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("DataTemplate"))
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
               .Ajax()
                .PageSize(20)
                .Events(events => events.Error("error_handler"))
                .Model(model => model.Id(d => d.DataID))
                .Create(update => update.Action("Create", "Data", new { Id = ViewBag.ProductId }))
                .Read(read => read.Action("Read", "Data"))
                .Update(update => update.Action("Update", "Data"))
                .Destroy(update => update.Action("Destroy", "Data"))
    )
)
====================================================================================

If I edit the value in the textbox for the image name manually then it works, but I need it to be set through javascript as I have an image uploader.


Thanks,
Amit

1 Answer, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 29 Jan 2014, 02:25 PM
Hello Amit,

Updating the value of a input  inside the Grid Popop Window with JavaScript wont update the underlying model. You have to update the model with its set method. In your case you can get reference to the Grid model that being edit like so:

success : function (e) {
    $('#gridName').data('kendoGrid').editable.options.model.set('DatumImageName', e.reponse.fileName);
}

I hope this is what you are searching for.

Kind Regards,
Petur Subev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
amit
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Share this question
or