Skip to content

Create optgroup element into select list with DOM

Post date:

今天在研究使用 Ajax 透過 jQuery 動態建立 Optgroup 清單。
混沌兩個月,終於寫出稍微有用的文章了…

JavaScript

var obj = document.getElementById("list");

$.getJSON("ajax.asp", {id: idx}, function(json){
  
  // if json data created...
  if(json.length > 0) {

    // get json data of optgroup
    for(var i=0; i

JSON Data Example

[
   {
      title:'optgroup1',
      product:[
         {
            id:1,
            title:'Demo1',
            price:100
         },
         {
            id:2,
            title:'Demo2',
            price:200
         }
      ]
   },
   {
      title:'optgroup2',
      product:{
         id:3,
         title:'Demo3',
         price:300
      }
   }
]

Reference


讀過幾年書,塵世中的迷途大叔。

Comments

  • 不好意思
    我還在使用古老的asp
    可否請問
    我是在頁面上有2的下拉選單
    第一個下拉選單傳送選取的id後
    使用$.getJSON方式
    那ajax.asp頁面是要組合輸出甚麼格式的資料
    才能讓返回的値出現在第二個下拉選單
    找很久都找不到有關asp的範例
    終於找到您這有很高的相似度
    所以才冒昧請教您
    非常感謝

  • 輸出符合 JSON 格式的字串就行了,再利用 $.parseJSON 轉換成 JSON 即可。

    例如:

    ASP:

    Response.write(“[{id:1, name:test}, {id…..}]”)

    jQuery:

    $.getJSON(‘ajax.asp’, function(data){
    var json = $.parseJSON(data);
    if (‘object’ === typeof(json))
    {
    alert(json[0].id);
    }
    })