Obtenez l'URL de la colonne Image dans une bibliothèque et affichez l'image en HTML
-
10-12-2019 - |
Question
Avant:Je travaille avec SharePoint depuis 2 ans (principalement front-end et branding css).Je n'ai jamais fait de codage source pour SharePoint, à l'exception d'un étrange script permettant de masquer divers champs.Cela étant dit...
Question:Comment puis-je obtenir l'URL d'une colonne Image/Image dans une bibliothèque, puis utiliser ce lien dans mon code HTML pour afficher l'image ?J'espère que cela a du sens !?
Code jusqu'à présent :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script language="javascript" type="text/javascript" src="http://qajdgintranet/gs/it/Documents/RARTest/jquery-1.8.2.min.js"></script>
<script language="javascript" type="text/javascript" src="http://qajdgintranet/gs/it/Documents/RARTest/jquery.SPServices-0.7.2.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$().SPServices({
operation: "GetListItems",
async: false,
webURL: "http://mysite",
listName: "RARTest",
CAMLQuery: "<Query><Where><Eq><FieldRef Name='Month' /><Value Type='Text'>December</Value></Eq></Where></Query>",
CAMLViewFields: "<ViewFields><FieldRef Name='Year'/><FieldRef Name='Month'/><FieldRef Name='Award'/><FieldRef Name='Profile_x0020_Picture'/><FieldRef Name='Description'/><FieldRef Name='User'/></ViewFields>",
completefunc: function (xData, Status) {
$(xData.responseXML).SPFilterNode("z:row").each(function() {
var get_year = $(this).attr("ows_Year");
var get_month = $(this).attr("ows_Month");
var get_award = $(this).attr("ows_Award");
var get_photo = $(this).attr("ows_Profile_x0020_Picture").split(",")[0];
var get_photoname = $(this).attr("ows_Profile_x0020_Picture").split(", ")[1];
var get_description = $(this).attr("ows_Description");
var get_nominator = $(this).attr("ows_User").split("#")[1];
$("#rar_year").append(get_year);
$("#rar_month").append(get_month);
$("#rar_award").append(get_award);
$("#rar_photo").append(get_photo);
$("#rar_photoname").append(get_photoname);
$("#rar_description").append(get_description);
$("#rar_nominator").append(get_nominator);
});
}
});
});
</script>
<h5 id="rar_year"/>
<h5 id="rar_month"/>
<h5 id="rar_award"/>
<h5 id="rar_photo"/>
<h5 id="rar_photoname"/>
<h5 id="rar_description"/>
<h5 id="rar_nominator"/>
<body>
???
</body>
Champs requis: Photo
J'ai essayé diverses choses pour que cette image s'affiche simplement indépendamment de la liste.
Cela me rend complètement fou;) Votre aide serait grandement appréciée.
La solution
Vous devez d'abord ajouter un img
étiquette dans le corps :
<img id="myImage" src="" />
Ensuite, vous devez accéder au src
attribut à l’aide de JQuery et définissez-le sur l’URL de l’image.
$("#myImage").attr({src : get_photo});