Telerik Forums
UI for ASP.NET MVC Forum
2 answers
1.6K+ views

I'm using the Grid with ServerOperation disabled and PopUp editing. I wanted to use bootstrap style edit and delete buttons and a custom delete confirmation message, so I added a Template column with a ClientTemplate containing the buttons. The buttons have an onclick pointing at my javascript functions. The edit button is working successfully and calling the server action, but the delete button does not hit the server action. I've verified through Chrome Developer Tools that my javascript is being hit and it does execute the grid.removeRow(item); line without any errors, but after that nothing happens. The row remains in the grid and the delete action isn't hit (or called as far as I can tell from the Network tab.) What am I missing? 

 

    @(Html.Kendo().Grid<BirthdayAddOnEditVM>(Model.ViewModel.AddOns)
      .Name(Html.NameFor(m => m.ViewModel.AddOns).ToString())
      .DataSource(dataSource => dataSource
          .Ajax()
          .Model(model => { model.Id(p => p.ID); model.Field(p => p.ID).DefaultValue(Guid.Empty); })
          .PageSize(4)
          .ServerOperation(false)
          //.Read(read => read.Action("BirthdayItems_Read", "Birthdays"))
          .Create(create => create.Action("BirthdayItems_Save", "Birthdays"))
          .Update(update => update.Action("BirthdayItems_Save", "Birthdays"))
          .Destroy(destroy => destroy.Action("BirthdayItems_Delete", "Birthdays").Type(HttpVerbs.Post))
          .Events(events => events.Error("function(e){ gridError(e, '" + Html.IdFor(m => m.ViewModel.AddOns) + "'); }" ))
      )
      .Columns(columns =>
      {
          columns.Bound(c => c.Name).Title("Add-On");
          columns.Bound(c => c.Price).Format("{0:C}");
          columns.Bound(c => c.PublishOnWebsite).ClientTemplate("<input type=\"checkbox\" disabled #: (PublishOnWebsite ? 'checked' : '')# />");
          columns.Bound(c => c.AllowForOnlinePurchase).ClientTemplate("<input type=\"checkbox\" disabled #: (AllowForOnlinePurchase ? 'checked' : '')# />");
          columns.Command(command => { command.Edit().Text(""); command.Destroy(); }).Width(180);
          columns.Template(t => { }).HeaderTemplate("").ClientTemplate(@"
                            <button type='button' onclick='editGridRow(this)' class='btn btn-primary btn-xs'><span class='glyphicon glyphicon-pencil' title='Edit'></span></button>
                            <button type='button' onclick='deleteGridRow(this)' class='btn btn-danger btn-xs'><span class='glyphicon glyphicon-remove' title='Delete'></span></button>");
      })
      .ToolBar(toolbar =>
      {
          toolbar.Template(@<text>
                            <span class="col-sm">Add-Ons</span>
                            <span><button type="button" class="btn btn-primary btn-xs" onclick="createGridRow(this)" title="Add New"><span class="glyphicon glyphicon-plus"></span></button></span>
                    </text>);
                })
      .Editable(editable => editable.Mode(GridEditMode.PopUp).DisplayDeleteConfirmation(false))
      .Pageable()
      .Selectable(selectable =>
                  {
                      selectable.Mode(GridSelectionMode.Multiple);
                      selectable.Type(GridSelectionType.Row);
                  })
      .Sortable(sortable =>
                  {
                      sortable.SortMode(GridSortMode.SingleColumn);
                  })
      //.ColumnMenu()
      //.Navigatable()
      //.Filterable()
      //.Scrollable()
      .Deferred()
)

 

function editGridRow(elem) {
    var $elem = $(elem);
    var grid = $elem.closest("div[data-role='grid']").data("kendoGrid");
    var item = grid.dataItem($elem.closest("tr"))
 
    grid.editRow(item);
}
 
function deleteGridRow(elem){
    var $elem = $(elem);
    var grid = $elem.closest("div[data-role='grid']").data("kendoGrid");
    var item = grid.dataItem($elem.closest("tr"))
 
    if (confirm("Are you sure you want to delete " + item.Name + "?") === true)
        grid.removeRow(item);    //This gets hit
}
 public class BirthdaysController : Controller
{
    [HttpPost]
    public ActionResult BirthdayItems_Delete([DataSourceRequest]DataSourceRequest request, BirthdayAddOnEditVM birthdayItem)
    {
        //Never called
        ...
    }
}

 

As you may have noticed, I added the default edit and delete command buttons back in for testing. That delete button does call sever delete action. So I feel like grid.removeRow is not the right thing to use in my function, but that's what I've seen in all the examples. 

Jesse
Top achievements
Rank 1
Veteran
 answered on 07 Nov 2017
2 answers
166 views

Hi there, i am running into an issue, i have a nested TabStrip. On the CONTROL CENTER Tab, if i select a page, the page is added to the NESTED PAGES TabStrip. The problem is that when i click on the previous tabs, the data from the newly added tab shows up in the existing tab(N PAGE 1 - N PAGE 3) 

 

How do i fix this problem ?.

Thanks

Chinonso
Top achievements
Rank 1
 answered on 07 Nov 2017
1 answer
249 views

Here is what I am trying to achieve in a nutshell:

 

User filters/sorts grid in whatever way they desire. User leaves page and comes back to said grid in the same state that it was left in. Is there any way to do this through event handlers/without using buttons?

 

Thanks!

Viktor Tachev
Telerik team
 answered on 07 Nov 2017
3 answers
181 views

Upgrading from 2016.1.112 to 2017.3.1026 has broken every single one of my controls. (Large Project)..

I can not seem to find the root of my problem. 

I do know I can't find this file src="/Scripts/kendo/2017.3.1026/jszip.min.js"

Running on MVC 5. ASP.NET

/// <autosync enabled="true" />
/// <reference path="accounting.js" />
/// <reference path="ai.0.15.0-build58334.min.js" />
/// <reference path="bootstrap.js" />
/// <reference path="dispatchboard.js" />
/// <reference path="gridstack/gridstack.jqueryui.min.js" />
/// <reference path="gridstack/gridstack.min.js" />
/// <reference path="jquery.signalr-2.1.2.min.js" />
/// <reference path="jquery.timeliner.js" />
/// <reference path="jquery.unobtrusive-ajax.js" />
/// <reference path="jquery-1.10.2.js" />
/// <reference path="jsnlog.min.js" />
/// <reference path="kendo.modernizr.custom.js" />
/// <reference path="kendo/2017.3.1026/angular.min.js" />
/// <reference path="kendo/2017.3.1026/jquery.min.js" />
/// <reference path="kendo/2017.3.1026/jszip.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.all.js" />
/// <reference path="kendo/2017.3.1026/kendo.all.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.angular.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.angular2.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.aspnetmvc.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.autocomplete.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.binder.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.button.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.calendar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.color.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.colorpicker.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.columnmenu.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.columnsorter.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.combobox.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.core.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.data.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.data.odata.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.data.signalr.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.data.xml.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.barcode.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.chart.funnel.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.chart.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.chart.polar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.core.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.diagram.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.gauge.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.map.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.mobile.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.qrcode.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.sparkline.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.stock.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.themes.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dataviz.treemap.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.datepicker.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.datetimepicker.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dom.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.draganddrop.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.drawing.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.dropdownlist.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.editable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.editor.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.excel.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.filebrowser.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.filtercell.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.filtermenu.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.fx.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.gantt.list.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.gantt.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.gantt.timeline.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.grid.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.groupable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.imagebrowser.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.list.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.listview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.maskedtextbox.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.menu.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.actionsheet.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.application.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.button.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.buttongroup.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.collapsible.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.drawer.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.listview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.loader.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.modalview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.navbar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.pane.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.popover.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.scroller.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.scrollview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.shim.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.splitview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.switch.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.tabstrip.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.mobile.view.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.multiselect.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.notification.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.numerictextbox.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.ooxml.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.pager.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.panelbar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.pdf.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.pivot.configurator.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.pivot.fieldmenu.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.pivotgrid.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.popup.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.progressbar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.reorderable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.resizable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.responsivepanel.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.router.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.agendaview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.dayview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.monthview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.recurrence.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.timelineview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.scheduler.view.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.selectable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.slider.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.sortable.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.splitter.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.spreadsheet.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.tabstrip.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.timepicker.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.timezones.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.toolbar.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.tooltip.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.touch.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.treelist.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.treeview.draganddrop.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.treeview.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.upload.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.userevents.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.validator.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.view.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.virtuallist.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.web.js" />
/// <reference path="kendo/2017.3.1026/kendo.web.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.webcomponents.min.js" />
/// <reference path="kendo/2017.3.1026/kendo.window.min.js" />
/// <reference path="kendo/2017.3.1026/pako_deflate.min.js" />
/// <reference path="loading-overlay.js" />
/// <reference path="location.js" />
/// <reference path="modernizr-2.6.2.js" />
/// <reference path="npm.js" />
/// <reference path="qtip/jquery.qtip.min.js" />
/// <reference path="quote.js" />
/// <reference path="respond.js" />
/// <reference path="smartapp.js" />
/// <reference path="smartbar.js" />
/// <reference path="ThemeCookie.js" />
/// <reference path="toastr.min.js" />
/// <reference path="utility.js" />

 

Nikolay Mishev
Telerik team
 answered on 07 Nov 2017
2 answers
878 views

Hi,
We have a grid mvc which use a TemplateName property to Popup window, the template named="ETOrdenDetail", this template contains another GridMVC, and one of columns use an Edit Template into column "columns.Bound(c => c.ITEM.ITEMNO_ITEMDESC).Title("Item").EditorTemplateName("ETItem");". 

So if we run the Project we receive an error, here details:

 

Main view: ListOrden

            @(Html.Kendo().Grid<NEW.Models.VW_ORDENHD>()
                        .Name("grid")
                        .Columns(columns =>
                        {
                            columns.Bound(c => c.ORDERID).Visible(false);
                            columns.Bound(c => c.ORDERNO).Title("Orden #");
                            columns.Bound(c => c.FECHA_ENTREGA).Title("Entregar el");
                            columns.Bound(c => c.CONTACTO).Title("Contacto");
                            columns.Bound(c => c.EMAIL).Title("Email");
                            columns.Bound(c => c.OBSERVACION).Title("Observacion").Filterable(false);
                            columns.Bound(c => c.ACTIVO.DESCRIPCION);
                            columns.Command(command =>
                            {
                                command.Edit().HtmlAttributes(new { style = "background-color:#81DAF5; border-color:#A4A4A4" });
                                command.Destroy().HtmlAttributes(new { style = "background-color:#81DAF5; border-color:#A4A4A4" });
                                //command.Custom("fnEditAcciones").Text("Editar");
                                //command.Custom("fnEditAcciones").Text("Eliminar");
                            });
                        })
                        .HtmlAttributes(new { style = "height: 550px;" })
                        .Scrollable()
                        .ToolBar(toolbar =>
                        {
                            toolbar.Create().Text("Agregar Orden").HtmlAttributes(new { style = "background-color:#A0C331; border-color:#A4A4A4" });
                        })
                        //.Groupable()
                        .Sortable()
                        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ETOrdenDetail").Window(w=>w.Title("Orden de Compra")))
                        .Events(events =>
                        {
                            events.Edit("fnEditAcciones");
                            events.Save("fnSaveAcciones");
                            events.Remove("fnRemoveAcciones");
                            events.DataBound("fnDataBound");
                        })
                        .Filterable(m => m.Mode(GridFilterMode.Row))
                        .Pageable(pageable => pageable
                                    .Refresh(true)
                                    .PageSizes(true)
                                    .ButtonCount(3))
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .ServerOperation(true)
                            .Model(model =>
                            {
                                model.Id(p => p.ORDERID);
                                model.Field(p => p.ACTIVO).DefaultValue(
                                        ViewData["cmbACTIVODefault"] as NEW.Models.VW_ACTIVO
                                        );
                            })
                            .PageSize(8)
                            .Read(read => read.Action("GetOrdenesHD", "Orden"))
                            .Create(update => update.Action("AddOrdenHD", "Orden"))
                            .Update(delete => delete.Action("ActualizarOrdenHD", "Orden"))
                            .Destroy(destroy => destroy.Action("BorrarOrdenHD", "Orden"))
                        )

            )

 

 

Template for Popup: ETOrdenDetail.cshtml

Please note: c.ITEM.ITEMNO_ITEMDESC, which contains another Template.  Here display the problema.

@model NEW.Models.VW_ORDENHD
    <div class="container">
        <div class="row">
            <div class="col-md-3">
                # Orden:           
                @Html.EditorFor(m => m.ORDERNO, "ETTextBox")
                @Html.EditorFor(m => m.ORDERID, new { style="display:none" })
            </div>
            <div class="col-md-3">
                Fecha Entrega:
                @Html.EditorFor(m => m.FECHA_ENTREGA, "ETDatePicker")
            </div>
            <div class="col-md-3">
                Activo:
                @Html.EditorFor(m => m.ACTIVO.STATUS, "ETCheckBox")
            </div>
        </div>
        <div class="row">
            <div class="col-md-3">
                Contacto:
                @Html.EditorFor(m => m.CONTACTO, "ETTextBox")
            </div>
            <div class="col-md-3">
                Email:
                @Html.EditorFor(m => m.EMAIL, "ETEmail")
            </div>
        </div>
        <div class="row">
            <div class="col-md-9">
                Observacion:
                @Html.EditorFor(m => m.OBSERVACION, "ETTextArea")
            </div>
        </div>
        <br />
        @(Html.Kendo().Grid<NEW.Models.VW_ORDENDT>()
                            .Name("gridDetail")
                            .Columns(columns =>
                            {
                                //columns.Bound(c => c.ORDERID).Visible(false);
                                columns.Bound(c => c.ORDERDETAILID).Visible(false);
                                columns.Bound(c => c.ITEMID).Visible(false);
                                columns.Bound(c => c.ITEM.ITEMNO_ITEMDESC).Title("Item").EditorTemplateName("ETItem");
                                columns.Bound(c => c.CANTIDAD).Title("Cantidad");
                                columns.Command(command =>
                                {
                                    command.Edit().HtmlAttributes(new { style = "background-color:#81DAF5; border-color:#A4A4A4" });
                                    command.Destroy().HtmlAttributes(new { style = "background-color:#81DAF5; border-color:#A4A4A4" });
                                });
                            })
                            .HtmlAttributes(new { style = "height: 300px;" })
                            .Scrollable()
                            .ToolBar(toolbar =>
                            {
                                toolbar.Create().Text("Agregar Item").HtmlAttributes(new { style = "background-color:#A0C331; border-color:#A4A4A4" });
                            })
                            .Sortable()
                            .Editable(editable => editable.Mode(GridEditMode.InLine).DisplayDeleteConfirmation(false))
                            .Events(events =>
                            {
                                //events.Edit("fnDetailEditAcciones");
                                events.Save("fnDetailSaveAcciones");
                                events.Remove("fnDetailRemoveAcciones");
                            })
                            .Pageable(pageable => pageable
                                        .Refresh(true)
                                        .PageSizes(true)
                                        .ButtonCount(3))
                            .DataSource(dataSource => dataSource
                                .Ajax()
                                .Model(model =>
                                {
                                    model.Id(p => p.ORDERDETAILID);
                                    model.Field(p => p.ITEM).DefaultValue(
                                            new NEW.Models.VW_ITEM { ITEMID = 0, ITEMNO = "", ITEMDESC = "Item no seleccionado" }
                                            );
                                })
                            .PageSize(75)
                            .Read(read => read.Action("GetOrdenesDT", "Orden"))
                            .Create(update => update.Action("AddOrdenDT", "Orden"))
                            .Update(delete => delete.Action("UpdateOrdenDT", "Orden"))
                            .Destroy(destroy => destroy.Action("EliminarDT", "Orden"))
                            )
        )
    </div>

 

Edit Template: ETItem.cshtml

@(Html.Kendo().ComboBox()
                      .Name("ITEM")
                      .DataTextField("ITEMNO_ITEMDESC")
                      .DataValueField("ITEMID")
                      .Placeholder("Seleccione el item...")
                      .Filter(FilterType.Contains)
                      .DataSource(source =>
                      {
                          source.Read(read =>
                          {
                              read.Action("GetItems", "Orden");
                          })
                          .ServerFiltering(false);
                      })
                      .AutoBind(false)
          .HtmlAttributes(new { style = "width:100%;" })
)

 

Basically the last edit template display error:

browser console error:

VM3036:1 Uncaught SyntaxError: Invalid or unexpected token
    at eval (<anonymous>)
    at http://localhost:13532/NEW/Scripts/jquery-1.12.4.min.js:2:2651
    at Function.globalEval (http://localhost:13532/NEW/Scripts/jquery-1.12.4.min.js:2:2662)
    at Ha (http://localhost:13532/NEW/Scripts/jquery-1.12.4.min.js:3:21262)
    at n.fn.init.append (http://localhost:13532/NEW/Scripts/jquery-1.12.4.min.js:3:22791)
    at M.fn.init.n.fn.(anonymous function) [as appendTo] (http://localhost:13532/NEW/Scripts/jquery-1.12.4.min.js:3:24510)
    at init._createPopupEditor (http://localhost:13532/NEW/Scripts/kendo/kendo.all.min.js:49:14769)
    at init.editRow (http://localhost:13532/NEW/Scripts/kendo/kendo.all.min.js:49:12005)
    at init.addRow (http://localhost:13532/NEW/Scripts/kendo/kendo.all.min.js:49:19823)
    at HTMLAnchorElement.<anonymous> (http://localhost:13532/NEW/Scripts/kendo/kendo.all.min.js:49:20638)

 

Detail error from browser console :

 jQuery(function(){jQuery("\#gridDetail").kendoGrid({"save":fnDetailSaveAcciones,"remove":fnDetailRemoveAcciones,"columns":[{"title":"Item","headerAttributes":{"data-field":"ITEM.ITEMNO_ITEMDESC","data-title":"Item"},"field":"ITEM.ITEMNO_ITEMDESC","encoded":true,"editor":"<input id=\"ITEM\" name=\"ITEM\" style=\"width:100%;\" type=\"text\" /><script>
 jQuery(function(){jQuery(\"#ITEM\").kendoComboBox({\"dataSource\":{\"transport\":{\"read\":{\"url\":\"/NEW/Orden/GetItems\"},\"prefix\":\"\"},\"schema\":{\"errors\":\"Errors\"}},\"dataTextField\":\"ITEMNO_ITEMDESC\",\"filter\":\"contains\",\"autoBind\":false,\"dataValueField\":\"ITEMID\",\"placeholder\":\"Seleccione el item...\"});});

 

So, my question is: can we use nested edit template? or we need to do something else in order to work?

 

Thanks,

David,

Jose
Top achievements
Rank 1
 answered on 07 Nov 2017
3 answers
216 views

I am absolutely new to Kendo and I am developing an Event Scheduler in MVC. The problem I'm trying to solve is to validate an recurrence and displaying in the form of an alert/notification message, the date/time of the slots that are occupied i. The slots that passes validation should be saved.  Could someone point me in the right direction.

Thanks 

Phil

Nencho
Telerik team
 answered on 07 Nov 2017
3 answers
742 views

 

Is it possible to using the new grouping when binding to local data?

 My current code is:

.DataSource(ds => ds
    .Custom()
    .Group(g => g.Add("ParentTaskName", typeof(string)))
    .Transport(transport => transport
        .Read(read =>
        {
            read.Action("TaskEditor_Read", "TimeEntry").Data("GetClosestTicketId()");
        })))

I, however, don't want to use a datasource, I want to bind my dropdown to local data using .BindTo(.....) but still group by the ParentTaskName.

Is this possible?

Ivan Danchev
Telerik team
 answered on 07 Nov 2017
2 answers
474 views

Hello,

in my ASP.NET MVC application I have a Kendo Button that is calling a controller action. While this action is working I'm showing a Kendo progress control. The controller action is a long running action that is updating several database items. In addition to my current solution I'm searching for a solution to show the progress of the long running action (e.g. display "Updated x of y items").

This is extract of my current solution:

View:

        @(Html.Kendo().Button()
              .Name("updateItems")
              .Content("Update items")
              .Events(events => events.Click("onClickUpdateItems")))
 
<script>
    function onClickUpdateItems() {
        kendo.ui.progress($("#content"), true);
        var items = getAllItems();
        $.ajax({
                type: "POST",
                url: "@Url.Action("UpdateItems", "Item")",
                data: JSON.stringify({
                    items: items
                }),
                contentType: "application/json"
            })
        kendo.ui.progress($("#content"), false);
</script>

 

In the corresponding controller action I iterate over all passed items. While the action is running I want to show the user how many items have been processed. Is there any possibility to realise this?

Regards

Raphael

Raphael
Top achievements
Rank 1
 answered on 07 Nov 2017
7 answers
4.3K+ views
I admit it, NuGet has spoiled me.

Will there be a NuGet package for KendoUI MVC? If so, is that only for Open Source projects, or can licensed users ship with the binary installed by NuGet?

Thanks,
BOb
Gordon
Top achievements
Rank 1
 answered on 06 Nov 2017
1 answer
247 views

Hello!

I would like to upload a file to the server and also write some data into SQL database after the user fills a form with those metadata. I used the widget this way:

 

@Html.Kendo().Upload().Name("docUpload").Async(a => a.Save("UploadFile", "Dokumentum", new { id = Model.Id }).AutoUpload(false)).Multiple(true).Events(ev => ev.Upload("onUpload").Error("onError").Success("onSuccess"))

 

The widget first calls onUpload javascript that calls the action that stores the metadata in SQL (input parameter is json). This action returns empty content if successful, or content with the error message if fails.

Either the first action was successful or failed, the widget calls the UploadFile action, that stores the file on the server (input parameter is HttpPostedFileBase). This action also returns with an empty content if it was successful.

This is works perfectly. My problem is, that what if the metadata writing fails (because of some validation or anything) and the file will be copied to the server. Or the metadata writing is successful but the file store fails. I would like the widget returns successful message only if both are successful or error message if one of them fails (of course the other action shouldn't be executed).

 

Here's the onUpload javascript:

function onUpload(e){
 
var json=new Object();
json["json"]=JSON.stringify({...blah-blah});
 
$.ajax({
url: '@Url.Action("Save,"Controller"),
async: false,
type:"POST",
data:json,
dataType:'json',
success:function(result){},
error:function(error){}
});
}

Thanks for your help

Neli
Telerik team
 answered on 06 Nov 2017
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
+? more
Top users last month
Top achievements
Rank 1
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ivory
Top achievements
Rank 1
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
YF
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Top achievements
Rank 1
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ivory
Top achievements
Rank 1
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
YF
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?