CODEWITHSUNDEEP
javascripthtmlcss
user3491583
user3491583

Reputation: 27

Changing visibility of an element on click

<table id="selectsupp">
  <tr>
    <td>
      <select id="category">
        <option value="display" readonly="true">-Shop By Category-</option>
        <option value="all">All</option>
        <option value="preworkout">Pre Workout</option>
        <option value="protein">Protein</option>
        <option value="mass">Mass Gainer</option>
        <option value="bcaa">BCAA</option>
      </select>
    </td>
  </tr>
  <tr>
    <td>
      <select id="company">
        <option value="display" readonly="true">-Shop By Company-</option>
        <option value="all">All</option>
        <option value="on">Optimum Nutrition</option>
        <option value="mts">MTS</option>
        <option value="mutant">Mutant Nutrition</option>
        <option value="allmax">All Max</option>
      </select>
    </td>
    <td>
      <input type="submit" id="submit" name="search" value="Search" onclick="find()"/>
    </td>
  </tr>
</table>

<script>
  function find(){
    var category = document.getElementById('category');
    var valueOfCategory = category.options[category.selectedIndex].value;
    var company = document.getElementById('company');
    var valueOfCompany = company.options[company.selectedIndex].value;

    if (valueOfCategory === "all" && valueOfCompany === "all") {
      alert "hello";
      document.getElementsByTagName("select")[0].style.visibility = "hidden";
      document.getElementsByTagName("select")[1].style.visibility = "hidden";
      //display all suggested items
   }

Hello fellow coders :) I am having some trouble with setting the visibility of a tag. When I submit i am trying to get rid of the 2 select options and the button also but for some reason It setting .style.visibility = "hidden" is not working. Any suggestions?

Upvotes: 0

Views: 64

Answers (2)

Mritunjay
Mritunjay

Reputation: 25882

Two problems are there 

alert "hello";

should be 

alert("hello");

And there is } missing at the end of function. And I don't see closing of script tag also.

Upvotes: 3

Marc B
Marc B

Reputation: 360572

Well, if you'd bothered checking your browser's debug console, you'd have seen your syntax errors getting logged there:

alert "hello";

should be

alert("hello");

The debug console should be your FIRST stop anytime something on a web page isn't working.

Upvotes: 0

Related Questions