使用ajax获取json数据

Somebody please advice on why $.Ajax that am trying to use fetching webApi data is not working but $.getJSON one is working.I would wish to use $.Ajax instead of $.getJSON.

Both codes are here below.

This one works

var uri = 'api/products';

       // Send an AJAX request
    $(document).ready(function () {
        // Send an AJAX request
        $.getJSON(uri)
            .done(function (data) {
                // On success, 'data' contains a list of products.
                $.each(data, function (key, item) {
                    // Add a list item for the product.
                    $('<li>', { text: formatItem(item) }).appendTo($('#products'));
                });
            });

...........................................

This does not work.

    var uri = 'api/products';
       // Send an AJAX request
    $(document).ready(function () {
        $.ajax({
            url: 'api/products',
            type: 'GET',
            datatype: 'json',
            cache: 'false',           
            success:function (data) {
                    // On success, 'data' contains a list of products.
                    $.each(data, function (key, item) {
                        // Add a list item for the product.
                        $('<li>', { text: formatItem(item) }).appendTo($('#products'));
                    });
        }
    });

 });