Owlcarousel2: Problem with dotData custom Pagination carousel navigation

[shofer4eto]

Hi, working with @version 2.0.0 and I am trying to create some custom dots navigation.
Basically a no-brainer but it doesn't work, nothing goes into my Dots elements.
Once the dotData param gets removed the regular dots appear and everything works like a charm... Has support for that param been discontinued or am I doing smth stupid? Thanks!

md5-84693b7c710ed4ca3227450660bb369b



$(".custom_slides").owlCarousel({
        items:1,
        dotData:true,
});

[joeyjoejoejr]

This doesn't appear to be implemented. We should either add it or remove it from docs

[adrianpuescu]

Just a hack:

In your html document, define a new container with a specific class (let's say <div class="dotsCont">) and add it as many children containers as your slides number is. Then, in the carousel settings, define the dotsContainer to point at your div class.

This way you'll be able to achieve a custom navigation without using the 'URLhashListener' option, still having whatever content you want on each "dot" and an 'active' class properly working on each of it.

Example:

HTML

<div class="dotsCont">
  <div>Fake Dot 1</div>
  <div>Fake Dot 2</div>
  <div>Fake Dot 3</div>
</div>
<div class="owl-carouse">
  <div>Slide 1 content</div>
  <div>Slide 2 content</div>
  <div>Slide 3 content</div>
</div>

JS

$(".owl-carousel").owlCarousel({
  dotsContainer: '.dotsCont'
});

[joergsteinhauer]

@adrianpuescu thanks a lot, that solved this problem for me. however it's a hack. hope it will be implemented at next release

[navrocky-sergey]

if you need counter:

.owl-dots {
counter-reset: counter;
}
.owl-dots > .owl-dot:before {
content: counter(counter);
counter-increment: counter;
}