jqGrid, как заполнить список выбора из запроса

Question

У меня есть базовый jqGrid, работающий в моем проекте Coldfusion. Одним из моих полей в jqGrid является поле со списком. В настоящее время значения параметров редактирования жестко запрограммированы, как показано ниже.

colModel :
[
  {
   name:'seqnum',index:'seqnum', width:100,resizable:true,   
   align:"left",sorttype:"text",editable:true,edittype:"select",editoptions:   
   { value:"1:one;2:two"},editrules:{required:true}
  }
]

Я пытаюсь найти способ заполнить раскрывающийся список из запроса / URL.

Любая помощь будет принята с благодарностью.

Заранее спасибо

Answer 1

Ответ $ .getJSON / getSequenceNumbers () не работает, как показано. Невозможно вернуть данные из обратного вызова в качестве возвращаемого значения для getSequenceNumbers (), поскольку обратный вызов является асинхронным. Вам нужно либо использовать метод dataURL, предложенный Мартином, либо настроить jqGrid внутри обратного вызова $ .getJSON.

$(document).ready(function() {
 $.getJSON("GetURL", function(data) {
  setupGrid(data);
 });
});

function setupGrid(data) {
...
    colModel :
    [
      {
       name:'seqnum',index:'seqnum', width:100,resizable:true,   
       align:"left",sorttype:"text",editable:true,edittype:"select",editoptions:
       { value:data},editrules:{required:true}
      }
    ]

...
}

Answer 2

Создайте функцию, которая использует json для запроса URL-адреса. Эта функция должна возвращать строку в формате «1: один; 2: два».

Например:

    colModel :
    [
      {
       name:'seqnum',index:'seqnum', width:100,resizable:true,   
       align:"left",sorttype:"text",editable:true,edittype:"select",editoptions:
       { value:getSequenceNumbers()},editrules:{required:true}
      }
    ]

    function getSequenceNumbers(){
        $.getJSON("yourUrl", null, function(data) {
            if (data != null) {
                 //construct string.  
                 //(or the server could return a string directly)
            }
        });
    }

Полагаю, вы могли бы также включить функцию, но я думаю, что ее будет сложнее читать.

Answer 3

Используйте dataUrl ... ( см. Вики здесь ).

В настоящее время dataUrl генерирует GET, но если вы извлекаете код из Github, GET может быть изменен на POST без видимых побочных эффектов.

Answer 4

Стоит отметить, что вы можете полностью обойти проблему, если используете серверный язык сценариев. Например, с PHP вы можете использовать

{name:'myselectdata', index:'myselectdata', width:160, formatter:'select', editable:true, edittype:"select", cellsubmit:"clientArray", editoptions:{ <? echo getData() ?>}  },

Затем просто установите PHP-функцию getData () далее вверх по странице, чтобы получить подходящую строку, например

'value:"1:one;2:two"';

Может быть, не такой элегантный или переносимый, как обработка всего в jQuery, но, на мой взгляд, концептуально проще.

Answer 5

Допустим, в вашей ColModel у вас есть такой столбец:

{name:'id_UDM', index:'id_UDM', width:150, editable:true, edittype:"select", editoptions:{dataUrl:'filename.php'}}

Сначала вы должны объявить, что это элемент select с этим:

edittype:"select"

Затем в параметре editoptions добавьте dataUrl следующим образом:

editoptions:{dataUrl:'filename.php'}

Файл filename.php должен возвращать элемент «select» с его параметрами, вот пример:

<?php
    include("connectionToMyDatabase.php");
    $query1 = "SELECT * FROM table WHERE 
    $result1 = mysql_query($query1);
    $response ='<select>';
    while($row = mysql_fetch_array($result1)) {
         $response .= '<option value="'.$row['value'].'">'.$row['name'].'</option>';
    }
    $response .= '</select>';

    echo $response;

 mysql_close($db);  
?>

Надеюсь, это поможет.

Answer 6

Я знаю, что это старый вопрос, но я нашел ту же проблему.
Я решаю это с помощью комбинации dataUrl и ajaxSelectOptions.

colModel:[
    //class_id
    $.extend(true,
    {
        name:'class_id'
        ,index:'class_id'
        ,edittype:'select'
        ,formatter:'select'
        ,editoptions: { dataUrl:"db.php?ajaxOp=getClassesOptions" } //to send dynamic parameter, combine with ajaxSelectOptions
    }
    ,{}
    )

Обратите внимание, что строка dataUrl является статической, что означает, что вы не можете отправлять разные параметры каждый раз, когда происходит добавление / редактирование. Ниже код не будет работать!

,editoptions: { dataUrl:"db.php?ajaxOp=getClassesOptions" + "&id="+selected_id } 

Для отправки параметров с таким идентификатором вы можете использовать ajaxSelectOptions.

ajaxSelectOptions:      //use this for combination with dataUrl for formatter:select
{       
    data: {
      id: function () {
          return selected_id;
      }
    }
},     

Функция, которая возвращает selected_id, будет выполняться каждый раз, когда происходит добавление / редактирование. Надеюсь, это поможет!

Answer 7

Я адаптировал код для поиска вместо редактирования. Однако он автоматически выбирал первый вариант и фильтровал список, поэтому я добавил следующее, чтобы облегчить это.

 $response ='<select>';
 $response .= '<option value=""></option>';
 while($row = $stmt->fetch(PDO::FETCH_NUM)) {
      $response .= '<option value="'.$row[0].'">'.$row[0].'</option>';
 }
 $response .= '</select>';

 echo $response;