Is there anyway i can change this code to a ajax format?

$(document).ready(function(){
           $("td[contenteditable=true]").blur(function(){
               var msg = $(".alert");
               var newvalue = $(this).text();
               var field = $(this).attr("id");
               $.post("update.php",field+"="+newvalue,function(d){
                   var data = jQuery.parseJSON(d);
                   msg.removeClass("hide");
                    if(data.status == 200){
                        msg.addClass("alert-success").removeClass("alert-danger");
                    }else{
                        msg.addClass("alert-danger").removeClass("alert-success");
                    }
                   msg.text(data.response);
                   setTimeout(function(){msg.addClass("hide");},1000);//It will add hide class after 3 seconds

               });
           });
});

Recommended Answers

All 6 Replies

That already is ajax. Can you be more specific?

sorry about that i mean like this format

$.ajax({
    type: type,
    url: url,
    data: data,
    success: function(output){
        console.log(jQuery.parseJSON(output));
    }
})

but somehow that format is not working

In what way is it not working?

I doesnt reply back the same as the $.post is there any other way around that?
and how should i do it?

What does it return then?

Is it working or Erroring?

I think what you want is

$(document).ready(function(){
    $("td[contenteditable=true]").blur(function(){
        var msg = $(".alert");
        var url = "update.php",;
        $.ajax({
            url: url,
            type : 'post',
            data: $( this ).serializeArray(),//this will parse in the {id: $(this).attr("id"),value: $(this).text()}
            beforeSend: function(output){
                msg.removeClass("hide");
            },
            success: function(output){
                msg.addClass("alert-success").removeClass("alert-danger");
            },
            error: function(output){
                msg.addClass("alert-danger").removeClass("alert-success");
            },
            complete: function(response){
                msg.text(response);
                setTimeout(function(){msg.addClass("hide");},1000);//It will add hide class after 3 seconds
            }
        })
    });
});

But actually it is mostly same as what you have done now. For extra features, please refer complete api at http://api.jquery.com/jquery.ajax/

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.