RobertD RobertD - 2 months ago 15
HTML Question

Ajax function replace messages

I want to replace the default window for messages in ajax with a div, for example I want to replace this code:

alert(data.status + ": " + data.message);
with a div.

This is my ajax code:

//Start ajax code
if(!url){
url = jQuery('#product_addtocart_form').attr('action');
}
url = url.replace("checkout/cart","ajax/index");
var data = jQuery('#product_addtocart_form').serialize();
data += '&isAjax=1';
jQuery('#ajax_loader').show();
try {
jQuery.ajax({
url: url,
dataType: 'json',
type : 'post',
data: data,
success: function(data){
jQuery('.messages').remove();
jQuery('#ajax_loader').hide();
//alert(data.status + ": " + data.message);



if(jQuery('.header .links')){
jQuery('.header .links').replaceWith(data.toplink);
}

if(jQuery('.mini-cart')){
jQuery('.mini-cart').replaceWith(data.sidebar);
var status = data.status;

showMessage(status.toLowerCase(), data.message);
}

// Create below function in your jquery
function showMessage(txt, type) {
var html = '<div id="messages_product_view"><ul class="messages"><ul class="messages"><li class="'+type+'-msg"><ul><li>' + txt + '</li></ul></li></ul></div>';
jQuery('.messages').update(html);
}



}
});
} catch (e) {
}
//End ajax code


In this code now I have this error:

TypeError: jQuery(...).update is not a function
jQuery('.messages').update(html);

Answer

to set text/html to an element you can use like this...

var html = '<div id="messages_product_view"><ul class="messages"><ul class="messages"><li class="'+type+'-msg"><ul><li>' + txt + '</li></ul></li></ul></div>';
jQuery('.messages').html(html);

use .html() function instead of .update()