¿Qué es contentType y dataType y data en jQuery ajax Post?

Question

Acabo de comenzar a Aprender Json y datos de enlace a Gridview usando Json, pero no puedo entender cuál es el contentType y dataType y data?

I utilizó el siguiente código ............

<script type="text/javascript"> 
$(document).ready(function() { 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     url: "Gridview.aspx/BindDatatable", 
     data: "{}", 
     dataType: "json", 
     success: function (data) { 
      for (var i = 0; i < data.d.length; i++) { 
       $("#gvDetails").append("<tr><td>" + data.d[i].OfficeName + "</td><td>" + data.d[i].City + "</td><td>" + data.d[i].Country + "</td></tr>"); 
      } 
     }, 
     error: function (result) { 
      alert("Error"); 
     } 
    }); 
}); 
</script> 

Answer 1

Los contenttype referres al tipo de contenido MIME que especifica el tipo de contenido se establece en el servidor. Esto podría identificar FORM-Encoded, XML, JSON y una plétora de otros tipos de contenido. Ayuda al servidor a determinar cómo manejar el contenido.

dataType ayuda a JQuery con respecto a cómo manejar los datos. si se especifica json, los datos devueltos se evaluarán como json y los datos pasados ​​al controlador de éxito serán un objeto en lugar de una cadena

La propiedad de datos se utiliza para los datos pasados ​​al servidor. Si pasa un Object literal JQuery lo pasará como parte del cuerpo de la solicitud (si el tipo es posterior) o como parte de la cadena de consulta (si el tipo es get)

Answer 2

si especificamos el tipo de datos como Json, entonces los datos devueltos se evaluarán como Json y los datos pasados ​​al controlador de éxito serán un objeto en lugar de una cadena. Veamos el ejemplo

$.ajax({ 
     type: "POST", 
     url: "ProductWebService.asmx/GetProductDetails", 

    data: "{'productId':'" + productId + "'}", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (response) { 
     var Product = response.d; 
     $("#spnProductId").html(Product.Id);strong text 
     $("#spnProductName").html(Product.Name); 
     $("#spnPrice").html(Product.Price); 
     $("#outputTable").show(); 
    }, 
    failure: function (msg) { 
     alert(msg); 
    } 
});