通过Ajax成功附加HTML

Question

I would like to know how I can append information through my Ajax on its success. This is what I have:

HTML/PHP BUTTON:

<input class="canjear btn" type="button" value="<?php echo JText::_('COM_CUPHONEO_BOTON_CANJEAR'); ?>" data-id="<?php echo $valor->item_id; ?>" />

JAVASCRIPT CODE:

<script>
jQuery(function(){
    jQuery(".canjear").click(function(e){
        if(this.tagName==="A"){
            e.preventDefault();
        }

//$(this).data("key") will return the value at the named data which is set by HTML5 data-* attribute
        jQuery.ajax({
            url: "index.php?option=com_cuphoneo&task=miscuponess.canjearCupon",
            type: "POST",
            data: {id:jQuery(this).data("id")},
            success: window.location.href = "index.php?option=com_cuphoneo&view=miscuponess&layout=default"
        })
        .done(function(data){
            alert(data);
            }
        });
    });
});
</script>

PHP FUNCTION CALLED:

This is a big function but summarizing, it a query which returns data and besides other validations are made.

If you need more information please let me know

The information im trying to append is what I get in the PHP Function which is called in the Ajax.

Thanks.

Answer 1

@MONZTAA

You are trying to use both the function which is alternate to each other.

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are deprecated as of jQuery 1.8. To prepare your code for their eventual removal, use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

In turn you should use only this :

$.ajax({

url: "index.php?option=com_cuphoneo&task=miscuponess.canjearCupon",
type: "POST",
data: {id:jQuery(this).data("id")}
})
.done(function( msg ) {
   alert( "Data Saved: " + msg );
});