CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Can
Can

Reputation: 693

Show div on select dropdown option

I want to show a div when the user select a option out the dropdown. It works on localhost and with codepen but when I upload the code to the server of my domain it doesn't work..

I'm struggling with this problem and have no idea why this doesn't work.

The code is very long, thats why I didn't share it here.

HTML:

 <select>
                <option>choose a option</option>
                <option value="test1">test 1</option>
                <option value="test2">test 2</option>
            </select>

            <div class="test1 pricebox"><strong>test1 - test2</strong> <h1>€27,50</h1></div>
            <div class="test2 pricebox"><strong>test2 - test1</strong> <h1>€27,50</h1></div>

JS

$(document).ready(function(){
        $("select").change(function(){
        $(this).find("option:selected").each(function(){
        if($(this).attr("value")=="test1"){
            $(".pricebox").not(".test1").hide();
            $(".test1").show();
        }
        else if($(this).attr("value")=="test2"){
            $(".pricebox").not(".test2").hide();
            $(".test2").show();
        }
        else{
            $(".pricebox").hide();
        }
        });
    }).change();
    });

The codepen (it works) http://codepen.io/anon/pen/aOGvJq

Upvotes: 2

Views: 1534

Answers (1)

Shehroz Ahmed
Shehroz Ahmed

Reputation: 537

The reason is : you're not including the jQuery script on your website I guess. Add this code in the tag of your page.

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

However check this live page I hosted this on server to show you demo.

http://shehroz.pixub.com/stack.html

Upvotes: 2

Related Questions