0

I'm trying to use REST API in SharePoint to getlistitems to display the link from a hyperlink field from my sharepoint list.

I AM successfully using the code to display the title field - but NOT the url from the hyperlink field.

I've tried appending the url in the code below with /_api/web/lists/getbytitle('test')/items?$select=URL without success.

<html>
<body>
<div>
<input type="button" id="btnSubmit" value="Get List Data using Rest API">
&nbsp;</div>
<div id="divResults" unselectable="on"></div>

<script src="/jquery.com/jquery-3.5.1.min.js" unselectable="on"></script>

<script unselectable="on">
$(function () {
$("#btnSubmit").on("click", function () {
getListData();
});
});
function getListData() {
var fullUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('test')/items";
$.ajax({
url: fullUrl,
type: "GET",
headers: {
"accept": "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
},
success: onQuerySucceeded,
error: onQueryFailed
});
}
function onQuerySucceeded(data) {
var listItemInfo = '';
$.each(data.d.results, function (key, value) {
listItemInfo += '<b>Title:</b> ' + value.Title + '<br />';
});
$("#divResults").html(listItemInfo);
}
function onQueryFailed() {
alert('Error!');
}

</script>


</body>

</html>
Improve this question
1
  • What is the internal name of your hyperlink field?
    – Dylan Cristy
    Jan 6, 2021 at 17:13

2 Answers 2

Reset to default
0

You need to use the internal name of the column. For developing in REST I recommend using something like Postman or I use a Chrome extension called Talend API Tester (free version). This allows you to write and send REST calls a lot quicker than writing it in javascript, testing, debugging, fixing, etc.

But either way you can find the internal name either by going to the list properties and editing the column, the internal name will be in the url.

Or you can make a rest call to {site}/_api/lists/getbytitle('{name}')/fields?$select=Title,InternalName. That will give you a list of all the display and internal named columns available in that list.

Improve this answer
0

I just did a quick test to see if you were going to need to use $expand in your REST query to expand out the values of the hyperlink field (description and actual URL), and it looks like you won't. But you do have to know that a hyperlink field value returned from a REST query is a JSON object, not just a simple primitive value like a string or integer.

It looks something like this:

screenshot of hyperlink field JSON

Now, in the case of my screenshot, the internal name of my hyperlink field is in fact "URL", but that may not be the case for your hyperlink field. So you will still need to know the internal name of your hyperlink field in order to access the values, but once you know that you can access the values of the Description and Url properties of the field.

Based on your code example, you would get to the URL of your hyperlink field by doing something like this:

function onQuerySucceeded(data) {
    var listItemInfo = '';
    $.each(data.d.results, function (key, value) {
        listItemInfo += '<b>Title:</b> ' + value.Title + '<br />';

        // access the description as a sub-property of your hyperlink field
        var linkDescription = value.YourHyperlinkField.Description;

        // access the url as a sub-property of your hyperlink field
        var linkUrl = value.YourHyperlinkField.Url;

        listItemInfo += '<a href="' + linkUrl + '">' + linkDescription + '</a><br />';
    });
    $("#divResults").html(listItemInfo);
}

where you would have to replace YourHyperlinkField with the internal name of your hyperlink field. If that does indeed happen to be "URL", then you would use

value.URL.Description
value.URL.Url
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.