I am getting the said error
$(".column").sortable is not a function
I m trying to create sortable/movable divs in my code.
Issue is that if I m using a new project then the code is working fine, but when I try to run it in my project it gives me the said error..
Any idea??
Sounds like you have forgot to add your jquery-ui script library to the page. Add the following within the head section to see if it works.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
Related
With thymeleaf and following code
<script th:src="#{/js/init.js}"></script>
I would like to make it like following in order to avoid browser caching for this file
<script th:src="#{/js/init.js?${minute}}"></script>
${minute} will be current time minute.
Try:
<script th:src="#{/js/init.js(minute=${minute})}"></script>
Reference: Standard URL Syntax
I solve the question by use the following, it's a bit longer than expected.
<script th:src="#{/js/init.js(minute=${#dates.format(#dates.createNow(), 'mm')})}"></script>
If you just want to provide versioned static files, you might try spring resource versioning. One possible solution using configuration only is described here https://stackoverflow.com/a/49040930.
I'm using CKEditor for the first time and trying to do something that I thought would be very simple to do but so far I've had no success.
Essentially I want to place the editor.js, config.js and styles.js in a scripts folder but want the "Skins" folder that contains the css and images to appear within a separate "Styles" folder.
The application consists of a simple view that displays the editor on load.
The code to display the editor is a follows:
angular.element(document).ready(function () {
CKEDITOR.config.contentsCss = '/Styles/CKEditor/';
CKEDITOR.replace('editor');
});
The HTML within my view is as follows:
#section scripts
{
<script src="~/Scripts/ckeditor.js" type="text/javascript"></script>
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/Main.js" type="text/javascript"></script>
}
<h2>Index</h2>
<textarea id="editor" name="editor"></textarea>
This is an MVC application and the scripts are rendered at the end of the body within the layout view.
The editor will not display in any browser. As I understand it setting the contentsCss property should do the trick.
If I place the skins beneath my script folder it works fine. I can see in the generated source that it is adding a link to the header pointing to /Scripts/Skins/moono..., but I want it to add a reference to /Styles/Skins/moono...
Is what I am trying to do feasable and if so what am I missing here? I was expecting this to be simple.
As a work around I could just add some routing rules that redirects the relevant request to a different location, but I'd rather get to the bottom of the issue before I do this.
Further information:
My application is an ASP.net 4.5/MVC 4 app.
I'm referencing angular because I'll be using that once I've sorted this issue. I have tried removing all references to angular but the problem still persists.
I've tried setting the contentsCss property in the following ways:
Directly using CKEDITOR.config.contentsCss
Within the config.js file. The sample assigns an anonymous function to CKEDITOR.editorConfig and in there you can manipulate congif entries.
Passing a config parameter when calling the "replace" method on the CKEditor object.
I've tried manipulating the contentsCss property both before and after the call to replace.
I'm using the latest version of CKEditor (4.2)
Thanks to #Richard Deeming, I've found the answer.
I'm using the default moono style, so I needed to set the CKEDITOR.config.skin property as follows:
CKEDITOR.config.skin = 'moono,/Styles/CKEditor/Skins/moono/'
My final code now looks like this:
angular.element(document).ready(function () {
CKEDITOR.config.skin = 'moono,/Styles/CKEditor/Skins/moono/';
CKEDITOR.replace('editor');
});
You have to set the url to the actual folder containing the skin itself (I thought CKEditor might append skins/mooono itself but it doesn't).
I also found that you must include the final '/' from the URL.
Looking at the documentation, you need to specify the path as part of the skin name:
CKEDITOR.skinName = 'CKeditor,/Styles/CKeditor/';
I am trying to use jquery UI based transition sliders on my homepage. I tried different jquery plugins but I always get an error in the console : jQuery is not a function or some function error related to jQuery . Plugins i have tried are Lof JSliderNews 1.0,featured-content-slider, etc..
Even after following several posts on the web , iam not able to make the plugin work at all. Jquery part doesn't work. I have used carousels and other plugins with jquery.noConflict but this time nothing works!
Here's what iam doing:
jQuery.noConflict();
jQuery(document).ready(function(){
jQuery("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
I also tried replacing all $ with jQuery in the included scripts but that too doesn't work in magento. Please help, i need to finish the project soon
Have you tried putting all the jQuery stuff into a function and map the window.jQuery variable as an argument? Like so:
(function($){
//... do your jQuery thing here
})(jQuery);
BTW: "jQuery is not a function" might also be a hint that you forgot to load the jQuery library into your project.
Do you have "JS file merging" enabled? If yes, try to disable it, clear your cache and try again. It helped me once when I had a smiliar issue.
Regards
I am trying to hide/show elements in a view using following code:
$('buttonClass/IDhere').click(function (){
$('theDivYouWantToShowClass/IDhere').toggle();
});
However, I am keep getting
Microsoft JScript runtime error: '$' is undefined
What might be the issue and how do I fix it?
This thread is pretty old, but I think an answer in the thread would be nice. I agree with the previous two answers - it's likely because jQuery wasn't loaded. You can load it this way (usually toward the top of the file):
<script src="~/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
(or whatever the current version of jQuery is).
Hope it helps.
It sounds like jQuery hasn't been loaded yet.
did you make sure download the jquery javascript file and link in to your html/aspx page before attempting to use jquery scripting?
you need to:
download the jquery code/file from:
http://jquery.com/
copy the file (jquery-1.8.3.min.js) you just downloaded somewhere into your web project directory/folder
then insert the link to this file into html/aspx page:
now try to run webpage
references:
www.youtube.com/watch?v=Bf9Gs-09uzQ
www.ajaxtutorials.com/javascript/introduction-to-jquery-learn-jquery-from-scratch-in-asp-net-4-0/
$ is defined by default when you load jquery. I would try and use jquery() to see if somehow $ is being unloaded etc. You can also load up firebug and hit the page. It should show up as a global variable/function. NOTE: You can also setup jquery to not setup the short hand "$".
since it looks like your trying to target classes and ID's - try this
$('.buttonClass #IDhere').click(function (){
$('.theDivYouWantToShowClass #IDhere').toggle();
});
This is a definite case of jQuery module not being loaded. In my case, common.js had a jQuery related script
$( document ).ready(function() {
var divSessionWarning = $("#idivWarn");
divSesWarning.load(divSesWarning.data("src"));
});
This was called in header.jsp. Swapping the sequence of loading the jQuery followed by the common.js resolved the issue.
<script language="javascript" type="text/javascript" src="/JAVASCRIPT/jquery/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/JAVASCRIPT/mod/common.js"></script>
Hope this helps.
If jQuery is called then make sure jQuery is loaded before the stylesheet as its likely that calls it
I am having a wierd error and jQuery not working depending on how the url is written.
if the url is
/index.cfm?show=about-us
all is good. BUT if the url is
/index.cfm/show_about-us
jQuery doesn't seem to load correctly and I get a "$ is not defined" error in fireBug
I can't use the standard ?= query string I need to be able to use the re-write method.
Any ideas are appriciated
Lance
What does your <script src="..."> say? I have a feeling it's looking for /index.cfm/jquery.js which doesn't exist.
Sorry this was a reference issue to the files. Evendently in that re-write sytle the dom is still trying to navigate the file system starting in the /show_about-us/ directory which isn't truely a directory.
That's it. #recursive got it in one.
Consider using the absolute path from the root of your domain in src attributes. For example: <script src="/jquery.js">