View custom field property value using JavaScript

Question

I'm using SharePoint 2010. Need to retrieve the Custom field property values using a JavaScript. [Trying to do this during item click in the SharePoint list item view. I call the JavaScript on the onClick() of a hyperlink .]

I'm using the field.get_schemaXml(); method to get the Field details.

var field = fieldCollection.getById('aa9171e5-95af-4acb-8501-fc6b2b0dd57f'); //Passing the field ID
var xmlSchemaString = field.get_schemaXml();
var domParser = getDomParser(xmlSchemaString);
var fieldElement = domParser.getElementsByTagName('Field')[0];
var fieldPropertyValue = fieldElement.getAttribute('FieldPropertyName');

  function getDomParser(xmlString) {
      var xmlDoc;

      //IE9, Firefox, chrome, etc browser
      if (window.DOMParser) {
          parser = new DOMParser();
          xmlDoc = parser.parseFromString(xmlString, "text/xml");
      }
      // Internet Explorer 8
      else {
          xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
          xmlDoc.async = "false";
          xmlDoc.loadXML(xmlString);
      }
      return xmlDoc
  }

I am getting the field information at the var xmlSchemaString including the field property keys and values. But when i pass the string to getDomParser() function, NULL is returned to fieldPropertyValue.

Tested in both IE and Chrome, i get the same result...null. How can I access the custom property value in the XML document?

Answer 1

The code that you've provided, works in my case.
Probably the reason why it returns NULL is because property name that is passed does not exist..

The following code sample demonstrates how to retrieve custom field property value:

function loadFieldsProperties(listTitle) {
        var clientContext = new SP.ClientContext();
        var targetList = clientContext.get_web().get_lists().getByTitle(listTitle);
        fields = targetList.get_fields();
        clientContext.load(fields);
        clientContext.executeQueryAsync(onQuerySucceeded, onQueryFailed);


        function onQuerySucceeded() {

            var fe = fields.getEnumerator();
            while (fe.moveNext()) {
                var  field = fe.get_current();

                var xmlSchemaString = field.get_schemaXml();
                var fieldXml = parseXml(xmlSchemaString);
                var fieldElement = fieldXml.getElementsByTagName('Field')[0];
                var fieldPropertyValue = fieldElement.getAttribute('ColName'); //get ColName property value

                //...
            }

        }

        function onQueryFailed(sender, args) {
            //error handling goes here...
        }

    }


function parseXml(xmlString) {
      var xmlDoc;

      //IE9, Firefox, chrome, etc browser
      if (window.DOMParser) {
          parser = new DOMParser();
          xmlDoc = parser.parseFromString(xmlString, "text/xml");
      }
      // Internet Explorer 8
      else {
          xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
          xmlDoc.async = "false";
          xmlDoc.loadXML(xmlString);
      }
      return xmlDoc
  }

ExecuteOrDelayUntilScriptLoaded(loadFieldsProperties, 'SP.js')   

Answer 2

Thanks for the replies, I had a look at the xmlSchemaString. In my case a get the below format in the XML.

<Field DisplayName="****" ID="{Field_GUID}" SourceID={****} Description="****">
<Customization>
  <ArrayOfProperty>
   <Property>
    <Name>MyCustomProperty1</Name>
    <Value>MyCustomProp1_Value</Value>
   </Property>
   <Property>
    <Name>MyCustomProperty2</Name>
    <Value>MyCustomProp2_Value</Value>
   </Property>
  </ArrayOfProperty>
</Customization>
</field>

So i had to use getElementsByTagName() and get the values....So Vadim's right.