bxslider-3 icon indicating copy to clipboard operation
bxslider-3 copied to clipboard

Issue with form input IDs being duplicated

Open craigmdennis opened this issue 12 years ago • 4 comments

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.

craigmdennis avatar Oct 07 '11 16:10 craigmdennis

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 avatar Oct 26 '11 12:10 Narretz

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!

dsuriano avatar Nov 21 '11 22:11 dsuriano

I want to thank Narretz too - fixed my issue, and the only thing I found that did. Now to find why it was happening...

johnbacon avatar Jul 13 '12 22:07 johnbacon

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.

mblarsen avatar Jul 16 '12 10:07 mblarsen