JavaScript Galerie zu SPservices

Question

Ich fand schöne JavaScript-Galerie here. Ich habe versucht, Daten aus Sharepoint-Bibliothek mit SPServices zu erhalten. Aber hat nicht funktioniert. Gibt es ein Problem mit meinem Code?

<script type="text/javascript" src="/Jscript/Jquery/jquery-1.12.3.min.js"></script> 
 
<script type="text/javascript" src="/Jscript/SPServices/jquery.SPServices-2014.02.min.js"></script> 
 
<script type="text/javascript" src="/Script/js/fotorama.js"></script> 
 
<link rel="stylesheet" href="/Script/js/fotorama.css" /> 
 

 

 
<script language="javascript" type="text/javascript"> 
 

 
$(document).ready(function() { 
 
    $().SPServices({ 
 
    operation: "GetListItems", 
 
    async: false, 
 
    listName: "2007PhotoAlbum", 
 
    CAMLViewFields: "<ViewFields></ViewFields>", 
 
    completefunc: function (xData, Status) { 
 
     $(xData.responseXML).SPFilterNode("z:row").each(function() { 
 
\t 
 
\t \t 
 
     var liHtml = "<div class='fotorama'><img src='" + "/photos/2007PhotoAlbum/" + $(this).attr("ows_PicFilename") +"'" + "></div>"; 
 
     $("#fotorama").append(liHtml); 
 
     }); 
 
    } 
 
    }); 
 
}); 
 

 

 
</script> 
 
<div id="fotorama" data-width="700" data-ratio="700/467" data-max-width="100%"></div> 
 
<script> 
 
$('.fotorama').fotorama({ 
 
    width: 700, 
 
    maxwidth: '100%', 
 
    ratio: 16/9, 
 
    allowfullscreen: true, 
 
    nav: 'thumbs' 
 
}); 
 
</script>

Answer 1

Die SPServices rufen nicht vollständig sein kann, bevor der Code Galerie ausgeführt wird. Dies sieht so aus, als ob SPServices keine Daten zurückgibt. Sie können damit beginnen, dass SPServices Daten zurückgibt. Dieser Code schreibt die Ausgabe auf die Seite.

$().SPServices({ 
    operation: "GetListItems", 
    async: false, 
    listName: "2007PhotoAlbum", 
    CAMLViewFields: "<ViewFields></ViewFields>", 
    completefunc: function(xData, Status) { 
     /***********************************Debugging*******************************/ 
      var out = $().SPServices.SPDebugXMLHttpResult({ 
      node: xData.responseXML 
      }); 
      $("#debug").html("").append("<b>This is the output from the GetList operation:</b>" + out); 
     /***************************************************************************/ 

     $(xData.responseXML).SPFilterNode("z:row").each(function() { 


     var liHtml = "<div class='fotorama'><img src='" + "/photos/2007PhotoAlbum/" + $(this).attr("ows_PicFilename") +"'" + "></div>"; 
     $("#fotorama").append(liHtml); 
     }); 
    } 
    }); 

Solange dies Daten zurückgibt, empfehle ich, Ihren SPServices-Aufruf mithilfe von Versprechen neu zu schreiben. Führen Sie dann .fotorama aus, nachdem das Versprechen zurückgegeben wurde. Marc vergleicht mit und ohne Versprechen here.