Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Feb 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Append and remove an element

    Not sure if I am in the right section for this. I am currently designing a web page using javascript, html and css. The page is a seat booking seat which allows the user to select and unselect seats. I have managed to get the page to display id of the seat when the user have selected a seat, but I am having problems trying to remove id from the display if user unselects the seat.

    Below is the javascript code
    Code:
    $('.available, .unavailable, .selected').click(function(){
            var ID = $(this).attr('class');
            if (ID == 'n unavailable' || ID == 'p unavailable') {
                alert ('Seat is already booked. Please select another seat.');
            }
            else if (ID == 'n selected' || ID == 'p selected') {
                alert ('You have now unselected this seat.');
                $(this).html('<img src = "free.gif"/>');
                $(this).removeClass('selected').addClass('available');
                y--;
                $("#seats").html("Number of seats selected: " + y);
                $("#list").remove($(this).attr('id'));
            }
            else {
                alert ('You have now reserved this seat. You can unselect it by clicking the seat again.');
                $(this).html('<img src = "selected.gif"/>');
                $(this).removeClass('available').addClass('selected');
                y++;
                $("#seats").html("Number of seats selected: " + y);
                $("#list").append($(this).attr('id') + "</br>");
            }
        });

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,485
    Thanks
    6
    Thanked 981 Times in 954 Posts
    Your jQuery is a little inefficient. Also, alerts should only be used for debugging, not for production code, since some browsers allow to permanently disable alerts. You should find another way, e. g. with modal overlays or something like that.

    As to your problem: we need to see your HTML, too, in order to give you the most appropriate solution.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •