CODEWITHSUNDEEP
jqueryajax
Don'tDownvoteMe
Don'tDownvoteMe

Reputation: 501

fadeOut works only once

I have an insert statement applied using AJAX, when I apply fadeOut function to that the success message disappears but when I try inserting another value, the success message doesn't appear anymore although value is inserted in the database.

Ajax Code:

$(document).ready(function(){

    $("#insert").click(function(event){
        event.preventDefault();
        $.ajax({
               url:"insert_back.php",
               method:"post",
               data:$('form').serialize(),
               dataType:"html",
               success:function(msgStr){
                   $("#Imsg").html(msgStr).fadeOut(3000);
                   }

              })
        })  
})

Upvotes: 2

Views: 102

Answers (2)

Ghassan Elias
Ghassan Elias

Reputation: 2233

Before submitting the form add $("#Imsg").html('').fadeIn(0);

$(document).ready(function(){
    $("#insert").click(function(event){
        event.preventDefault();
        $.ajax({
            url:"insert_back.php",
            method:"post",
            data:$('form').serialize(),
            dataType:"html",
            beforeSend: function() {
                $("#Imsg").html('').fadeIn(0);
            },
            success:function(msgStr){
                $("#Imsg").html(msgStr).fadeOut(3000);
            }

        })
    })  
})

Upvotes: 2

PraveenKumar
PraveenKumar

Reputation: 1861

In success function Change $("#Imsg").html(msgStr).fadeOut(3000); this to $("#Imsg").show().html(msgStr).fadeOut(3000);

Upvotes: 2

Related Questions