Grab a specific property bag using ECMA script

Question

I am trying to grab a key/value pair from a specific property bag but can't find any documentation or example code on how to grab a property bag. Currently I can only seem to grab allProperties. Here is my code:

    <CommandUIHandler
          Command="FCS.Intake.Tab.Reports.TL"
          CommandAction="javascript:
          function getWebProperty() {

        var ctx = new SP.ClientContext.get_current();
        var web = ctx.get_site().get_rootWeb();
        this.props =  web.get_allProperties();

        ctx.load(web);

        ctx.executeQueryAsync(Function.createDelegate(this, gotProperty), Function.createDelegate(this, failedGettingProperty));
    }

    function gotProperty() {
      window.location.href = this.props.get_item('PropertyKey1');       
    }

    function failedGettingProperty() {
        alert('failed');
    }
  getWebProperty();"
        />

This doesn't work because the key/value pair is located in a property bag as opposed to a site property.

Does anyone know how to grab a specific property bag using ECMA script?

Answer 1

I was unable to find a way to grab a specific property bag, but using the information from Aaron's post (loading this.props), one can grab a property bag as an xml string, parse that xml and grab the specific value they are looking for. Here is how I did it:

function getWebProperty(propKey, propBagName) {          
  var ctx = new SP.ClientContext.get_current();
  var web = ctx.get_site().get_rootWeb();
  this.props =  web.get_allProperties();
  this.propKey = propKey;
  this.propBagName = propBagName;
  ctx.load(web);
  ctx.load(this.props);
  ctx.executeQueryAsync(Function.createDelegate(this, gotProperty), Function.createDelegate(this, failedGettingProperty));
}

function gotProperty() {
      var myPropBag = this.props;
      // Grab specific property bag as xml
      var myPropBagXML = myPropBag.get_fieldValues()[this.propBagName];        
      var parser = new DOMParser();
      var xmlDoc = parser.parseFromString(myPropBagXML, 'text/xml');
      xmlDoc.async = 'false';
      var propValue = xmlDoc.getElementsByTagName(this.propKey)[0].childNodes[0].nodeValue;
      alert(propValue);                
}

function failedGettingProperty() {
    alert('failed');
}

Answer 2

Try loading this.props

function getWebProperty() {

    var ctx = new SP.ClientContext.get_current();
    var web = ctx.get_site().get_rootWeb();
    this.props =  web.get_allProperties();

    ctx.load(web);
    ctx.load(this.props); //need to load the properties explicitly
    ctx.executeQueryAsync(Function.createDelegate(this, gotProperty), Function.createDelegate(this, failedGettingProperty));
}    

Then in your success function, you need to access the property bag's values by running it through get_fieldValues() and then an indexer for the key to the property.

function gotProperty() {
    var myPropBag = this.props;
    alert(myPropBag.get_fieldValues()["allowdesigner"]); //returns the value of the key allowdesigner
}

Firefox's firebug will allow you to do

console.log(myPropBag.get_fieldValues());

which will print out all the property bag keys to the console window.

Thanks, -@SharePointAP

Answer 3

Since here is no answer covering the actual question - "Grab a specific property bag using ECMA script" here's some code to do exactly that:

ExecuteOrDelayUntilScriptLoaded(getWebProperties, "sp.js");
var webProperties;
function getWebProperties() {
    var clientContext = new SP.ClientContext.get_current();
    webProperties = clientContext.get_web().get_allProperties();
    //get a single property
    clientContext.load(webProperties, 'FollowLinkEnabled');
    // get multiple properties
    // clientContext.load(webProperties, 'FollowLinkEnabled');
    // clientContext.load(webProperties, '__PublishingFeatureActivated');
    clientContext.executeQueryAsync(Function.createDelegate(this, this.getWebPropertiesSucceeded), Function.createDelegate(this, this.onQueryFailed));
}

function getWebPropertiesSucceeded() {
    var allProps = webProperties.get_fieldValues();
    for (var prop in allProps) {
        console.info(prop + ' : ' + allProps[prop]);
    }
}

function onQueryFailed(args, sender) {
    debugger;
    //handle errors here
}

Here's the result when requesting the 2 mentioned properties:

Why should i request single values instead of getting the whole package?

Simply to reduce network traffic and increase the performance.

Answer 4

Actually you can grab a specific property as mentioned here.

The trick is to load, not the web but the object returns from "web.get_allProperties".

Then, you just need to call .get_item('name_of_the_prop_you_want_to_retrieve')

Hope it helps