Response From Php Script Disappears After Jquery Button Click Event

Here I posted one variable to PHP script. Response from php script I am writing to some div. But after button click, instantly the response disappears: When I do alert(arabic); it

Solution 1:

It looks like your button is trying to submit something, thus overlapping your callback function. You might want to use the parameter event to stop it's propagation.

Check this code:

$( "#submit" ).click(function(event) {

    event.stopPropagation();

    var cat = $("#cats option:selected").html();    
    //alert("test");    var arabic = document.getElementById("arabic").value;    
    //alert (arabic)    dataInsert(arabic);

    returnfalse;

    });    
}

You should alsoreturn false at the end of the callback function, in order to completely stop processing the event after your instructions. This is the key to perform your dataInsert() function without interruption.

Solution 2:

Are you using jQuery? looks like it with the $( "#submit" ).click(function() {}); why not make life easy and just use

$( "#submit" ).click(function() { 

   var arabic = $("#arabic").value(); 

    $.post("koove_insertpost_db.php",{"arabic" : arabic}, function( data ) { 
        $('#show').html(data);
    });
});

http://api.jquery.com/jquery.post/

you can also check the success status etc for data validation from the server.

I cant comment yet so i believe @feijones has the answer! ( especially return false; )

p.s. Alert works because it halts the execution of the JavaScript until you close the dialog, which then submits the form and reloads the page.