I'm overriding the Display Form of a list as per Mark Rackley's blog post: http://www.sharepointhillbilly.com/Lists/Posts/Post.aspx?ID=47

For this particular list, I need to parse a text field, split it into an array, and build a table containing the array elements. However I can't seem to access the text of any elements on the form. The very same code/html functions as expected in the Edit Form, so I feel I've narrowed the culprit to something in the Display Form.

An element like:

<span class="formOverride" id="rName" data-displayName="Requisition Name">
    <!-- FieldName="Requisition Name" FieldInternalName="Title" FieldType="SPFieldText"-->
    "Test Requisition"

Returns empty with:

var testString = $("#rName").text();
alert("'" + testString + "'");

I've tried a number of selectors, including plain JS, and they all return an empty string. Again, the very same code in the Edit Form returns the string as expected.

The data shows in the page source, and in Inspect Element from Chrome. Inspect DOM Properties of the element in question also shows that the data is available, but the selectors just don't pick it up.

Anyone know of something in the SharePoint 2013 Display Form that would prevent script from accessing text? When I remove the text(), the alert gives the generic [object Object] output, so the selector seems to be picking the element up, just not the text...

  • When you view the element in a browser (IE is F12 to view dev tools) is the id attribute still rName or is it some generated id tacked on the front of that? Commented Nov 13, 2013 at 21:56
  • The HTML above is from inspect element in Chrome, so the ID is being maintained. I've tried many other selectors as well that all would point definitively at this element and they all return an empty string.
    – Joe
    Commented Nov 13, 2013 at 22:00
  • In IE10, Select element by click shows a the same span as above, with five child nodes in the tree. Empty text, comment (same as above), empty text, Test Requisition, empty text.
    – Joe
    Commented Nov 13, 2013 at 22:20

1 Answer 1


Try using the getTagFromIdentifierAndTitle method to get this value rather than using jQuery's element selector. The reason being is SharePoint writes some funky code for it's aspx pages and if you are using SharePoint Designer's form fields, this code will most likely find the element you need. Give it a try to set your variable and then extract the innerHTML or however you want to get the text out of it.

var txtRName = getTagFromIdentifierAndTitle("input", "", "Requisition Name");

function getTagFromIdentifierAndTitle(tagName, identifier, title) {
  var len = identifier.length;
  var tags = document.getElementsByTagName(tagName);
  for (var i=0; i < tags.length; i++) {
    var tempString = tags[i].id;
    if (tags[i].title == title && (identifier == "" || tempString.indexOf(identifier) == tempString.length - len)) {
      return tags[i];
  return null;
  • Returns null as the for loop is skipped entirely since tags.length evaluates to zero.
    – Joe
    Commented Nov 14, 2013 at 16:49
  • Sorry, it should be the field title and not it's ID. Use Requisition Name instead of rName and I believe input instead of select. I have updated my answer. Commented Nov 14, 2013 at 17:07
  • Sorry... waking up a bit now. SP Display Form isn't going to have any active inputs holding a list's field values. Scrubbed the source more, and found that the only storage place for the field value I'm working with is in var WPQ2FormCtx = {"ListData":{"ContentType":"Item","Title":"Test Requisition"...and all the other fields, along with their possible values. I'm guessing that SP uses this container then and references the data therein from elements elsewhere. It's the same for an edit form when searching for the specific data.
    – Joe
    Commented Nov 14, 2013 at 19:21

Your Answer

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

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