1

I am trying to create a HTML list with the below code. I have managed to create it. but for some reason the output is not in order.

Is the function calls synchronously? when i put alert(heading); in Link() it shows the correct output.

    _spBodyOnLoadFunctionNames.push("MyFunction");

    function MyFunction() 
    {

            $.ajax({

                url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('Mega Menu')/items?$select=Title,Main_x0020_Heading",
                type: "GET",
                headers: {
                    "accept": "application/json;odata=verbose",
                },
                success: function (data) {
                    var uniqueNames = groupByHeading(data, 'Main_x0020_Heading');
                    for (var i = 0; i < uniqueNames.length; i++) {

                    }    
                    subheading("INFORMATION TECHNOLOGY");
                },
                error: function(error){
                    alert(JSON.stringify(error));
                }    
            });
    }

    function subheading(heading) {
        // alert(heading);
        $.ajax({

            url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('Mega Menu')/items?$select=Sub_x0020_Heading&$filter=(Main_x0020_Heading eq '" + encodeURIComponent(heading) + "')&$orderby=Sub_x0020_Heading_x0020_Order",
            type: "GET",
            headers: {
                "accept": "application/json;odata=verbose",
            },
            success: function (data) {
                var uniqueNames = groupBySubHeading(data, 'Sub_x0020_Heading');
                $('#divListItems').append('<ul>'+heading+'</ul>');
                for (var i = 0; i < uniqueNames.length; i++) {
                    $('#divListItems').append("<li>" + uniqueNames[i] + "</li>");
                    links(uniqueNames[i]);
                } 
            },
            error: function (error) {
                alert(JSON.stringify(error));
            }
        });
    }

    function links(heading) {

        $.ajax({

            url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('Mega Menu')/items?$select=Links&$filter=(Sub_x0020_Heading eq '" + encodeURIComponent(heading) + "')&$orderby=link_x0020_order",
            type: "GET",
            headers: {
                "accept": "application/json;odata=verbose",
            },
            success: function (data) {
                var uniqueNames = groupByLink(data, 'Links');
                $('#divListItems').append('<ul>' + heading + '</ul>');
                for (var i = 0; i < uniqueNames.length; i++) {
                    $('#divListItems').append("<li>" + uniqueNames[i] + "</li>");
                }

            },
            error: function (error) {
                alert(JSON.stringify(error));
            }

        });
    }
    function groupByHeading(items, propertyName) {
        var result = [];

        var allValues = [];
        var i = 0;
        $.each(items.d.results, function (index, item) {
            allValues[i] = item.Main_x0020_Heading;
            i++;

        });

        $.each(allValues, function (i, el) {
            if ($.inArray(el, result) === -1) result.push(el);
        });
        return result;
    }

    function groupBySubHeading(items, propertyName) {
        var result = [];

        var allValues = [];
        var i = 0;
        $.each(items.d.results, function (index, item) {
            allValues[i] = item.Sub_x0020_Heading;
            i++;

        });

        $.each(allValues, function (i, el) {
            if ($.inArray(el, result) === -1) result.push(el);
        });
        return result;
    }

    function groupByLink(items, propertyName) {
        var result = [];

        var allValues = [];
        var i = 0;
        $.each(items.d.results, function (index, item) {
            allValues[i] = item.Links;
            i++;

        });

        $.each(allValues, function (i, el) {
            if ($.inArray(el, result) === -1) result.push(el);
        });
        return result;
    }
</script>

If i comment out links(uniqueNames[i]); i will get the part correctly, enter image description here

But otherwise

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.