Kendo UI 不会在提交时重新加载

Question

我遇到了一个小问题。

我在另一个剑道网格内有一个剑道网格。当我添加我在主网格上选择的记录的新记录时，会出现此子网格。

那里没有问题，我遇到的不便是我想刷新网格而不刷新整个页面，因为我有太多记录并再次搜索该记录以添加新记录会有点乏味。

有人对此提出建议吗？

<script type="text/javascript" >
        $(document).ready(function() {

              {% if app.session.hasFlash('MensajeError') %}
                $("#mensajeFlashError").fadeIn('slow').delay(6000).fadeOut('slow');
              {%endif%}
              {% if app.session.hasFlash('Mensaje') %}
                $("#mensajeFlash").fadeIn('slow').delay(6000).fadeOut('slow');
              {%endif%}
              $("#grid").kendoGrid(
                                {
                                sortable: true,
                                filterable: true,
                                resizable:true, 
                                pageable:true, 
                                detailInit: detailInit, 
                                detailTemplate: kendo.template($("#template5").html()),
                                dataSource: 
                                {
                                     pageSize: 15,   
                                     transport: 
                                     {
                                         read: "{{path('slb_do_liquidaciones_listado',{ 'catalogo' : inhouse })}}",
                                     },
                                     schema: 
                                     {
                                         data: "data",
                                         total: function(response) 
                                         {
                                             return response.data.length;
                                         },
                                         model: 
                                         {
                                                 id: "id",
                                                 fields: 
                                                 {
                                                     id:{editable: false,type :"number"},
                                                     descripcion: { editable: false },
                                                     fecha_creacion: { editable: false },
                                                     usuario_creacion: { editable: false },
                                                 }
                                         }                      
                                     }
                             },

                             columns: 
                             [
                                     { field: "id",filterable: true, title: "No. DO",width: 70 },
                                     { field: "descripcion",filterable: true, title: "Descripcion",width: 310 },
                                     { field: "fecha_creacion",filterable: true, title: "Fecha",width: 70 },
                                     { field: "usuario_creacion",filterable: true, title: "Usuario",width: 100 },
                                     {command: [{ text: "Nuevo Rubro",imageClass:"k-icon k-add" ,click: showDetails }], title: "&nbsp;", width: "230px" }
                                    // { command: ["create"], title: "&nbsp;", width: "100px" }
                             ],
                             editable: "popup",
                             pageable: 
                             {
                                         //refresh: true,
                                     messages: 
                                     {
                                         display: "{0} - {1} de {2} DO", //{0} is the index of the first record on the page, {1} - index of the last record on the page, {2} is the total amount of records
                                         empty: "No existen Datos",
                                         page: "Página",
                                         of: "de {0}", //{0} is total amount of pages
                                         itemsPerPage: "Facturas por página",
                                         first: "Ir al Inicio",
                                         previous: "Previa",
                                         next: "Siguiente",
                                         last: "Ir al Final",
                                         refresh: "Actualizar"
                                     }
                             },
                             filterable: 
                             {
                                     messages: 
                                     {
                                         info: "", // sets the text on top of the filter menu
                                         filter: "Buscar", // sets the text for the "Filter" button
                                         clear: "Limpiar", // sets the text for the "Clear" button
                                         gte: "Mayor o igual a",
                                         and: "y",
                                         or: "o",
                                         eq: "Igual a",
                                     },
                                     operators: 
                                     {
                                         //filter menu for "number" type columns
                                         number: 
                                         {
                                             eq: "Igual a",
                                             neq: "Diferente a",
                                             gte: "Mayor o igual que",
                                             gt: "Mayor que",
                                             lte: "Menor o igual que",
                                             lt: "Menor que"
                                         },
                                         //filter menu for "date" type columns
                                         date: 
                                         {
                                             eq: "Igual a",
                                             neq: "Diferente a",
                                             gte: "Despues o igual a",
                                             gt: "Después de",
                                             lte: "Antes o igual a",
                                             lt: "Antes del"
                                         },
                                         //filter menu for foreign key values
                                         enums: 
                                         {
                                             eq: "Igual a",
                                             neq: "Dirferente a"
                                         }
                                     }

                                 },
                             }
                     );
               $(".tabstrip").kendoTabStrip(
                                  {
                                      animation: 
                                      {
                                          open: { effects: "fadeIn" }
                                      }
                                  });
                }); 

Answer 1

********************网格*******

$(document).ready(function() {
    $("#grid").kendoGrid({
        dataSource: {
            type: "odata",
            transport: {
                read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
            },
            schema: {
                model: {
                    fields: {
                        OrderID: { type: "number" },
                        Freight: { type: "number" },
                        ShipName: { type: "string" },
                        OrderDate: { type: "date" },
                        ShipCity: { type: "string" }
                    }
                }
            },
            requestEnd: onRequestEnd
        },

**************脚本**************************** *

function onRequestEnd(e) {

  if (e.type == "create") {
                      $("#SiteGrid").data("kendoGrid").dataSource.read();
       }
  else if (e.type == "update") {
                      $("#SiteGrid").data("kendoGrid").dataSource.read();

          }
}

Answer 2

我同意 Shaz.. 你也可以缩短 read 函数调用，如

 $("#grid").kendoGrid({
           dataSource:...,
            ..
            ..
            ,
            requestEnd: onRequestEnd
        })

    function onRequestEnd(e) {

      if (e.type == "create") {
                          e.sender.read();
           }
      else if (e.type == "update") {
                          e.sender.read();

              }
    }