FancySelect | A better select for discerning web developers | Browser Plugin library
kandi X-RAY | FancySelect Summary
kandi X-RAY | FancySelect Summary
A better select for discerning web developers everywhere.
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of FancySelect
FancySelect Key Features
FancySelect Examples and Code Snippets
Community Discussions
Trending Discussions on FancySelect
QUESTION
Following is Django Form Field i have defined.
...ANSWER
Answered 2017-Dec-11 at 05:23Use ChoiceField
instead CharField
, it will automatically pass selected value as string.
QUESTION
Following is Html for Drop down
...ANSWER
Answered 2017-Dec-10 at 14:37As mentioned in comments, your HTML is completelly changed, by jQuery script you use. Btw, it is very old script, and seems compatible just with older versions of jQuery.... However, instead element which is removed, now you have with .dropDown class. To get selected value, you can do something like this:
$(".dropDown li").click(function () {
console.log($(this).text())
});
Demo:
$(document).ready(function () {
// The select element to be replaced:
var select = $('select.makeMeFancy');
var selectBoxContainer = $('', {
width: select.outerWidth(),
className: 'tzSelect',
html: ''
});
var dropDown = $('', {className: 'dropDown'});
var selectBox = selectBoxContainer.find('.selectBox');
// Looping though the options of the original select element
select.find('option').each(function (i) {
var option = $(this);
if (i == select.attr('selectedIndex')) {
selectBox.html(option.text());
}
// As of jQuery 1.4.3 we can access HTML5
// data attributes with the data() method.
if (option.data('skip')) {
return true;
}
// Creating a dropdown item according to the
// data-icon and data-html-text HTML5 attributes:
var li = $('', {
html: '' +
option.data('html-text') + ''
});
li.click(function () {
selectBox.html(option.text());
dropDown.trigger('hide');
// When a click occurs, we are also reflecting
// the change on the original select element:
select.val(option.val());
return false;
});
dropDown.append(li);
});
selectBoxContainer.append(dropDown.hide());
select.hide().after(selectBoxContainer);
// Binding custom show and hide events on the dropDown:
dropDown.bind('show', function () {
if (dropDown.is(':animated')) {
return false;
}
selectBox.addClass('expanded');
dropDown.slideDown();
}).bind('hide', function () {
if (dropDown.is(':animated')) {
return false;
}
selectBox.removeClass('expanded');
dropDown.slideUp();
}).bind('toggle', function () {
if (selectBox.hasClass('expanded')) {
dropDown.trigger('hide');
}
else dropDown.trigger('show');
});
selectBox.click(function () {
dropDown.trigger('toggle');
return false;
});
// If we click anywhere on the page, while the
// dropdown is shown, it is going to be hidden:
$(document).click(function () {
dropDown.trigger('hide');
});
});
$(document).ready(function () {
$(".dropDown li").click(function () {
console.log($(this).text())
});
});
BTC▾
BTC
ETH
QUESTION
I have a case where I am dynamically populating a select
tag options every time an ajax call happens successfully.
I am using FancySelect.
My append code looks something like this:
...ANSWER
Answered 2017-Jun-27 at 09:31I can't really tell without inspecting the code more closely but, you could try:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install FancySelect
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page