Semantic UI Dropdown multiple select close not working - javascript

I am working on multiple selection dropdown in semantic ui and have got most of it working except closing out of items after you've selected them.
I have replicated the example they give in the documentation in a jsfiddle and still having the same problem.
I have also tried putting a 'close' parameter in the dropdown function.
http://jsfiddle.net/mpenovich1/qYp8L/28/
$('#multi-select').dropdown();
https://semantic-ui.com/modules/dropdown.html#/usage

To get the item delete button (✖) and the dropdown button (▼) working, you have to use a more recent version of jQuery than 1.7.1, apparently. Here is a jsfiddle that works with version 1.9.1 (specified in the Javascript pane). According to my tests, it also works with jQuery 2.2.4 and 3.2.1.
The code itself has not changed:
$('#multi-select').dropdown();

Related

Migrating scripts from 1.7.1 to 1.9 jQuery (Bootstrap 3)

I have javascript scripts that work with jQuery 1.7.1, but don't with 1.11.1 that comes with Bootstrap v3.3.4
The code is across three scripts, but here is one part that toggles rows in a table:
$('#change-selection').click(function(e){
e.preventDefault();
$('.product-choice').toggle();
$(this).toggleClass('closed');
});
$('.compare th a').click(function(e){
e.preventDefault();
var className='tr.'+$(this).parent().attr('class');
$(className).toggle();
$(this).toggleClass('closed');
});
If I link the page to jQuery 1.7.1, toggling across the HTML table works, CSS works as well, but Bootstrap dropdown navigation stops working (fair enough, Bootstrap requires a higher jQuery version). If I use the jQuery that came with Bootstrap, toggling across the HTML table stops working, and CSS inside the table gets messed up. The code above should be a good start to fix the toggling at least. I read about what got deprecated with jQuery 1.9, but that was not enough for me to fix this. I replaced that one instance of attr with prop, but that did not make any change. Is this code troubling for that toggling function or I should look elsewhere?
Thank you
If you got to have, you can have 2 or more versions of jQuery on the same page. https://forum.jquery.com/topic/multiple-versions-of-jquery-on-the-same-page

Bootstrap datepicker not responding in IE8

I have similar issue like in Bootstrap Datepicker Not Working .I followed the solution of putting datepicker code in document.ready() as
$(function(){ $('#datepicker').datepicker(); });
But,still on clicking datepicker icon, it is showing "Stop script running..." pop up.I am using jquery 1.8.3 version with bootstrap version 2.1.1.It is working fine in Jquery version 1.8.1.what change needs to be done for jquery version 1.8.3
This was a bug in the original release in September 2012. Coders have since forked the project and made fixes/improvements - one of them being this IE 7/8 bug...
https://github.com/eternicode/bootstrap-datepicker/issues/144
Essentially, download the latest Master build contents and you should be good to go.

unable to select from drop-down with firefox (works in Chrome)

What I want to do is be able to select from the drop-down menu without the accordion changing. This works in Chrome. However, when I was trying it in Firefox, it no longer worked.
Here is my jsfiddle.
Why does this not work in Firefox?
I believe that it is this code that is causing the problem (dropdowns without the selectOne class work fine):
$(function () {
$('.selectOne').click(function(){
return false;
});
});
Try to upload the linked libraries. Have you linked the plugin. Accordian is a jQuery Plugin, not just jQuery.

jquery tipsy. trigger:focus not working on radio buttons

I'm using this plugin for displaying tooltips
Looking at this fiddle - http://jsfiddle.net/CmmUC/1/
You'll see that the tootip does not appear. It works if you change the javascript to
$('.tooltip').tipsy({ gravity: 'w' });
​Why does plugin hate 'focus'? Am I missing something obvious that's causing the issue?
I'm working in the latest stable Chrome.
see my updated version of your fiddle:
http://jsfiddle.net/CmmUC/7/
basically you need to add the option trgger: 'manual' upon instantiation and maually show/hide the tipsy using the jquery hover function.

jQuery UI Slider not shown for some reason

I use jQuery UI 1.8.16 incl. the "smoothness" theme on a text input field. In FF FireBug, I can see all necessary dependencies for the slider appear:
jQuery 1.7.1
UI Core
UI Widget
UI Mouse
The theme is also loaded and all sources are checked. When inspecting the form field, the slider seems to be attached. But for some reason the slider doesn't appear as "slider".
Screenshot including FireBug
make sure the slider css is there. That would be the only thing i can think of. Maybe you didn't check the slider option when downloading the theme.
Edit: Moved from the comments. Some will work because there is ui-widget. So sometimes thats all it uses. For certain ones it has it's own, like slider.

Categories

Resources