Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

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

share|improve this question
    
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 '13 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 '13 at 8:22

2 Answers 2

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.

share|improve this answer

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    
});
share|improve this answer
    
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 '13 at 7:05

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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