jQuery UI Slider giving: Uncaught Syntax error, unrecognized expression: # - javascript

I am trying to use the jQuery slider plugin but it keeps giving the JavaScript error:
Uncaught Syntax error, unrecognized expression: #
Here is the script:
http://www.filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/
You can view a demo here:
[link-removed]
Any ideas?
Thanks.

I figured out the problem. The plugin you're using to convert the slectbox to the slider requires the selectbox to have an id attribute.
Simply add id="slider" to the selectbox and it should work.

Related

How to run Bootstrap-select with bootstrap 5 without this error

I'm using Bootstrap 5 on a project (template based) and when I tried to include bootstrap-select (version 1.13.14) but the console returns the following errors:
Uncaught TypeError: Cannot read properties of undefined (reading 'Constructor') ---- bootstrap-select.js:3133
The line in question reads:
// get Bootstrap's keydown event handler for either Bootstrap 4 or Bootstrap 3
var bootstrapKeydown = $.fn.dropdown.Constructor._dataApiKeydownHandler || $.fn.dropdown.Constructor.prototype.keydown;
As a result, the select element with class selectpicker won't show up.
Any thoughts or ideas? Thanks!
Well... solved it by using the bootstrap-select version 1.14-beta. Found the answer in this thread: https://github.com/snapappointments/bootstrap-select/issues/2439
But notice that this is a beta version.

angular-scroll conflict with jQuery 2.1.1

I would like to use angular-scroll. I'm using the scrollTo function within my template:
<li class="tab col s2"><a class="menupoints" du-smooth-scroll="#section-3" du-scrollspy>Kontakt</a></li>
Problem is, that i also have to use jQuery 2.1.1 and this is somehow conflicting. I always get following error:
Uncaught TypeError: Cannot read property 'top' of undefined
I know that my implementation is correct, because when i remove jQuery 2.1.1 everything works fine. So is there ways to resolve this conflict?

Uncaught ReferenceError: hide is not defined error

I'm newbie on javascript. I'm using Twitter Bootstrap Modal.
console get me this error. why?
Uncaught ReferenceError: hide is not defined
JS
$('#te').modal(hide)
You may try this (Check the documentation):
$('#te').modal('hide');
Notice the quotes, you missed those, hide should be 'hide'.
You need to put quotes around hide.
Like this:
$('#te').modal('hide')
Reference: http://getbootstrap.com/javascript/#modals-usage

Why does my jQuery templating approach not work in jQuery 1.9.1 anymore?

Please see this fiddle: http://jsfiddle.net/VdZJx/2/
$(function()
{
var li = $($("#link-item-template").html()).find("a").attr({
href: "javascript:;"
}).html("Toggle");
$("ul").append(li);
});
This is a templating approach I, and as I've seen even some other libs are using to store and generate html templates.
If you take the jQuery version 1.9.1, let this demo run and watch the console it turns out that Sizzle throws the following error when you try to generate a new jQuery object out of $().html(). See:
Uncaught Error: Syntax error, unrecognized expression: <li>
<input type="checkbox" /> <a></a>
</li>
What can I do to get it to work again?
As you are not really getting proper elements, but the contents of a script tag as a string, which happens to be HTML, a lot of whitespace and newlines is added to the HTML string, and you need to trim that to make it work as a valid selector :
$($.trim($("#link-item-template").html()))
FIDDLE

JQuery highlight won't work

I'm using JQuery to use a highlight effect as discribed on the docs side of JQuery itself.
JQuery HighLight
But when using this on a tr or td element, I'm getting this exception:
Uncaught TypeError: Object [object Object] has no method 'effect'
I tried to use a simple effect like hide() and that effect did work.
Could anybody help me out here? What am I missing here?
This is the code I'm using:
$('.small_form').live "ajax:success", (event, xhr)->
$(#).parents('tr').effect("highlight", {}, 3000)
It is in coffe script, I also made sure the ajax request works. Because I got other effect working using this event.
Add this into your page after loading jQuery.
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
The effect method is part of jQuery UI, and is required when trying to use it!

Categories

Resources