I am using Barba for page transitions but it is causing issues on forms which contain radio or checkbox inputs. For some reason it prevents those inputs from being checked. If I remove data-barba="container"
then the inputs work again.
I looked over the docs but didn’t see anything that seemed to explain this issue. The closest thing I found was the prevent strategy, but it doesn’t seem applicable.
barba.init({
timeout: 5000,
debug: false,
views: [{
namespace: 'home',
beforeEnter(data) {},
afterEnter(data) {
console.log('ran home page');
},
beforeLeave(data) { }
}]
});
<body data-barba="wrapper">
<main data-barba="container" data-barba-namespace="home">
<form>
<input type="radio" name="lorem" id="choice_1">
<label for="choice_1" id="label_1">Lorem</label>
<input type="radio" name="lorem" id="choice_2">
<label for="choice_2" id="label_2">Lorem</label>
<input type="radio" name="lorem" id="choice_3">
<label for="choice_3" id="label_3">Lorem</label>
</form>
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@barba/core"></script>
</body>