Question

嗨（对不起我的英文），我有这个剧本：

<script type="text/javascript">
    $(document).ready(function() {
        var idPlato = decodeURI(getUrlVars()["idPl"]);
        var url = "http://localhost/plato-datos.php?idPla="+idPlato+"";   
    });
   };
</script>

它从我的数据库中带来了这个json：

[{"category":"first","name":"green","idP":"1", "count":3},
{"category":"first","name":"blue","idP":"2","count":5},   
{"category":"sec","name":"peter","idP":"3", "count":3},   
{"category":"sec","name":"james","idP":"4", "count":2,},  
{"category":"third","name":"dog","idP":"5", "count":4}]

我需要按类别为每个名称和组创建一个radiobuton

Answer 1

我正在使用jquery mobile，然后我使用autodividersSelector JSON对象的category函数用于组，并为每个name

构建一个radiobuton

        <script type="text/javascript">
         //catch the JSON from my database
              $(document).ready(function() {
                    var idPla = decodeURI(getUrlVars()["idPl"]);
                    var urlAder = 
                    "http://localhost/lista-adereso.php?idPla=" + idPla + "";

                   //print the radiobutons
                  $.getJSON(urlAder, function(resultado) {
                        var allfiles = '';    
                        for (var i = 0, aderesos = null; i < 
                              resultado.length; i++) {
                            aderesos = resultado[i];
                            allfiles +='<li><label><input type="radio" data-
                                       status="' + aderesos.aderesoCatNom +'" 
                                       name="name" id="id" value="' + 
                                       aderesos.aderNombre +'">'+ 
                                       aderesos.aderNombre + '</label></li>';                           }
                       //Group by categories
                       $('#linkList')
                        .empty()
                        .append(allfiles)
                        .listview({
                            autodividers:true,
                            autodividersSelector: function ( li ) {
                                var out = li.find('input').data("status");  
                                return out;
                            }
                        })
                        .listview("refresh");
                });
            });
         </script>

Answer 2

我创建了一个解决方案。有点难看，但它会起作用：

＆＃13;

var data = [{
  "category": "first",
  "name": "green",
  "idP": "1",
  "count": 3
}, {
  "category": "first",
  "name": "blue",
  "idP": "2",
  "count": 5
}, {
  "category": "sec",
  "name": "peter",
  "idP": "3",
  "count": 3
}, {
  "category": "sec",
  "name": "james",
  "idP": "4",
  "count": 2,
}, {
  "category": "third",
  "name": "dog",
  "idP": "5",
  "count": 4
}];

var result = {};

data.map(a => {
  if (result[a.category]) {
    result[a.category].push(a.name);
  } else {
    result[a.category] = [a.name];
  }
});

Object.keys(result).map(category => {
  var select = document.createElement('select');
  result[category].map(name => {
    var option = document.createElement('option');
    option.value = name;
    option.text = name;
    select.appendChild(option);
  });
  document.body.appendChild(select);
});

＆＃13;

选项从类别的json对象中选择

2 个答案: