Javascript and Wordpress: JS not loaded

Question

I am working on this Wordpress website and i am a using a bit of JS to animate the table.

What i need is to "filter" the Table rows when a checkbox on top is selected. For example when Zimmer -> 4.5 is selected, only the rows with class .zimmer4 are displayed. I am using now this script but does not works:

JS:

$(document.body).on('change', "#zimmer5", function() { 
    $("#tableID tr.zimmer5").toggle(!this.checked); 
});    

$(document.body).on('change', "#zimmer4", function() { 
    $("#tableID tr.zimmer4").toggle(!this.checked); 
});

$(document.body).on('change', "#zimmer3", function() { 
    $("#tableID tr.zimmer3").toggle(!this.checked); 
});

$(document.body).on('change', "#zimmer2", function() { 
    $("#tableID tr.zimmer2").toggle(!this.checked); 
});

This is the HTML code i am using for the buttons

HTML

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<span class="dropdown">
        <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Zimmer
        <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<form class="filter">
<input id="zimmer4" class="unchecked" type="checkbox">4.5
<br>
<input id="zimmer3" class="unchecked" type="checkbox">3.5
<br>
<input id="zimmer2" class="unchecked" type="checkbox">2.5
<br>
</form>
</ul>
</span>

How did you integrate this script into your website? Are the functions already available? Do you get any errors? Is this inside an onready block? — Icepickle
– Icepickle, Commented May 30, 2016 at 13:39
thats jquery you are using, not vanilla javascript, have you loaded jquery? — Craicerjack
– Craicerjack, Commented May 30, 2016 at 13:39
I am using a plugin in. srd.wordpress.org/plugins/css-javascript-toolbox i used the exactly the same plugin in on another website and it works: birsmatt.ch/wohnungen — N_A
– N_A, Commented May 30, 2016 at 13:41
Fix what? You stated your objective but haven't explained what the problem is. "does not work" is not a proper problem statement. Please include relevant html in the question — charlietfl
– charlietfl, Commented May 30, 2016 at 13:41
I see the following JS error: "Error: TypeError: $ is not a function Source File: weierweg-liestal.ch/wohnen Line: 1640" That should put you down the right path. — mferly
– mferly, Commented May 30, 2016 at 13:48

Martin Hugo · Accepted Answer · 2016-05-30 13:39:30Z

1

replace your $ sign with jQuery

answered May 30, 2016 at 13:39

Martin Hugo

1841 gold badge1 silver badge10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

N_A Over a year ago

So easy. THANK YOU!

Collectives™ on Stack Overflow

Javascript and Wordpress: JS not loaded

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related