GetListItems Images do not show

Jul 27, 2012 at 8:39 AM

Hello all.

I have already searched trough the discussions here but I dind't find an solution yet. I'm relatively new to jQuery and SPServices so I hope you guys can help me out!

I have a List with different fruits.

With GetListItems I read the different Elements of this List. There is also a column with Pictures in this List. Everything is working fine except of the pictures. Instead of them only red crosses are showing. And if I open the html, the img-Tag looks as following:

<img src="/website6/SitePages/$(this).attr(" alt=""/>

I have checked with IE Console, but no error is shown. Also (as you can see in the Code) I made an alert to check what information is returned.  But this Alert only says "Undefined".

And now the actual Code:

<script type="text/javascript">
   $(document).ready(function(){

     var output = "<ul>";
     var titelbild ="";

     $().SPServices({
         operation: "GetListItems",
         async:false,
         listName:"Obst",
         completefunc: function(xData, Status){
            $(xData.responseXML).SPFilterNode("z:row").each(function(){
               output += '<li>' + $(this).attr("ows_Title") + ' - ' + $(this).attr("ows_Form") + '-' + $(this).attr("ows_Farbe") + ' - ' + $(this).attr("ows_Herkunft") + '</li>';
               titelbild += '<img src="' + '$(this).attr("ows_Bild")' + '">';             

            });
         output += '</ul>';
         $('#logo').append(titelbild);
         $('#text').append(output);
         alert($(this).attr("ows_Bild"));
         }});

   });</script>

 

Thank all of you a lot!

Jul 27, 2012 at 9:31 AM
Edited Jul 27, 2012 at 10:11 AM

I got one step further. It still does not show the images, BUT in HTML the IMG-Tag is now shown as following:

<img src="http://www.planet-wissen.de/politik_geschichte/wirtschaft_und_finanzen/bananenhandel/img/wf_bananen_banane_g.jpg,"/>

So, mostly correct, but theres one small thing, the comma at the end of the URL.

I only changed the var titlebild as following:

              titelbild += '<img src=' + $(this).attr("ows_Bild") + ' />';   

But now. Where does this comma come from??? I can't see it anywhere in my code. Is it generated by SharePoint???

Jul 27, 2012 at 11:34 AM

So I didn't find where the comma came from, but I solved it now with a split:

titelbild += '<img src=' + $(this).attr("ows_Bild").split(",")[0] + ' />';    

And it works :)

Coordinator
Jul 30, 2012 at 7:28 PM

Glad you got there on your own. Hyperlink or Picture columns are stored as "URL, Description", so you did the right thing by using the split function.

M.