в то время как выбранная опция редактирования публикует значение (или идентификатор) выбранного элемента списка, автозаполнение публикует метку - мне нужен идентификатор опубликован - PullRequest
1 голос
/ 10 ноября 2011

Хотя автозаполнение и выбор в jqgrid editform помещают выбранную метку в ячейку, select поместит значение (id) в массив постданных, где автозаполнение поместит метку в массив постданных.

естьспособ получить автозаполнение editoption для публикации значения элемента (id) вместо метки?

вот сегмент кода jqgrid, который я использую автозаполнение в ...

$('#tab3-grid').jqGrid({
   colNames:['Workorder', 'wo.CUID',.....],
   colModel:[  
      .
      .
      .  
      {name:'wo.CUID', index:'cu.LastName', width:120, fixed:true, align:'center', sortable:true, editable:true, edittype:'text',
         editoptions:{dataInit:function(el){$(el).autocomplete({ source: 'php/customer-ac-script.php' 
                                                              , minLength: 1

                                                             })
                                          }
                    },
         formoptions:{rowpos: 1, label:'Customer', elmprefix:'* '},
         editrules:{required:true}
      },
      .
      .
      .
$('#tab3-grid').jqGrid('navGrid', '#tab3-pager',
   {view:true, closeOnEscape:true, cloneToTop:true}, // general parameters that apply to all navigation options below.
   {jqModal:true, navkeys:[true,38,40], savekey:[true,13]}, // edit options.
   {jqModal:true, navkeys:[true,38,40], savekey:[true,13], reloadAfterSubmit:false, afterSubmit: addRecordID}, // add options.
   {jqModal:true, afterSubmit: serverMessage}, // del options.
   {jqModal:true}, // search options.
   {jqModal:true, navkeys:[true,38,40]} // view options.
);

Сегмент php-кода:

// construct autocomplete select.
$i = 0;

while($row = mysql_fetch_assoc($result)) {
   $output[$i][$crudConfig['id']]    = $row['CUID'];
   $output[$i][$crudConfig['value']] = $row['LastName'];
   logMsg(__LINE__,'I','cu.CUID: '.$row['CUID'].', cu.LastName: '.$row['LastName']);

   $i++;
}

// encode to json format and send output back to jqGrid table.
echo json_encode($output);
logMsg(__LINE__,'I','Send json output back to jqGrid table: '.json_encode($output));

Было бы так же просто, как вызвать функцию в событии выбора автозаполнения или в сетке до или после отправки editform?

Кроме того, я заметил это примечание вДокумент jqgrid для datainit: он говорит ...

Примечание. Для некоторых плагинов требуется положение элемента в DOM, и, поскольку это событие возникает перед вставкой элемента в DOM, вы можете использоватьФункция setTimeout для выполнения желаемого действия.

Может ли проблема вызвать отсутствие функции settimeout?

Ответы [ 2 ]

1 голос
/ 13 ноября 2011

Ответ Олега, разъясняющий модель данных для автозаполнения пользовательского интерфейса jquery, позволил мне продвинуться вперед и понять, что автозаполнение не имеет ничего общего с созданием и отправкой массива postdata на сервер, форма редактирования jqgrid обрабатывает его.Обладая этими знаниями, я смог ответить на свой первоначальный вопрос и успешно интегрировать автозаполнение в jqgrid.Итак, в интересах обмена я хотел бы показать вам всю мою мотивацию и решение.

По умолчанию при выборе метки из списка автозаполнения в текст вводится значение выбранной пары метка / значение.коробка.Вся форма редактирования заботится о том, когда вы отправляете, что находится в полях редактирования.Поэтому, когда вы отправляете форму редактирования, значение элемента postdata ячейки снова будет содержать значение текстового поля автозаполнения.Но что, если, желая опубликовать значение пары метка / значение, вы хотите, чтобы метка пары метка / значение отображалась в текстовом поле?У тебя проблемы!Как вы получаете значение пары метка / значение, отправленное на сервер?

Что ж, потратив на это несколько дней, получается довольно просто.Хотя я уверен, что есть более одного решения, вот мое:

  1. добавить скрытый столбец id в сетке

  2. определитьвыберите: и фокус: события в функции автозаполнения

  3. в функции выбора:;вставьте выбранную метку в текстовое поле (необязательно), отключите стандартное поведение автозаполнения, затем установите для ячейки скрытого столбца значение выбранной пары метка / значение

  4. вфокус: функция;вставьте выбранную метку в текстовое поле (необязательно), отключите поведение автозаполнения по умолчанию

  5. , добавьте событие "onclickSubmit:" в параметры редактирования navgrid с именем функции, например, "fixpostdata"

  6. в функции «fixpostdata»;получите значение ячейки скрытого столбца и вставьте его в элемент postdata, связанный с ячейкой.

Ниже приведены сегменты сетки и код JavaScript, которые я использовал…

grid segments

{name:'wo_CUID', index:'wo_CUID', width: 70, hidden: true},
{name:'wo.CUID', index:'cu.LastName', width:120, sortable:true, editable:true,  edittype:'text',
   editoptions:{
      dataInit:function(el){ // el contains the id of the edit form input text box.
         $(el).autocomplete({

             source: 'php/customer-ac-script.php',
             minLength: 1,

             select: function(event, ui){event.preventDefault();
                  $(el).val(ui.item.label);
                  var rowid = $('#tab3-grid').getGridParam('selrow');

                   // set the hidden wo_CUID cell with selected value of the selected label.
                   $('#tab3-grid').jqGrid('setCell', rowid,'wo_CUID',ui.item.value);},

            focus: function(event, ui) {event.preventDefault();
                  $(el).val(ui.item.label);}
                                     })
                              }
                     },
   formoptions:{rowpos: 1, label:'Customer', elmprefix:'* '},
   editrules:{required:true}

},

.

.

$('#tab3-grid').jqGrid('navGrid', '#tab3-pager',
   {view:true, closeOnEscape:true, cloneToTop:true},
   {jqModal:true, navkeys:[false,38,40], onclickSubmit: fixpostdata}, // edit options.

.

.

javascript function

// define handler function for 'onclickSubmit' event.
var fixpostdata = function(params, postdata){
   var rowid = $('#tab3-grid').getGridParam('selrow');
   var value = $('#tab3-grid').jqGrid('getCell', rowid,'wo_CUID');

   postdata['wo.CUID'] = value;

   return;
}

Функция fixpostdata срабатывает, когда вы отправляете форму редактирования, но перед отправкой на сервер массива постданных.На этом этапе вы заменяете значение элемента postdata ячейки тем, что хотите.В этом случае значение пары метка / значение сохраняется в ячейке скрытого столбца.Когда функция возвращается, измененный массив постданных отправляется на сервер.

Готово!

1 голос
/ 11 ноября 2011

Код сервера, который предоставляет ответ JSON на запрос автозаполнения, имеет свойства id и value. С другой стороны, стандартное поведение jQuery UI Autocomplete заключается в использовании свойств label и value (см. «Модель данных» в документации ). Значение свойства label (если оно существует) будет использоваться для отображения в контекстном меню. Значение свойства value будет помещено в поле <input> после того, как пользователь выберет элемент из контекстного меню. Значение свойства label может иметь разметку HTML, но значением свойства value должен быть текст.

Таким образом, я рассматриваю проблему как чистую проблему использования jQuery UI Autocomplete независимо от jqGrid. Если я правильно понял ваш вопрос, вы можете решить свою проблему, изменив код на стороне сервера.

...