Jqgrid поиск по датам не работает

Question

jq(function(){ 
    var token = window.location.href 
    .substring(window.location.href 
      .lastIndexOf('=') + 1); 
    jq("#grid").jqGrid({ 
     url:'/test/umpire/getFixtures', 
     datatype: 'json', 
     mtype: 'GET', 
     colNames:['Category', 'Tournament','Date', 'Ground','Team 1','Team 2','Umpire 1','Umpire2','Umpire 3','Match Refree','Match Obsrver','Scorer 1','Scorer 2'], 
     colModel:[ 
      {name:'categoryName',index:'categoryName', width:100,editable:true, editrules:{required:true}, editoptions:{size:10,readonly: 'readonly'}}, 
      {name:'tournamentName',index:'tournamentName', width:200,editable:true, editrules:{required:true}, editoptions:{size:10}}, 
      {name:'matchFromDate',index:'matchFromDate', width:100,formatter: "date",sorttype: "date",formatoptions:{srcformat: "U/1000", newformat: "m/d/Y"},search:true, searchoptions: {sopt: ['eq','ne'], 
       dataInit : function (elem) { 
        jq(elem).datepicker({dateFormat:'mm-dd-yy', changeYear: true, changeMonth: true, showButtonPanel: true, showOn: 'focus'}); 
       }}}, 
      {name:'groundName',index:'groundName', width:100,editable:true, editrules:{required:true}, editoptions:{size:10}}, 
      {name:'team1Name',index:'team1Name', width:150,editable:true, editrules:{required:true}, editoptions:{size:10}}, 
      {name:'team2Name',index:'team2Name', width:150,editable:true, editrules:{required:true}, editoptions:{size:10}}, 
      {name:'umpire1',index:'umpire1', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'umpire2',index:'umpire2', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'umpire3',index:'umpire3', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'matchRefree',index:'matchRefree', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'matchObserver',index:'matchObserver', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'scorer1',index:'scorer1', width:100,formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 
      {name:'scorer2',index:'scorer2', width:100, formatter: function (cellvalue, options, rowObject) { 
       return '<a href="/TNCA/umpire/assign?id=' + options.rowId + '&name='+cellvalue+'&token=${token}">'+cellvalue+'</a>'; 
      }}, 

     ], 



     postData:{ 


     filters:'{"groupOp":"AND","rules":[{"field":"matchFromDate","op":"gt","data":"2007-09-06"},{"field":"matchFromDate","op":"lt","data":"2007-10-04"}]}' 

     }, 
     editurl :"/test/home/?token=${token}", 
     rowNum:20, 
     shrinkToFit: true, 
     rowList:[10,20,30], 
     height: 400, 
     autowidth: true, 
     rownumbers: true, 
     pager: '#pager', 
     sortname: 'matchFromDate', 
     viewrecords: true, 
     height:"100%", 
     sortorder: "asc", 
     caption:"<h2>Assign Umpire</h2>", 
     emptyrecords: "Empty records", 
     loadonce: true, 
     loadComplete: function(response) { 
    console.log(JSON.stringify(response)) 

     }, 
     jsonReader : { 
      root: "rows", 
      page: "page", 
      total: "total", 
      records: "records", 
      repeatitems: false, 
      cell: "cell", 
      id: "tournamentID" 
     } 


    }); 

Привет, это мой код jqgrid. У меня проблема при поиске поля даты (matchFromDate). Я просмотрел многие ответы, представленные на этом форуме, но все же я не смог добиться поиска по дате.

От JSON я получаю дату, как эту версию «1432683305000»

Моего jQgrid является 4.8.2, и я использую Spring MVC.

Может ли кто-нибудь помочь мне в решении этой проблемы? Заранее спасибо

Answer 1

Мне кажется, что основная проблема в вашем коде - использование formatoptions:{srcformat: "U/1000"} в вашем коде. Такое свойство может форматировать код, но оно сохранит значения оригинала значений даты в данных локальной сетки. Позже вы пытаетесь использовать jQuery UI Datepicker, и у него есть проблема с использованием даты в формате. Вы можете использовать синтаксис @ (см. the documentation), но у вас все еще есть две проблемы. Первый: дата будет отображаться в формате datepicker в формате временной шкалы Unix, что не очень хорошо. Вторая проблема: formatoptions:{srcformat: "U/1000"} сохраняет даты без изменений (с указанием часов, минут, секунд ввода), но вы хотите игнорировать часов, минут, секунд и так далее от входных данных.

Поэтому я предлагаю вам использовать следующие свойства:

formatter: "date", formatoptions: {newformat: "m/d/Y"}, 
jsonmap: function (obj) { 
    var d = new Date(parseInt(obj.matchFromDate, 10)); 
    return d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate(); 
} 

с jsonmap, которые разрезают час, мин, ... части входных данных и преобразовать его в строку с форматом близко к ISO 8601.

The jsfiddle demo использует приведенный выше код и некоторые другие настройки, которые могут быть полезны для вас: шаблоны столбцов, onSelect callback datepicker и некоторые другие. Я использую free jqGrid (в настоящее время в версии 4.9 RC1) вместо Guriddo jqGrid JS 4.8.2, но я почти не использовал бесплатные специальные функции jqGrid (см. wiki), поэтому он также должен работать с Guriddo jqGrid.