Apex Code Development You need to sign in to do that
Don't have an account?
Developer Trail Beginner - Visualforce Basics - Using Static Resources - Examples Bug
I was having issues getting the "jQueryMobileResources" Visual Force example code to work properly in the Using Static Resources module.
None of the images,CSS or JS files were being found in the .zip file. In other words I was not getting the expected results as depicted in the trail head. If you attempt to pull up the url/path directly in the browser I was getting HTTP 404 not found errors.
Resolution:
If none of the static images are being being found in the zip file, prefix the path with the root directory of the zip file.
For example:
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
should be:
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
The root directy for the downloaded jQuery Mobile 1.4.4 is "jquery"
So the actual code would be
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>
Hope this helps if someone else is not getting the Using Static Resource module example code working properly.
None of the images,CSS or JS files were being found in the .zip file. In other words I was not getting the expected results as depicted in the trail head. If you attempt to pull up the url/path directly in the browser I was getting HTTP 404 not found errors.
Resolution:
If none of the static images are being being found in the zip file, prefix the path with the root directory of the zip file.
For example:
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
should be:
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
The root directy for the downloaded jQuery Mobile 1.4.4 is "jquery"
So the actual code would be
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>
Hope this helps if someone else is not getting the Using Static Resource module example code working properly.
<apex:image alt="eye" title="eye"
url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/eye-black.png')}"/>
<apex:image alt="heart" title="heart"
url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/heart-black.png')}"/>
<apex:image alt="cloud" title="cloud"
url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/cloud-black.png')}"/>
I resolved this problem after removing "jquery.mobile-1.4.5" in url path... for example:
url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"
instead of
url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.5/images/icons-png/eye-black.png')}"
I don't know if I didn't create the zipped folder and/or static resource as they expected, but what I found was that I needed to remove the jquery from all the urls. So I changed from the code in the trailhead -
URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.css')}"/>
URLFOR($Resource.jQueryMobile,'jquery/jquery.mobile-1.4.5.js')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/heart-black.png')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/cloud-black.png')}"/>
to
URLFOR($Resource.jQueryMobile,'jquery.mobile-1.4.5.css')}"/>
URLFOR($Resource.jQueryMobile,'jquery.mobile-1.4.5.js')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/heart-black.png')}"/>
url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/cloud-black.png')}"/>