bxslider-3
bxslider-3 copied to clipboard
Issue with form input IDs being duplicated
When a form input is within the slider it gets duplicated and inserted in a new slide at the start (presumably for the infinite loop). However even with the infinite loop set to false, this still happens.
The result is 2 ID's on the page that are needed to identify the input which makes it very difficult to target specific inputs.
This is compounded by having a <label for="id-of-input">Label</label>
attached to the element as when this is clicked it highlights the duplicated input, which is hidden from view and empty.
To resolve this, you could simply prepend a string such as bx-
to the ID when duplicating it.
If you have any solutions for me in the interim, please let me know.
Hi, I had the same problem and I found a solution that works for my setup. So it's hackish and probably limited. I just removed
// get the children behind
var $prependedChildren = getArraySample($children, 0, options.moveSlideQty, 'backward');
// add each prepended child to the back of the original element
$.each($prependedChildren, function(index) {
$parent.prepend($(this));
});
of the function setChildrenLayout. After you do this, however, the first slide on page load is the second, and the pager is wrong. So I added a call to the public function goToFirstSlide() after intialising the slider. Since I don't plan on using InfiniteLoop or multiple elements per slide, this works fine for me.
Narretz - thanks for posting that hack! I was just about to give up on bxslider before I found your comment - saved the day (even if it is a hack). Thanks again!
I want to thank Narretz too - fixed my issue, and the only thing I found that did. Now to find why it was happening...
Worked for me to. I added goToPreviousSlide() on slider init. This works in my case as the slider is a bit down on the page.