5

In my SP Online (2013) site I have some heavily customised list input forms, the input fields of which I have been quite happily referencing using jQuery using the following syntax:

$('input[title="IncidentStatus"]').val($nextStageValueParam);

and so on...

Anyway, today (Monday 27th Jan 2014), these forms' rendering started to fail despite previously having been OK. On closer investigation, I narrowed down the issue to those fields which I have marked as 'required' when defining the SP column.

Drilling down into the DOM I notice that the title attribute for the mandatory fields is now suffixed with the string 'Required Field', example below:

<select id="ctl00_ctl41_g_9f8b1d26_1bb4_4f9f_b081_2e5349ec8998_ff21_ctl00_Lookup" class="fg_initial" title="IncidentStatus Required Field" name="ctl00$ctl41$g_9f8b1d26_1bb4_4f9f_b081_2e5349ec8998$ff21$ctl00$Lookup" fgid="fg_incidentBranch"></select>

Now thankfully, this is fairly straightforward to resolve by using the jQuery 'begins with' attribute selector (e.g.

$('input[title^="IncidentStatus"]').val($nextStageValueParam);

)

Has anyone else experienced a similar problem recently? Is is something I should have been aware about?

  • Yes, others have noticed this change, which has broken alot of client side customizations. Here is a thread from SPServices author: sympmarc.com/2014/01/23/… – Paul T. Jan 27 '14 at 3:14
  • Yes I am facing same problem. I have used jquery to access fields with title attribute and now it is broken. I have used it on many pages so it wll be huge change for me to change jquery code. what is the reason which cause to change title attribute? Can we have any site level setting to reset it back. Your reply will help me a lot. Thanks. – Sachin Shelake Feb 18 '14 at 7:14
2

Seems like this has caused a fair bit of angst amongst the dev community working with SP Online and far greater minds than mine have devoted blog posts to the whys and wherefores, but the change is real and here to stay - on the grounds of accessibility for screen readers etc. etc.

There's a couple of ways I got around this:

Firstly you could change your field references, thus:

$('input[title="IncidentStatus Required Field"]')

Secondly, change your field references to use the jQuery 'starts with' attribute selector, thus:

$('input[title^="IncidentStatus"]')

Thirdly, I have used the following self envoking function within a common library to cycle through the field titles and then strip out the 'Required Field' string as appropriate, thus:

(function fixfields(){ //this self involking function removed the Required Field portion of the field title to ensure all old code works OK
    console.log("Fixing Required Field titles");
    $("[title$=' Required Field']").each(function()
    {
    console.log("Fixing: " + $(this).attr("title"));
    $(this).attr("title",$(this).attr("title").replace(" Required Field",""))
    });

})();

(courtesy Mark Rackley on Marc D Anderson's blog (http://sympmarc.com/2014/01/23/office-365-update-changes-display-name-on-required-fields/comment-page-2/#comments)

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.