Spservices - GetListiTems - Formattazione Risultati

Question

Sto usando Spservices in SharePoint 2013 per ottenere alcuni risultati dalla lista dei cutom denominati "navigatore" presentato qui:

E per questo scopo sto usando il codice:

<script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../js/jquery.SPServices-2014.01.min.js"></script>

<script language="javascript" type="text/javascript">
$(document).ready(function() {
    $().SPServices({
        operation: "GetListItems",
        async: true,
        listName: "navigator",
        CAMLViewFields: "<ViewFields><FieldRef Name='Title' /><FieldRef Name='URL' /><FieldRef Name='DisplayOrder' /><FieldRef Name='Target' /><FieldRef Name='Category' /></ViewFields>",
        CAMLQuery: "<Query><OrderBy><FieldRef Name='DisplayOrder' Ascending='true' /></OrderBy></Query>",
        completefunc: function (xData, Status) {
            $(xData.responseXML).SPFilterNode("z:row").each(function() {
                var title = ($(this).attr("ows_Title"));
                var href = ($(this).attr("ows_URL")).split(",")[0];
                var target = ($(this).attr("ows_Target"));
                var liHtml = "<li><a href='"+ href +"' target='"+ target +"'>" + title + "</a></li>";
                $("#navigator").append(liHtml);
            });
        }
    });
});
            </script>
            <ul id="navigator" />

.

Ricevo elenco di tutti gli elementi come questo:

Ma vorrei ottenere qualcosa del genere:

È possibile utilizzare "Categoria" come genitore per questi elementi?

Answer 1

Quindi sul tuo feedback prova questo.I Divs galleggeranno e aggiungerà un nuovo div in base alla categoria.È necessario ordinare gli articoli prima per categoria.Quindi visualizza l'ordine.

$(document).ready(function() {
$().SPServices({
    operation: "GetListItems",
    async: true,
    listName: "navigator",
    CAMLViewFields: "<ViewFields><FieldRef Name='Title' /><FieldRef Name='URL' /><FieldRef Name='DisplayOrder' /><FieldRef Name='Target' /><FieldRef Name='Category' /></ViewFields>",
    CAMLQuery: "<Query><OrderBy><FieldRef Name="Category" Ascending='true'/><FieldRef Name='DisplayOrder' Ascending='true' /></OrderBy></Query>",
    completefunc: function (xData, Status) {

.

// Aggiunta la categoria precedente qui VAR PreviousCategory="";

        $(xData.responseXML).SPFilterNode("z:row").each(function() {
            var title = ($(this).attr("ows_Title"));
    // Set current category
    var category = ($(this).attr("Category"));
            var href = ($(this).attr("ows_URL")).split(",")[0];
            var target = ($(this).attr("ows_Target"));

    if(category !=previouscategory)
    {
        $("#navigator").append("<div style='float:left'><h4>"+category+"</h4>");
    }

            var liHtml = "<li><a href='"+ href +"' target='"+ target +"'>" + title + "</a></li>";
            $("#navigator").append(liHtml);

    if(category !=previouscategory)
    {
        $("#navigator").append("</div>);
    }

    previouscategory= category;
        });
    }
});

.

});