jqGrid, jak wypełnić listę wyboru z zapytania

Question

Mam podstawowy jqGrid pracujący w moim projekcie coldfusion. Jednym z moich pól w jqGrid jest pole kombi. Obecnie wartości opcji editoption są zakodowane tak jak poniżej.

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} 
    } 
] 

Próbuję znaleźć sposób na wypełnienie listy rozwijanej z kwerendy/adresu URL.

Każda pomoc zostanie bardzo doceniona.

Dzięki z góry

Answer 1

utworzyć funkcję, która używa json zapytań URL. Ta funkcja powinna zwrócić ciąg znaków w formacie "1: jeden; 2: dwa".

Na przykład:

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) 
      } 
     }); 
    } 

Przypuszczam, że można umieścić funkcją inline, jak również, ale myślę, że byłoby to trudniejsze do odczytania.

Answer 2

Użyj dataUrl ... (see the wiki here).

Obecnie dataUrl generuje GET, ale jeśli ktoś wyciągnie kod z Github, GET może zostać zmieniony na POST bez widocznych efektów ubocznych.

Answer 3

Odpowiedź $ .getJSON/getSequenceNumbers() nie działa tak, jak przedstawiono. Nie ma możliwości zwrócenia danych z wywołania zwrotnego jako wartości zwracanej dla getSequenceNumbers(), ponieważ wywołanie zwrotne jest asynchroniczne. Musisz użyć metody dataURL zasugerowanej przez Martina lub ustawić jqGrid wewnątrz wywołania zwrotnego $ .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 4

Warto zauważyć, że można całkowicie obejść problem, jeśli używa się języka skryptowego po stronie serwera. Na przykład w PHP można użyć

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

wtedy właśnie konfigurację funkcji PHP getData() dalej na stronie, aby powrócić odpowiedni ciąg znaków, na przykład

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

Może nie tak eleganckie lub jako przenośny jako obsługa wszystkiego w jQuery, ale myślę, że koncepcyjnie łatwiejsze.

Answer 5

Powiedzmy, że w ColModel masz kolumnę tak:

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

Musisz najpierw oświadczyć, że jego select pierwiastek z tym:

edittype:"select" 

Następnie w parametrze editoptions dodać a dataUrl w ten sposób:

editoptions:{dataUrl:'filename.php'} 

Plik filename.php musi zwrócić element "select" z to opcje, oto przykład:

<?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); 
?> 

Mam nadzieję, że to pomoże.

Answer 6

Wiem, że to stare pytanie, ale mam ten sam problem.
Rozwiązuję to przez połączenie dataUrl i 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 
    } 
    ,{} 
    ) 

Zauważ, że dataUrl ciąg są statyczne, czyli nie można wysyłać różne parametry za każdym razem dodawać/edytować zachodzi. Poniższy kod NIE DZIAŁA!

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

Aby przesłać parametry takie id, można użyć ajaxSelectOptions.

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

Funkcja, która zwraca selected_id zostanie wykonana za każdym razem, gdy pojawi się add/edit. Mam nadzieję że to pomoże !

Answer 7

Dostosowałem kod dla opcji wyszukiwania zamiast opcji edycji. Jednak automatycznie wybierał pierwszą opcję i filtrował listę, więc dodałem następujące elementy, aby ją złagodzić.

$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;