Each Item of DatePicker should work independently. The problem is when I touch on DatePicker, the first item always moved by 3 rows including dragging on other items. Dragging on the first item has no issue.
I use DatePickerIOS from react-native, got the problem.
I use DatePicker from react-native-datepicker, still got the problem. I can't figure out why this happened.
This is my code for DatePicker. This is just default code without any modification though.
<DatePickerIOS
mode={this.props.mode}
date={this.props.date}
onDateChange={this.props.onDateChange}
minuteInterval={this.props.minuteInterval}
locale="th"
/>
Related
in a vuetify table i do not want to show some headers and their corresponding column. Instead, I want them to be displayed in a table in the extended-item slot. The items of the table are completely user editable. This all works fine too.
The problem is that in the extended-item slot not only the properties of the selected item are displayed, but the properties of all items.
In the vue-dev-tools it is displayed correctly. I think I'm missing something fundamentally simple here. Does anyone have any ideas?
Thanks in advance
Here is the link to the sandbox: v-data-table in expanded-item slot of v-data-table, user editable
You can do it changing :items="tabItems" by :items="[item]" (i put inside array because one item alone is not legible by :items v-data-table.
If you call tabItems you will iterate over all items again so its better to use filtered expanded-item item instead do hard work manually.
I tried in your sandbox, you can change line 54 with my suggestion and you could check that its working well.
How to make dropdown scroll to the last selected option after dropdown is re-opened?
Calling filtering_select_ref.dropdown.set('selected', selected_node_ref) or filtering_select_ref.set('scrollOnFocus', true) did not work for me on IE 11.
If you just need to scroll to the option, you could use win.scrollIntoView(node_ref) from "dojo/window" module as shown in the docs and pass the id or the node reference to the option as an argument.
You may also find these methods interesting to help solve your problem:
filtering_select_ref.openDropDown()
var dropdown = filtering_select_ref.dropdown;
dropdown.selectFirstNode()
dropdown.selectNextNode()
dropdown.selectPreviousNode()
dropdown.selectLastNode()
#Carlos Nantes suggested good options however I was aware of them and my problem with them was that I could not "catch" the moment when dropdown got opened.
I finally found a way to "catch" that moment with filtering_select_ref.watch('_opened', function()...
watch doc can be found here
I am trying to create an effect similar to this (the demo uses Bootstrap Carousel):
https://codepen.io/SitePoint/pen/BpVrXP/
Bootstrap's 'slide.bs.carousel' returns a relatedTarget that is the slide element going to be displayed as soon as the carousel is moved i.e changed to another slide.
I haven't been able to find an equivalent data being returned in OwlCarousel2's changed.owl.carousel event. What event, if any, returns the element that's going to be in view?
Is there any alternative way or am I missing something?
Try the event translated.owl.carousel, translated is fired after the animation
I have a single page web app. The keyboard pops-up everytime I click on the screen.
There are no text input boxes in the DOM at all.
How can I debug why the keyboard is popping up.
You can see examples of this strange behaviour at https://blight.ironhelmet.com and https://np.ironhelmet.com
update with a clue: A user is now reporting that rather than the keyboard, a dropdown selection spiner is popping up all the time, long after that dropdown has been removed from the DOM.
For React users:
I had the same thing happen in a React single-page app with React-Router. I didn't write code to remove elements from the DOM, but of course React does that for you.
On my site, there are React components that contain one to four input fields. After any such component appears, and then is hidden (unmounted / not rendered anymore), then any time the user taps a link, the keyboard pops up. This makes the site unusable. The only way to make it stop was to reload the page.
The workaround: calling document.activeElement.blur() in componentWillUnmount for the wrapper component around my <input> fields did the trick.
componentWillUnmount()
{
if (document && document.activeElement)
{
document.activeElement.blur();
}
}
Note that calling window.activeElement.blur() did not seem to do anything.
There's a thread in the Apple support forums about this issue:
https://discussions.apple.com/thread/7692319
Looks like the keyboard was holding a reference to input after I had removed them from the DOM.
I added a test when removing element to see if it was the current activeElement, then, if so, calling document.activeElement.blur() before removing it. Seems to have solved the problem so far.
I have a dataview list view working in another part of my application and is working fine. So I'm using the same principle in another view. I'm trying to display some labels in each row.
I've tried everything to try and get this to work, but to no avail. I've attached a screen-shot of the problem.
It appears the label is in fact in the DOM, but nothing displays. It also looks like if I select an item, the item selected class isn't added either. Is this a clue as to why it isn't working?
So if the item is in the DOM, why on earth is it not being displayed? In my example I have 2 rows in the DOM, which I inspected using the following selector:
Ext.DomQuery.select(".x-data-item");
Any help greatly appreciated?