jqGrid：基於MySQL查詢的下拉

Question

我想知道如何在添加/編輯表單中創建一個基本的下拉列表，但是基於mysql查詢結果的值而不是硬編碼值。我在documentation中讀過，您可以在其中設置editoptions dataurl參數，但它只給出無助的html。我需要知道javascript應該如何格式化。我想創建一個單獨的PHP文件來容納查詢語句？

我不僅需要在下拉列表中顯示select id字段，而且還要顯示id的標題描述，這樣用戶可以更輕鬆地將id與標題相關聯，以便爲id輸入選擇適當的id領域。

已選擇ID後的下拉ID字段需要自動填充添加/編輯表單上的其他幾個字段。其他字段不是下拉菜單，而是簡單的文本字段。

任何想法？ 謝謝。

---

UPDATE： 我想你的建議，但我無法得到任何東西出現在表格上的下拉。 請大家看看下面我的代碼...

的jqGrid（JavaScript）的代碼的HTML文件：

{name:'div_id', 
    index:'div_id', 
    width:30, 
    editable:true, 
    sortable:false, 
    resizable:false, 
    align:"center", 
    edittype:'select', 
    editrules:{required:true,number:true}, 
    formoptions:{elmprefix:"(*)"}, 
    editoptions:{ 
     size:11, 
     maxlength:11, 
     dataUrl:'dropdown.php', 
     type:"GET", 
     buildSelect:function(data){ 
      var response = jQuery.parseJSON(data); //json data 
      var s = '<select style="width: 520px">'; 
      if(response && response.length)  
      { 
       s += '<option value="0">--- Select Value ---</option>'; 

       for (var i = 0, l=response.length; i<l ; i++) 
       {  
        var ri = response[i].divid + response[i].longDesc; 
        s += '<option value="'+ri+'">'+ri+'</option>';       
       } // var i = 0, l=response.length; i<l ; i++ 
      } //response && response.length 
      return s + "</select>"; 
     } // function(data) 
}, 

DataUrl：dropdown.php代碼

// Connect to the database 
$dbhost = "localhost"; 
$dbuser = "root"; 
$dbpass = "**********"; 
$dbname = "codetables"; 

mysql_connect($dbhost, $dbuser, $dbpass) or die("Connection Error: " . mysql_error()); 
mysql_select_db($dbname) or die("Error conecting to db."); 

$result = mysql_query('SELECT div_id, long_desc FROM divcodes where avail_ind = "Y" and active_ind="Y" order by div_id'); 
$row = mysql_fetch_array($result,MYSQL_ASSOC); 

$i=0; 
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) { 
    $response->rows[$i]['id']=$row[id]; 
    $response->rows[$i]['divid']=array($row[div_id]); 
    $response->rows[$i]['longDesc']=array($row[long_desc]); 
    $i++; 
}   
echo json_encode($response); 

JSON數據： 我只顯示了一部分JSON數據，但我確實從mysql查詢中獲取數據它看起來像被放入JSON數組中。

{"rows":[{"divid":["01"],"longDesc":["Office of Technology and Information Services"]},{"divid":["04"],"longDesc":["Office of Emergency Response"]},{"divid":["05"]}]} 

---

更新2： 我與如何將數據格式化，以jqGrid的將顯示在下拉列表中的數據掙扎。我能夠弄清楚，但是當我切換到PDO表格時，格式會再次改變。但暫時這裏是我發現的...

數據網址：dropdown。PHP代碼

$dbhost = "localhost"; 
$dbuser = "root"; 
$dbpass = "*********"; 
$dbname = "maint"; 

// connect to the database 
mysql_connect($dbhost, $dbuser, $dbpass) or die("Connection Error: " . mysql_error()); 
mysql_select_db($dbname) or die("Error conecting to db."); 

$result = mysql_query('SELECT div_id FROM depdivs where div_id <> "" and avail_ind = "Y" and active_ind="Y"'); 

$row = mysql_fetch_array($result,MYSQL_ASSOC); 

$i=0; 
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) { 
    $rows[$i]=array($row[div_id]); 
    $i++; 
}   
echo json_encode($rows); 

JSON數據輸出：

[["01"],["02"],["03"],["04"],["52"],["53"],["55"],["57"],["58"],["60"],["75"]] 

的jqGrid（JavaScript）的代碼的HTML文件：

{name:'div_id', 
    index:'div_id', 
    width:30, 
    editable:true, 
    sortable:false, 
    resizable:false, 
    align:"center", 
    edittype:'select', 
    editrules:{required:true,number:true}, 
    formoptions:{elmprefix:"(*)"}, 
    editoptions:{ 
      dataUrl:'dropdown.php', 
      buildSelect: function(response){ 
       var response = jQuery.parseJSON(response); 
       var s = '<select>'; 
       jQuery.each(response,function(i,item){ 
         s +='<option value="+response[i]+'">'+response[i]+'</option>'; 
       }); 
       return s + "</select>"; 
      } 
    } 
}, 

Answer 1

按照以下步驟，

在y我們colmodel

editoptions: { 
dataUrl:'your url', 
type:"GET", 
buildSelect: function(data) { 
    var response = jQuery.parseJSON(data); //json data 
     var s = '<select style="width: 520px">'; 
     if (response && response.length) { // 
      s += '<option value="0">--- Select Value ---</option>'; 
      for (var i = 0, l=response.length; i<l ; i++) { 
      var ri = response[i].value; // u can concatenate id here 
       s += '<option value="'+ri+'">'+ri+'</option>'; 
      } 
     } 
     return s + "</select>"; 
     }, 
    } , 

我在這裏用的響應值返回JSON數據爲
[{"id":"1","value":"Alpha"},{"id":"2","value":"Beta"}]

如果妳想要顯示我的ID，只是CONCAT

var ri = response[i].value + response[i].id; 

UPDATE

List<ArticleDetails> articlelist = prfbo.getPrfArticleType(); // get value from DB 
JSONArray jsonOrdertanArray = JSONArray.fromObject(articlelist); 

System.out.println(jsonOrdertanArray); 
out.println(jsonOrdertanArray);