How do I remove an element class after success?

Posted by sharataka on Stack Overflow See other posts from Stack Overflow or by sharataka
Published on 2012-12-05T04:53:06Z Indexed on 2012/12/05 5:03 UTC
Read the original article Hit count: 129

Filed under:
|
|
|

When the user clicks on a button in the form associated with it's image, I'd like the image to disappear on success. I'm having trouble implementing this. Any advice?

    <script type="text/javascript">
   $(document).ready(function() {
       $(".removebutton").submit(function(event){

       event.preventDefault();
            $.ajax({
                 type:"POST",
                 url:"/munch_video/",
                 data: {
                        'video_id': $('.video_id', this).val(), // from form
                        'playlist': $('.playlist').val(), // from form
                        'add_remove': $('.add_remove').val(), // from form 
                        },
                 success: function(message){                         
                        alert(message);
                        $('.span8').removeClass('.video_id', this);

                    }
            });
            return false;
       });

    });
</script>

<div class = "span8" style = "width: 900px;">
<!-- wrapper div -->
    <div class='wrapper huluDotCom'>

    <!-- image -->
    <div class="image" style="position: relative; left: 0; top: 0;">

            <a href = "/partners/Business/huluDotCom">
                <img src = "/huluDotCom.png">
            </a>


        <!--  munchbutton div --> 
        <div class='munchbutton'>
            <form method='post' action = '/munch_video/ ' class = 'removebutton'><div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='dKrS8NzqPWFLM6u8wJrAeid4nGw1avGK' /></div>
                <input type="hidden" value="Channel" class = "playlist"/>
                <input type="hidden" value="huluDotCom" class = "video_id"/>
                <input type="hidden" value="remove_video" class = "add_remove"/>

                <input type='submit' class="btn btn-danger" value='Remove from plate'/>
            </form>
        </div>
        <!-- end munchbutton div -->


    </div>
    <!-- end image div -->

    </div>
    <!-- end wrapper div -->


    <!-- wrapper div -->
    <div class='wrapper TheEllenShow'>

    <!-- image -->
    <div class="image" style="position: relative; left: 0; top: 0;">

            <a href = "/partners/Business/TheEllenShow">
                <img src = "/TheEllenShow.png">
            </a>


        <!--  munchbutton div --> 
        <div class='munchbutton'>
            <form method='post' action = '/munch_video/ ' class = 'removebutton'><div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='dKrS8NzqPWFLM6u8wJrAeid4nGw1avGK' /></div>
                <input type="hidden" value="Channel" class = "playlist"/>
                <input type="hidden" value="TheEllenShow" class = "video_id"/>
                <input type="hidden" value="remove_video" class = "add_remove"/>

                <input type='submit' class="btn btn-danger" value='Remove from plate'/>
            </form>
        </div>
        <!-- end munchbutton div -->


    </div>
    <!-- end image div -->

    </div>
    <!-- end wrapper div -->

</div>

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery