0

We are using SP 2013 publishing features and have the document id service turned on for our site collection. So each new page has a document id assigned to it.

We also created a custom content type for our pages which includes some additional metadata -- some managed metadata fields and a couple of text fields.

We want to right some custom javascript code that uses the document id and managed meta data associated with the page.

If I add a Page Field Filter into a webpart zone on the page I see that the filter has access to the various values in the columns we added.

I'm trying to figure out if there is a way to access those using javascript. I've searched, but the combination of page field brings in too many unrelated things having to do with pages and fields.

So is there a way to get those values using javascript?

Also is there a list of what Page Fields exist by default? I can't find any documentation on them.

Edit

I found that when I'm in a content search web part I can query the fields on the page with {Page.Fieldname}. The field name seems to be the internal name, for example Document ID seems to be _dlc_DocId

Still trying to find a way to list all that is available and to figure out how to get it using javascript.

0

This would be long answer :) but I have given you code also to try it our from your side.

First please note, Pages is like any other document library. You can go to Pages Library settings to view all the fields available for particular page library.

Q. Also is there a list of what Page Fields exist by default? I can't find any documentation on them.

Go to Pages Library -> Go to Library settings, you would be on below page with your parameters List=".........."

https://contoso.sharepoint.com/sites/mysitecollection/_layouts/15/listedit.aspx?List=%7Bdfefaf2f-00f1-1232-2232-69078b786c15%7D

scroll little down you will see fields of page library.

enter image description here

Q. Get Internal Name of Field from UI

Click on any column displayed in above screenshot, you would be redirected to below url

https://contoso.sharepoint.com/sites/mysitecollection/_layouts/15/FldEdit.aspx?List%7Bdfefaf2f-00f1-1232-2232-69078b786c15%7D&Field=ArticleStartDate

If you look closely &Field=ArticleStartDate is at end of URL. This is your internal name of Field Article Start Date

Q. How to get Pages Library Fields from Javascript

Here we can do using JSOM or REST API, I will show example with REST API.

What I did is created txt file which you can refer in content editor webpart to test the demo. copy below code in txt file.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script>
function getfields(){

var url = "/_api/Web/Lists/GetByTitle('Pages')/Fields?&$select=StaticName,Title,TypeAsString,Hidden";
    $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + url,
        type: "GET",
        headers: {
            "accept": "application/json;odata=verbose",
        },
        success: function (data) {

            console.log("");
         $('#fieldList').DataTable( {
        aaData: data.d.results,
        "aoColumns": [  
            {    
                "mData": "StaticName"    
            },   
            {    
                "mData": "Title"    
            },   
            {    
                "mData": "TypeAsString"    
            },   
            {    
                "mData": "Hidden"    
            }
            ]  
    } );
    $('#fieldList').show();
            return false;
        },
        error: function (error) {
            alert(JSON.stringify(error));
            return false;
        }
    });

}

function getvalues(){

var url = "/_api/Web/Lists/GetByTitle('Pages')/Items(@v0)/FieldValuesAsText?@v0=" + 1;
    $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + url,
        type: "GET",
        headers: {
            "accept": "application/json;odata=verbose",
        },
        success: function (data) {


            var textedJson = JSON.stringify(data.d, undefined, 4);
            $('#myTextarea').show();
            $('#myTextarea').text(textedJson);
            return false;
        },
        error: function (error) {
            alert(JSON.stringify(error));
            return false;
        }
    });

}
</script>



Using this button to get Available Page Fields<button onclick="javascript:getfields();return false;"> Get Pages Library Available Fields </button>

</br>
Enter Page Item ID To Retrieve Field Values of Page : <input id="PageItemID" >
<button onclick="javascript:getvalues();return false"> Get Page Field Values</button>

<textarea style="display:none;width: 100%;min-height: 30rem;font-size: 0.8rem;line-height: 1.2; name="" id="myTextarea" cols="30" rows="10"></textarea>

<table id="fieldList" style="width:100%;display:none">
   <thead>    
            <tr>    
                <th>StaticName</th>    
                <th>Title</th>    
                <th>TypeAsString</th>    
                <th>Hidden</th>    
            </tr>    
        </thead>    
</table>

Add a content editor webpart of any page and add reference to above save txt file.

On page load you would get below screen

enter image description here

click on 'Get Pages Library Available Fields', you will get all the available fields, please note that this will give you all fields, OOTB, hidden, custom fields for all content types, it will give you display name, internalname(StaticName), Field Type, and Hidden, whether it is hidden or not.

enter image description here

Now to retrieve field values of particular page, Enter Page Id(item id of Page), and click on 'Get Page Field Values'. It will show you json object in text area with field name and its value.

enter image description here

Hope this helps..Happy coding..!!!

  • Thank you this is very complete, but this is how to use REST to get those values. But the page is already loaded and has certain values like the Document ID already on the page. I want to be able to get the values that are already on the page if possible. Or are Page Field values only available server side and there is nothing that can be accessed client side? – Rothrock Jun 6 at 14:55
  • can you share screenshot of your page?... If it is displaying certain values on page there would be some code doing the same...wiki page displays some fields on page like created date, modified date, tags etc on page if we are using wiki page layout..but for other pages, until we have some webpart or code directly on page it won't display any field....this is my understanding.... – Siddharth Vaghasia Jun 6 at 18:05
  • The example I gave above. Document ID. It isn't displayed on the page, but it is available to filters and the Content Search Web Part and they must be getting that value somewhere. – Rothrock Jun 6 at 19:19
  • That webparts are server side webparts... they are rendered as HTML on browser in page.. you cannot use it from client side... – Siddharth Vaghasia Jun 6 at 19:33
  • If you need to get values of page’s fields.. you have to query it using Javascript code... I don’t see any other way... hope this is making sense.. – Siddharth Vaghasia Jun 6 at 19:34
0

Unfortunately I don't believe that it can be loaded without a round trip to the server via JSOM or REST. One option I've used in the past is using a function on page load to populate an object by add this to the page.

var PageObject = function(){
  var ctx = new SP.ClientContext.get_current(),
      page = ctx.get_web().get_lists().getById(_spPageContextInfo.pageListId).getItemById(_spPageContextInfo.pageItemId);
  ctx.load(page);
  ctx.executeQueryAsync(
    function(){
      _spPageContextInfo.pageObject = page;
    },
    function(sender, args){
      console.error(args.get_message);
    }
  );
}
_spBodyOnLoadFunctionNames.push(PageObject);

The items can then be accessed via JavaScript by _spPageContextInfo.pageObject.get_item('<Field Name>')

  • Thanks, but I'm hoping to find a way to get them without having to wait for the "page to load again" as it were. – Rothrock Jun 6 at 19:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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