0

I've been struggling for a few days now trying to solve this problem. I have a calendar app part on my page that is taking up too much space. The requirements for the calendar are that it just displays the first 3 letters of the day i.e. MON in place of MONDAY etc.

JSFiddle I've created this JS fiddle with a similar structure to how the dates are displayed in the calendar web part however if I try place this code in a Javascript editor web part on my page it doesn't change the text.

I've tried putting the code in the master page itself but that didn't load or run at all.

Any help would be appreciated

Regards ~Donald Dunlop

Improve this question
2
  • Did you try debugging through browser developer tools, to check whether the script you have written is getting hit when the page is loaded?
    – msounthar
    Sep 2, 2013 at 8:05
  • 1
    Just ran it using that, got '$' is undefined. The solution was to put the script tag for JQuery in the master page's <head> tags. Using the browser developer tools I found that the JQuery was not firing because '$' was not defined. The cause of that error is that the script tag importing JQuery was in the <body></body> tags of the master page and not in the <head></head> tags. Moving the script to the head tag loads JQuery before building elements on the page and defines the '$' operator.
    – Donald Dunlop
    Sep 2, 2013 at 8:22

2 Answers 2

Reset to default
1

Thanks to Msounthar the solution was found using IE's developer tools script tab. When the page was reloaded I got a message stating that "Element '$' is undefined". A quick search revealed that this was caused by the tag that loads JQuery not being in the right position.

Moving the tag into the tag of the site collection's master page loaded JQuery before the page and then when the script was called in a Script Editor web part the code executed without fail.

Improve this answer
0

You must have your JavaScript code that modifies the HTML inside special jQuery function that runs after page HTML is rendered. More info of .ready() here.

$(function() {    
    //Your code    
});
Improve this answer
1
  • Hi, the issue was not that as you can see in the JSFiddle link the code works without issue, the problem was that JQuery wasn't initialised on the master page before the function ran
    – Donald Dunlop
    Sep 3, 2013 at 7:05

Your Answer

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

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