我在弄清楚如何解决这个问题时遇到了一些麻烦。
我试图最终动态创建下拉菜单。我目前有这个工作,但我正在进行4次ajax调用(每个类别1个以获取其子项),这是不必要的。
我的数据库结构如下:
列:ID,名称,位置,类别
行样本数据:
1,蓝色,房间,颜色
2,红色,车库,颜色
3,球,院子,玩具
4,卡车,箱子,玩具
5,娃娃,房间,玩具
我要做的是首先找出我表格中的所有类别,并为它们获得一个独特的价值。我不希望颜色列出两次,玩具列出3次,只有1种颜色和1种玩具,因为它们都是独一无二的。
接下来,我需要再次遍历所有内容并说出以下是每个类别下的所有名称。
结果如下:
颜色=蓝色,红色
玩具=球,卡车,娃娃
function makeDataPointsTest() {
$.ajax({
url: "../db_api.php",
type: 'GET',
dataType: 'xml',
cache: false,
data: {
sp: "Watson_DataPointsList",
type: "xml",
params: {
category: ''
}
},
error: function(err) {
alert(err.statusText);
},
success: function(data) { //This is the data I am getting back from the database.
// It is returned as an XML object.
var dataTmp = []; //temporary array
var dataCats; //var to hold the unique categories
$(data).find('dataPoints').each(function(i) { //Node of XML is called DataPoints.
var tmp = $(this).find('category').text(); //In each Node (row) find the category name
dataTmp.push(tmp); //Push that category name to an array
});
dataCats = _.uniq(dataTmp); //using underscore.js I now have each unique category in //the database
//Here is where I am stuck
//I now need to loop through each node again and create an array that contains each of //the names under each of the categories.
}
});
}
结果结构(数据):
<root>
<dataPoints>
<id>1</id>
<name>Blue</name>
<location>Room</location>
<category>Color</category>
</dataPoints>
<dataPoints>
<id>2</id>
<name>Red</name>
<location>Garage</location>
<category>Color</category>
</dataPoints>
<dataPoints>
<id>3</id>
<name>Ball</name>
<location>Yard</location>
<category>Toy</category>
</dataPoints>
<dataPoints>
<id>4</id>
<name>Truck</name>
<location>Box</location>
<category>Toy</category>
</dataPoints>
<dataPoints>
<id>5</id>
<name>Doll</name>
<location>Room</location>
<category>Toy</category>
</dataPoints>
</root>
此时有没有简单的方法来执行此jquery?
这就是我想要动态制作的内容
答案 0 :(得分:2)
您是否考虑过只移动一次数据并将数据放入地图?键将是类别名称,值将是在该类别中找到的项目数组。
例如:
var categoryMap = {};
$(data).find('dataPoints').each(function(i) {
var category = $(this).find('category').text();
var name = $(this).find('name').text();
// If first time seeing category, create an empty array.
if (!categoryMap[category])
categoryMap[category] = [];
// If it isn't already found in the array, add it.
if (!categoryMap[category].indexOf(name) != -1)
categoryMap[category].push(name);
});
这当然只会存储数组中的名称,但您也可以存储包含所有这些信息的对象数组。该地图允许快速查找类别中的任何对象,并且您只需要遍历一次数据。
答案 1 :(得分:0)
一种解决方案是使用函数来提取所需的数据
function getUnqVals(data, key){
var dataTmp = []; //temporary array
var dataCats; //var to hold the unique categories
$(data).find('dataPoints').each(function(i) { //Node of XML is called DataPoints.
var tmp = $(this).find(key).text(); //In each Node (row) find the category name
dataTmp.push(tmp); //Push that category name to an array
});
return _.uniq(dataTmp);
}
function makeDataPointsTest() {
$.ajax({
url: "../db_api.php",
type: 'GET',
dataType: 'xml',
cache: false,
data: {
sp: "Watson_DataPointsList",
type: "xml",
params: {
category: ''
}
},
error: function(err) {
alert(err.statusText);
},
success: function(data) { //This is the data I am getting back from the database.
// It is returned as an XML object.
var dataCats; getUnqVals(data, 'category');//var to hold the unique categories
var dataNames; getUnqVals(data, 'name');//var to hold the unique categories
//Here is where I am stuck
//I now need to loop through each node again and create an array that contains each of //the names under each of the categories.
}
});
}
data
的多次迭代有问题,所以另一个veriosn可能是
function makeDataPointsTest() {
$.ajax({
url: "../db_api.php",
type: 'GET',
dataType: 'xml',
cache: false,
data: {
sp: "Watson_DataPointsList",
type: "xml",
params: {
category: ''
}
},
error: function(err) {
alert(err.statusText);
},
success: function(data) { //This is the data I am getting back from the database.
// It is returned as an XML object.
var catsTmp = [], namesTmp = [];
var dataCats, dataNames; //var to hold the unique categories
$(data).find('dataPoints').each(function(i) { //Node of XML is called DataPoints.
var $this = $(this);
catsTmp.push($(this).find('category').text()); //Push that category name to an array
namesTmp.push($(this).find('name').text()); //Push that category name to an array
});
dataCats = _.uniq(dataTmp); //using underscore.js I now have each unique category in //the database
dataNames = _.uniq(namesTmp);
//Here is where I am stuck
//I now need to loop through each node again and create an array that contains each of //the names under each of the categories.
}
});
}