Show and hide table using JQuery

Question

I have this function to show or hide table

function show_ticket_type(){
if ($("#TicketType").val("select-type")){
       $("#tow_way").hide()
       $("#one_way").hide()
}
else if ($("#TicketType").val("one-way")){
       $("#tow_way").hide()
       $("#one_way").show()     
}
else{
       $("#tow_way").show()
       $("#one_way").hide()     
}

}

and the table is

<table width="100%" border="0" id="tow_way">
  <tr>
    <th width="120"> <div align="center"><strong>Airlines</strong></div></th>
    <th width="100"> <div align="center"><strong>Type</strong></div></th>    
    <th width="100"> <div align="center"><strong>From</strong></div></th>
    <th width="100"> <div align="center"><strong>To</strong></div></th>    
    <th width="80"> <div align="center"><strong>Departure</strong></div></th>
    <th width="100"> <div align="center"><strong>Returning</strong></div></th>    
  </tr>
</tbale>
<table width="100%" border="0" id="one_way">
  <tr>
    <th width="120"> <div align="center"><strong>Airlines</strong></div></th>
    <th width="100"> <div align="center"><strong>Type</strong></div></th>    
    <th width="100"> <div align="center"><strong>From</strong></div></th>
    <th width="100"> <div align="center"><strong>To</strong></div></th>    
    <th width="80"> <div align="center"><strong>Departure</strong></div></th>
  </tr>
</tbale>

this is select type when choose value we must call function to hide or show table

<select id="TicketType" name="TicketType" onChange="show_ticket_type()">
    <option value="select-type">-- Select --</option>
    <option value="one-way">One Way</option>
    <option value="tow-way">Return</option>
</select>

If I select One Way we must hide table tow_way and show table one_way and when select Tow way we must we must hide table one_way and show table tow_way else we must hide tow table

Where is the error in my code?

Answer 1

$('#TicketType').change(function(){
    $("#two_way").toggle(this.value == "two-way")
    $("#one_way").toggle(this.value == "one-way")
});

• Fixed the type- tow => two , because tow way sounds too creepy... :)

Answer 2

What are you thinking you are doing here?

$("#TicketType").val("select-type")

You are trying to set the value instead of reading the value.

You should do if($("#TicketType").val() === "select-type")

Also, you should mind your spelling :)