Question

这是我的JSON字符串....我无法修改它，因为它来自ColdFusion的数据库查询：

    {
    "Modules": {
        "COLUMNS": [
            "MODULECODE",
            "MODULETITLE"
        ],
        "DATA": [
            [
                "A001",
                "The Middle Ages"
            ],
            [
                "M001",
                "Civil Liberties"
            ],
            [
                "H001",
                "Project Preparation"
            ]
        ]
    },
    "Courses": {
        "COLUMNS": [
            "COURSETITLE",
            "COURSECODE"
        ],
        "DATA": [
            [
                "Marketing",
                "00007001"
            ],
            [
                "Fashion and Textile Buying Management",
                "00006002"
            ]
        ]
    }
}

这是我的JQuery代码，试图提取数据以填充SELECT表单元素：

$(document).ready(function() {
    $('#UserCode').blur(function() {
        $.ajax({
            type: 'get',
            url: 'mydata.cfc',
            data: {method:'getData', UserCode:$(this).val()},
            dataType: 'json',
            success: function(result){
                $.each(result, function(index, valueA){
                    $.each(valueA, function(index, valueB){
                        // Trying to append to the #Courses <select> element
                        $('#Courses').append('<option value="'+valueB[1]+'">'+valueB[2]+' ('+valueB[1]+')</option>');
                    });
                });                                 
            }
        });
    });
});

基本上我不知道如何将“课程”数据暂时放入#Courses选择元素。稍后我还需要创建一个#Modules select元素，并使用“Modules”数据执行相同的操作。

数组中有数组，我不明白如何让JQuery只选择"valueB.Courses"。我有大约5本Jquery书籍，但他们的示例JSON字符串没有像我这样的数组数组，所以我无法想象该怎么做：（

Answer 1

我发现处理简单的数据结构比简单地返回序列化为JSON的查询更简单。

这里有一些伪代码可以让你指向正确的方向 - 用cfscript格式：

<cffunction name="GetStuff" >
    <cfset var ret = {} />
    <!--- code for queries here --->
    <cfset var qry1Data = [] />
    <cfloop query="query1">
        <cfset var item = {"modulecode" = query1.modulecode, "moduletitle" = query1.moduleTitle} />
        <cfset arrayAppend( qry1Data, item ) />
    </cfloop>
    <cfset ret["modules"] = qry1Data/>
    <cfset var qry2Data = [] />
    <cfloop query="query2">
    <cfset var item = {"coursecode" = query1.coursecode, "coursetitle" = query1.courseTitle} />
        <cfset arrayAppend( qry2Data, item ) />
    </cfloop>
    <cfset ret["courses"] = qry2Data />
    <cfreturn ret />
</cffunction>

您无需指定returnformat，因为您可以通过将其作为“数据”的aprt传递来对您的AJAX调用执行此操作。这是你的回调可能是什么样的

$(document).ready(function() {
$('#UserCode').blur(function() {
    $.ajax({
        type: 'get',
        url: 'mydata.cfc',
        data: {method:'getData', UserCode:$(this).val(), returnFormat : 'JSON'},
        dataType: 'json',
        success: function(result){
            $.each(result.modules, function( index, val ) ){
                $("#Modules").append('<option value="' + val.modulecode + '">' + val.moduletitle + ' (' + val.modulecode + ')</option>');
                $("#Courses").append('<option value="' + val.coursecode + '">' + val.coursetitle + ' (' + val.coursecode + ')</option>');
            }                                
        }
    });
});

}）;

您可能需要调整jQuery以稍微填充选择框，但这应该会给您提供这个想法。

我可能会考虑拆分调用以获取模块和课程到不同的AJAX调用并单独处理每个调用，但这更像是个人偏好而不是其他任何东西。

Answer 2

当你发现它是一个arrays within arrays因此你可以像这样迭代它们：

...
success: function(result){
    for(var i=0;i<result.Courses.Data.length;i++)
        $('#Courses').append('<option value="'+result.Courses.Data[i][1]+'">'+result.Courses.Data[i][2]+'('+result.Courses.Data[i][1]+')</option>');

    for(var i=0;i<result.Modules.Data.length;i++)
        $('#Modules').append('<option value="'+result.Modules.Data[i][1]+'">'+result.Modules.Data[i][2]+'('+result.Modules.Data[i][1]+')</option>');
});

Answer 3

虽然这篇文章很老，但只想纠正Scott建议的解决方案中的语法错误。 $每个语法都应该像

$.each(result.modules, function( index, val ){

});

如何解析/循环具有数组数组的JSON Javascript对象？

3 个答案: