2012-11-27 15 views
8

Veri kaynağında bir tarih alanına sahip kendo ızgaram var. Alanı görüntülerken, İngiltere tarih formatındaki 'dd/MM/yyyy' tarihini görüntülemek için bir şablon kullanıyorum. Sorun, filtreleme yaparken, tarih filtresini İngiltere biçiminde nasıl görüntüleyeceğimi bilmiyorum.kendo ui ızgara veri kaynağı süzme tarihi biçimi

Sahip olduğum bir başka sorun datetime türü yok, sadece tarih var, bu nedenle yalnızca tarihlere göre filtre uygulayamıyoruz.

Herhangi bir yardım veya fikir takdir edilecektir.

Bu kısmi görünümüdür (cshtml)

<script type="text/javascript"> 
$(document).ready(function() { 
    var date = new Date(); 
    var dateString = date.getMonth()+1 + "/" + date.getDate() + "/" + date.getFullYear(); 
    var url = '@Url.Action(AccountTypeController.GetAllocationGridData, new {id = Model.Id})'; 

    var dataSource = new kendo.data.DataSource({ 
     serverPaging: true, 
     serverSorting: true, 
     serverFiltering: true, 
     pageSize: 10, 
     transport: { 
      read: { 
       type: 'post', 
       dataType: 'json', 
       url: url 
      }, 
      parameterMap: function(options) { 
       if (options.filter) { 
        for (var i = 0; i < options.filter.filters.length; i++) { 
         if (options.filter.filters[i].field == 'Start' || options.filter.filters[i].field == 'End') { 
          options.filter.filters[i].value = kendo.toString(options.filter.filters[i].value, "MM/dd/yyyy"); 
         } 
        } 
       } 
       return options; 
      } 
     }, 
     schema: { 
      data: 'Data', 
      total: 'Count', 
      model: { 
       id: 'Id', 
       fields: { 
        Id: { type: 'number' }, 
        Start: { type: 'date' }, 
        End: { type: 'date' }, 
        Allocation: { type: 'number' } 
       } 
      } 
     }, 
     sort: { 
      field: "Start", 
      dir: "asc" 
     }, 
     filter:{ 
      logic: "and", 
      filters: [ 
       { 
        field: "End", 
        operator: "gt", 
        value: dateString 
       } 
      ] 
     } 
    }); 

    $('#account-allocation').kendoGrid({ 
     height: 383, 
     dataSource: dataSource, 
     columns: [ 
      { 
       field: 'Start', 
       title: 'Start Date', 
       template: '#= kendo.toString(Start,"dd/MM/yyyy HH:mm") #' 
      }, 
      { 
       field: 'End', 
       title: 'End Date', 
       template: '#= kendo.toString(End,"dd/MM/yyyy HH:mm") #' 
      }, 
      { 
       field: 'NoSpaces', 
       title: 'Number of Spaces', 
       filterable: false 
      }, 
      { 
       field: 'Id', 
       filterable: false, 
       title: 'Actions', 
       template: '<a class="link-lightbox" href="@Url.Action(AccountTypeController.UpdateAllocationAction1, AccountTypeController.Name)/#= Id #"><img src="@Url.Content("~/Content/img/grid-update.png")" alt="Update"/></a>', 
       width: 75 
      } 
     ], 
     filterable: true, 
     sortable: false, 
     scrollable: false, 
     pageable: true   
    }); 
</script> 

<div class="panel panel-w"> 
    <h2>@Model.Name Allocations 
      <a href="@Url.Action(AccountTypeController.SetAllocationAction1, new { id = Model.Id })" class="button link-lightbox"><span class="edit">Set Account Type Allocation</span></a> 
    </h2> 
    <div id="account-allocation"></div> 
</div> 
+0

: http://stackoverflow.com/questions/28232575/kendoui-grid-filter-date-format –

cevap

9

İlk İngiliz kültürüne karşılık gelen JavaScript dosyası içerir:

kendo.culture("en-GB"); 
:

<script src="http://cdn.kendostatic.com/2012.2.710/js/cultures/kendo.culture.en-GB.min.js"></script> 

Sonra şimdiki kültürünü ayarlamak için kendo.culture çağırmak

Kendo Grid otomatik olarak 'dd/MM/yyyy' biçimini kullanacaktır.

Kendo UI'nin küreselleşmeyle nasıl başa çıktığı hakkında daha fazla bilgi documentation adresinde bulunabilir. Burada gördüğünüz deneyebilirsiniz, ayrıca http://jsbin.com/onetol/1/edit

+0

Çalıştığınız İşte

bir canlı tanıtım olduğunu kusursuzca. Teşekkürler! –

İlgili konular