it-roy-ru.com

jqGrid: отключить поля формы при редактировании

В настоящее время я занимаюсь разработкой веб-приложения, предназначенного для администрирования торговых автоматов и тому подобного. Я решил использовать jQuery, jQuery UI и jqGrid для этого проекта, поэтому я могу легко предоставить отличный и настраиваемый пользовательский интерфейс.
К сожалению, документация jqGrid довольно устарела и не охватывает все функции этого замечательного плагина (потому что он мне действительно нравится, хотя документация довольно скудная).

Во всяком случае, достаточно справочной информации, я полагаю. Давайте перейдем к сути:
Я использую панель навигации, встроенную в jqGrid, чтобы добавлять, редактировать и удалять элементы из сетки.
У меня это работает как шарм, за исключением одного: некоторые поля могут быть включены (или видны) только при добавлении нового элемента, но не в режиме редактирования (они должны быть скрыты и/или отключены) , 

Пример:
Компания, в которой я работаю, продает вендинговые башни и Есть несколько типов (разные размеры и прочее) этих башен. Когда новая башня добавляется к локации и введен в систему, тип должен быть установлен. Но башня не волшебным образом меняется со временем, так что это поле не может быть отредактировано позже.

Кто-нибудь знает, может ли это поведение быть достигнуто путем изменения некоторых параметров инициализации?
Возможно, это недокументированная опция редактирования (editoptions) или опция формы (formoptions)?
А может быть, у вас есть простое решение для этого?

Я хотел бы услышать ваше предложение/решения!
Спасибо =)

17
Arno Moonen

Вы можете реализовать свои требования по-разному. Например, внутри события beforeShowForm вы можете скрыть или показать 

jQuery("#list").jqGrid({
    colModel: [
        { name: 'Name', width: 200, editable: true },
   //...

}).jqGrid('navGrid','#pager', { edit: true, add: true, del: false},
          { // edit option
              beforeShowForm: function(form) { $('#tr_Name', form).hide(); }
          },
          { // add option
              beforeShowForm: function(form) { $('#tr_Name', form).show(); }
          });

где идентификатор "tr_Name" состоит из префикса "tr_", а "Name" - свойства name столбца из переменной colModel.

UPDATED: в ответ и в еще один показаны еще один способ динамического изменения свойств непосредственно перед инициализацией редактирования.

ОБНОВЛЕНО 2: Свободный jqGrid позволяет определить editable как функцию обратного вызова или как "disabled", "hidden" или "readonly". Смотрите статья в вики . Это позволяет легче реализовать те же требования.

36
Oleg

Чтобы сделать поле редактируемым или нет, вот что я запрограммировал после того, как некоторое время искал ответ (чтобы отключить редактирование при редактировании в строке, но разрешить его при добавлении) и не нашел нужного мне ответа:

colModel :[ 
    {name:'id', index:'id', editable:false, ...

    }).navGrid("#pager",{edit:false,add:true,del:false,search:false,refresh:true},
        {}, // edit
        {   
            beforeInitData: function(formid) {
                $("#list").jqGrid('setColProp','id',{editable:true});
            },
            afterShowForm: function (formid) {
                $("#list").jqGrid('setColProp','id',{editable:false});
            },
8
Alz

Это будет работать с бесплатным jqgrid, простым и понятным:

Этот конкретный пример позволит редактировать только в форме «добавить»:

editable: function (options) {
                            // Allow edit only for "add" not for "edit"
                            if (options.mode === "addForm")
                            {
                                return true;
                            }
                            else if (options.mode === "editForm")
                            {
                                return false;
                            }
                            else
                            {
                                return false;
                            }
0
Robert Smith

Видимый, но не редактируемый:

{ // edit option
    beforeShowForm: function(form) {
        $('#col_name', form).attr("disabled", true);
    }
}
0
Husni

Вот пример:

http://www.ok-soft-gmbh.com/jqGrid/CustomFormEdit.htm

                  beforeShowForm: function(form) {
                     $('#tr_Name', form).hide();
                  }
0
josemaria