Пользовательское решение типа редактирования jqGrid с несколькими флажками

Для тех из вас, кто пытается понять пользовательские типы редактирования jqGrid...

Я создал элемент формы с несколькими флажками и решил поделиться. Это было построено с использованием версии 3.6.4. Если у кого-то есть более эффективное решение, пожалуйста, поделитесь им.

В colModel соответствующие поля редактирования выглядят следующим образом:

edittype:'custom'
editoptions:{ custom_element:MultiCheckElem, custom_value:MultiCheckVal, list:'Check1,Check2,Check3,Check4' }

Вот функции javascript (кстати, они также работают — с некоторыми изменениями — когда список флажков находится в блоке DIV):

//————————————————————
// Description:
//   MultiCheckElem is the "custom_element" function that builds the custom multiple check box input
//   element. From what I have gathered, jqGrid calls this the first time the form is launched. After
//   that, only the "custom_value" function is called.
//
//   The full list of checkboxes is in the jqGrid "editoptions" section "list" tag (in the options
//   parameter).
//————————————————————
function MultiCheckElem( value, options )
{
   //———-
   // for each checkbox in the list
   //   build the input element
   //   set the initial "checked" status
   // endfor
   //———-
   var ctl = '';
   var ckboxAry = options.list.split(',');

   for ( var i in ckboxAry )
   {
      var item = ckboxAry[i];
      ctl += '<input type="checkbox" ';

      if ( value.indexOf(item + '|') != -1 )
         ctl += 'checked="checked" ';
      ctl += 'value="' + item + '"> ' + item + '</input><br />&nbsp;';
   }

   ctl = ctl.replace( /<br />&nbsp;$/, '' );
   return ctl;
}



//————————————————————
// Description:
//   MultiCheckVal is the "custom_value" function for the custom multiple check box input element. It
//   appears that jqGrid invokes this function the first time the form is submitted and, the rest of
//   the time, when the form is launched (action = set) and when it is submitted (action = 'get').
//————————————————————
function MultiCheckVal(elem, action, val)
{
   var items = '';
   if (action == 'get') // the form has been submitted
   {
      //———-
      // for each input element
      //   if it's checked, add it to the list of items
      // endfor
      //———-
      for (var i in elem)
      {
         if (elem[i].tagName == 'INPUT' && elem[i].checked )
            items += elem[i].value + ',';
      }

      // items contains a comma delimited list that is returned as the result of the element
      items = items.replace(/,$/, '');
   }
   else // the form is launched
   {
      //———-
      // for each input element
      //   based on the input value, set the checked status
      // endfor
      //———-
      for (var i in elem)
      {
         if (elem[i].tagName == 'INPUT')
         {
            if (val.indexOf(elem[i].value + '|') == -1)
               elem[i].checked = false;
            else
               elem[i].checked = true;
         }
      } // endfor
   }

   return items;
}

person gsiler    schedule 13.05.2010    source источник
comment
можете ли вы уточнить, как вы передаете выбранные значения. что это: val.indexOf(elem[i].value + '|') делает ??   -  person leora    schedule 14.02.2011
comment
@ooo - jqGrid заполняет параметр value содержимым ячейки, которая открывается для редактирования. В этом примере ячейка содержит список выбранных элементов, разделенных вертикальной чертой (хранящийся в моей базе данных). В MultiCheckVal код, на который вы ссылаетесь, проверяет каждый тег INPUT в elem, чтобы увидеть, находится ли его содержимое в содержимом ячейки, разделенной вертикальной чертой (передается в val). Надеюсь это поможет.   -  person gsiler    schedule 09.03.2011