JQGrid / Дата, выбранная в окне добавления / редактирования

Question

Мне удалось использовать Date Picker в JQGrid при редактировании inline, но я не могу использовать его в окне добавления / редактирования. У кого-нибудь есть инструкции как это сделать или пример, который я могу посмотреть?

демонстрация того сайта о том, что я пытаюсь сделать: http://www.the-di-lab.com/demo/apples

Я прочитал, что могу использовать следующий метод, но не уверен, как его интегрировать:

dataInit : function (elem) {
$(elem).datepicker();
}

Answer 1

Похоже, что они используют afterShowForm для прикрепления палитры даты / цвета к div.
(просмотреть исходный код)

. JQuery("# список") navGrid("# пейджера", {редактировать: правда, добавить: правда, дель: истинно},
                     {Ширина:400, высота:400,closeAfterEdit: правда,
            afterShowForm:function(){   $("#jsrs").load("/demo/apple / jsrs"); },
            onclickSubmit: function () {$ ("# jsrs"). empty (); }
},

(просмотреть исходный код)

http://www.the-di-lab.com/demo/apples/jsrs

// Js для colorPicker
$('# Цвет').ColorPicker({
    onSubmit: function(hsb, hex, rgb) {
        $('# Цвет') вал ("#"+ шестигранный).
    },
    onBeforeShow: function () {
        $(Это).ColorPickerSetColor(this.value);
    }
}).bind('keyup', function(){
    $(Это).ColorPickerSetColor(this.value);
});


//Js для datePicker
$('# Дата').DatePicker({
    Формат: 'Ут-d',
    date: $ ('# date'). val (),
    текущий: $ ('# date'). val (),
    начинается: 1,
    положение: "низ",
    onBeforeShow: function(){
        $('#date').DatePickerSetDate($('#date').val(), true);
    },
    onChange: функция (форматированная, даты) {
        $ ('# Дата') Вал (отформатированный).
    }
    });

Спасибо, что нашли этот пример, я тоже искал, как это сделать.

Answer 2

Добавление DatePicker является простой задачей:

colModel: [
  ... other column definitions ...
  {
    name:'my_date', index:'my_date', label: 'Date', width: 80,
    editable: true, edittype: 'text',
    editoptions: {
      size: 10, maxlengh: 10,
      dataInit: function(element) {
        $(element).datepicker({dateFormat: 'yy.mm.dd'})
      }
    }
  },
  ... other column definitions ...
]

Конечно, вместо .datepicker Вы можете использовать любой плагин, как ColorPicker или автозаполнение.

Answer 3

Используйте этот код для добавления указателя даты в диалог создания / редактирования:

.navGrid('#yourID',
                { edit: true, add: true, del: true, search: true }, //options
                {
                    ...  
                    onInitializeForm: function() {
                       $('#yourDate').datepicker(); 
                     },
                    onClose: function() {
                       //if you close dialog when the datepicker is shown
                       $('.hasDatepicker').datepicker("hide")
                    }
                },
                ...