[Resolved] javascript within a view

[Author]

Posts

[jenW]

I have a view that filters results ....

I am trying to drop this little hide a div code in. which uses javascript. it works fine except after i filter something the javascript stops working ...

I am putting the javascript in the JS editor box in the Search and Pagination area.

html:

<div class="panel panel-default col-sm-6" style="text-align:center;">
<div class="panel-heading">Toggel Data</div>
<div class = "panel-body">
<h2 id="hide4">welcome to all</h2>
<button type="button" class="btn btn-primary" id="btn3">Click To Toggle</button>
</div>
</div>

js:

$("#btn3").click(function(){
$("#hide4").toggle('slow');
});

[Jamal]

Hello and thank you for contacting the Toolset support.

This most probably because you are using AJAX in the view. Once the search pagination completes, Toolset updates the filters with new ones, which means that the old code will not get executed for the button that was added again after the search or pagination.
https://toolset.com/documentation/programmer-reference/adding-custom-javascript-code-to-views-that-use-ajax/

Try this instead:

jQuery( document ).on( 'ready js_event_wpv_pagination_completed js_event_wpv_parametric_search_form_updated', function( event, data ) {
	$("#btn3").click(function(){
                $("#hide4").toggle('slow');
        });
});

I hope this helps. Let me know if you have any questions.