Revisions to Display attachment as image

duplicated reference of base url

Source Link

edit approved Mar 4, 2022 at 3:57

61
11

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Example List";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
            }
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Example List";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
            }
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Example List";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str_array.push(data.d.results[i].ServerRelativeUrl);
            }
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

deleted 406 characters in body

Source Link

edited Apr 2, 2020 at 0:29

me_ts

11
2

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Tillmann"Example Test";List";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    var str_new = "";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str += "<a href='" + data.d.results[i].ServerRelativeUrl + "'>" + data.d.results[i].FileName + "</a>";
                str_new += baseURL + data.d.results[i].ServerRelativeUrl;
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
                if (i != data.d.results.length - 1) {
                    str += "<br/>";
                    str_new += ";"
                }
            }
            //alert( i );
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Tillmann Test";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    var str_new = "";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str += "<a href='" + data.d.results[i].ServerRelativeUrl + "'>" + data.d.results[i].FileName + "</a>";
                str_new += baseURL + data.d.results[i].ServerRelativeUrl;
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
                if (i != data.d.results.length - 1) {
                    str += "<br/>";
                    str_new += ";"
                }
            }
            //alert( i );
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Example List";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
            }
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

Source Link

created Apr 2, 2020 at 0:23

me_ts

11
2

I managed to add this code as a content editor script in the "Default Display Form" of a list item. It's not a very clean solution, however it shows the attached pictures (all of them) directly in the default display form.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>

<script type="text/javascript"> 
$(function() {
  var itemId = getQueryString()["ID"];
  var listName = "Tillmann Test";
  var baseURL = "https://www.Example.com"
  var attachmentlink = getAttachments(baseURL, listName, itemId);
  var attachmentnumbers = getNumAttachments(baseURL, listName, itemId);
 
  // Find the form's main table
  var table = $('table.ms-formtable');

  // Add a row with the Queried Picture Entry for each attached picture
  for (var i = 0; i < attachmentnumbers; i++) {
    if (checkURL(attachmentlink[i])) {
        table.append("<tr><td class='ms-formlabel'><h3 class='ms-standardheader'>Attached Picture</h3></td>" +
                   "<td><a href='" + attachmentlink[i] + "'><img src='" + attachmentlink[i] + "' width=400></img></th></tr>");
    }
  }
})
 
function getAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    var str_new = "";
    var str_array = [];
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                str += "<a href='" + data.d.results[i].ServerRelativeUrl + "'>" + data.d.results[i].FileName + "</a>";
                str_new += baseURL + data.d.results[i].ServerRelativeUrl;
                str_array.push(baseURL + data.d.results[i].ServerRelativeUrl);
                if (i != data.d.results.length - 1) {
                    str += "<br/>";
                    str_new += ";"
                }
            }
            //alert( i );
        },
        error: function (err) {
        }
    });
    return str_array;
}

function getNumAttachments(baseURL,listName,itemId) {
  
    var requestUri = baseURL + "/team/wmspr/X360/_api/web/lists/getbytitle('" + listName + "')/items('" + itemId + "')/AttachmentFiles";
    var str = "";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            str = data.d.results.length;
        },
        error: function (err) {
        }
    });
    return str;
}

function checkURL(url) {
    return(url.match(/\.(jpeg|jpg|gif|png)$/) != null);
}

function getQueryString() {
  var assoc = new Array();
  var queryString = unescape(location.search.substring(1));
  var keyValues = queryString.split('&');
  for (var i in keyValues) {
    var key = keyValues[i].split('=');
    assoc[key[0]] = key[1];
    }
  return assoc;
}
</script>

suggestions for a proper clean up are appreciated.

Stack Exchange Network

Return to Answer