azarmfa
azarmfa

Reputation: 47

jquery for hide repeating clicking image values

I am doing a project in bus seat selection.I am in middle of the project. Now i showing the bus seating arrangement to the customer.When the user click the unselected seat it shows the seat in colored(ie., selected) and also show the selected seat values to the user.This works fine. when the user deselect the selected seat,the seat deselect and come back to previous stage but the values not removing of that selected seat. Please have a look at the code.

<?php
echo "<table>";
for($i=0;$i<5;$i++)
 {
echo "<tr>";
for($j=0;$j<12;$j++)
{
    echo "<td>";
    $k=$i.$j;
?>
    <img src="Seat.jpg" id="<?php echo $k; ?>" class="off">
   <?php
    echo "</td>";
}
echo "</tr>";
}
echo "</table>";

?>
 <div class="seatno"></div>
 <script type="text/javascript">
 $(document).ready(function(){             
  $("img").click(function(){
 var imageid = $(this).attr("id");
   if(imageid)
 {
     if ($(this).hasClass('off')) 
     {
   $(this).attr("src","Seat-availed.jpg").addClass('on').removeClass('off');
   $(".seatno").append(imageid+",");
}
else
{
     $(this).attr("src","Seat.jpg").removeClass('on').addClass('off');
  // $(".seatno").css("color","red");
  var editid;
  var rmv = $(".seatno").html();
  var editid =  $(this).attr("id");
  var finder = rmv.find(editid);

   alert(finder);   
   }
}
   });
   });
  </script>

please find the solution This code is just like the redbus.in

Upvotes: 1

Views: 232

Answers (2)

miro
miro

Reputation: 780

you have <div class="seatno">12,34,23,45,</div> ? and you want to remove number 23?

var rmv = $(".seatno").html();
var id2rmv = 23;

rmv = rmv.split(id2rmv + ',').join('');

alert(rmv);

Upvotes: 1

mkostelac
mkostelac

Reputation: 301

Replace

var rmv = $(".seatno").html();

with

var rmv = $(".seatno").html("");

while $(cssSelector).html() just gets value, $(cssSelector).html(value) sets it, even if it is empty string - "".

Upvotes: 0

Related Questions