I have a jquery ui autocomplete acting upon a text input. When the "select" event fires, I need to use the text input to locate a nearby hidden input and fill it.
The problem is that the event's target differs between when you press enter and when you click on the autocomplete. When pressing enter, the event's target is the input. However, when you click the event's target is the link in the autocomplete. As the link in the autocomplete is not DOM-wise related to the input, I can't find it to fill my hidden input.
What is the correct way to find the original input that the autocomplete was called upon, within the select event?
Related
select2 or chosen or bootstrap-multiselect
I am looking for a way to show the options in a multi select, just like plain simple "multiple" option does to the regular select control.
It saves a click! it saves a click (the need to open the dropdown to see the options), when you have to select multiple options. I am not able to find anywhere any documentation regarding that.
Could it be that you are asking not about "list as it is in HTML" (note: there are no one unified solution - see multiselect on mobile devices, they are not the same as on desktop) but about list that is in popup which is opened by click ant that is NOT CLOSED till you could finish all your selections? One click is requried, but not "click to open, click to select, click to open, click to select ..."?
Chosen can't do this (chosen closes popup after selection).
bootstrap-multiselect can, but its list is not very friendly: 1) it can change its location (jump up and down) under the mouse, and 2) is usually "too wide" - checkboxes are too far from text (text aligned left, checkbox aligned right).
You can try my component: https://github.com/DashboardCode/BsMultiSelect
Here dropdown menu is not closed till you had finished all your selections, and it can't look "too wide" if you have "wider" length of your input control.
The docs doesn't mention this, but does anyone know if it's possible to only show the DatePicker on icon click (or button), and not when the input field receives focus?
Users will primarily enter dates using the keyboard and doesn't want the DatePicker displayed, unless specifically asked for.
You can have a look here for the complete API which has some options that are not documented on the AntDesign site. But there is no option to achieve what you are looking for.
You need the combination of a text input with a button to popup the picker, which is a different paradigm from the one <DatePicker> uses. It could be "hacked" by combining a normal <Input>, <DatePicker> with custom CSS that only shows the button, and some Javascript event handlers.
I'm using jqueryUI for a datepicker to pick birthdays. Turns out in IE if the person tries to type in the box instead of using the picker, and hits the backspace, they get kicked off the form and to a previous page. Can anyone explain or propose a fix? Also not sure why the red asterisk is showing up inside the box when it shows outside in firefox and when all the others display correctly.
Looking at the eighth field:
http://www.craftonhills.edu/Degrees_and_Certs/Divs_and_Depts/Career_Education_and_Human_Development/Public_Safety_and_Services/Fire_Technology/Firefighter_Academy/Firefighter_Academy_Info/Application
Backspace key in the browser defaults to triggering the Back button. You can try to intercept the keystroke (See here: Intercepting all key presses with jQuery before they are processed) to stop it from firing, but a better solution might be to add a "Clear" button to the jQuery UI Element to remove the field so the back button still works as intended.
Try the following:
$(document)
.on('keypress keydown keyup', '.datepicker', function(e) {
if ( e.keyCode == 8 ) e.stopPropagation();
});
Replace .datepicker with whatever selector you are using.
This should allow the backspace to work as expected in the text block but still prevent the backspace (from bubbling up the DOM) from triggering the browser back action.
I have a <div> with some text and I would like the user to be able to natively select the text. The issue is that when I attach any mouse event handler to the element or it's parent (besides document element) the selection won't work any longer.
This could be observe on the site linked below. If you sink mouse events the selection won't work for the first line.
http://rafalrybacki.com/lab/selection_ios/
What happens after clicking "sink mouse events" is:
main.sinkEvents(Event.MOUSEEVENTS);
Checked with iOS5.
I would like make the text selecting work (keeping the mouse events). How to do this?
I want to have an input field in my page and a button so that the user can manually enter the tweet text and then when he its the submit button, the actual twitter status submit will open with the text the user entered.
moreover, I also want to get a callback when a user submit the tweet on twitter like Web Intents Javascript Events
as far as I know there are 2 ways to do that:
re-render the tweet button after every change of the input using twttr.widgets.load();, something like this example, only instead of the update button use the onchange event of the input. the problem is when the tweet button is re-rendered its disappears for a moment.
the next option is not to use the twitter button, instead when the user hits submit open a new window and redirect to https://twitter.com/share with the tweet text as the query param (like twitter suggest in Build Your Own Tweet Button). the problem with this solution is that I dont get an event when the user submit the tweet on twitter.
Any ideas how I can combine both requirements, dynamically change the tweet text & getting an event on tweet submit?
Not sure if this would work, but my first thought is to use the tweet button, and add an invisible div over it which will capture the user's click, reload the widget with the user's text, and trigger a click on the widget 250ms later (or however long it might take it to reload on a slow device). You'll only get one flicker, so it wouldn't look smooth, but it wouldn't look like a bug either.