MVC formas de hacer un llamado para la ejecución de una operación asíncrona
Este post es para indicar la forma de hacer llamados a operaciones asincronas en MVC por medio de JavaScript o JQUERY y de esta forma darle dinamismo a tus aplicaciones.
1. Funciona solo en navegadores Microsoft de nueva generación y garantiza el funcionamiento entre sitios o Cross Site.
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)){
// Use Microsoft XDR
var params = "";
var xdr = new XMLHttpRequest();
var data = "?nombre=" + nombreDespacho + "&tipo=" + tipoDespacho + "&ubicacion=" + ubicacionDespacho + "&direccion=" + direccionDespacho + "&telefono=" + telefonoDespacho;
var url;
var pathArray = window.location.pathname.split('/');
if (pathArray[1].toLowerCase() == "procesos") {
url = "/procesos/AddDespachoUsingAttributes" + data;
} else {
url = "/" + pathArray[1] + "/procesos/AddDespachoUsingAttributes" + data;
}
xdr.open("GET", url, true);
xdr.setRequestHeader("Access-Control-Allow-Origin", "*");
xdr.onload = function () {
var JSON = $.parseJSON(xdr.responseText);
CrearDespacho(JSON);
};
xdr.onreadystatechange = function () {
if (xdr.readyState == 4 && xdr.status == 200) {
//obj.innerHTML = XMLHttpRequestObject.responseText;
}
}
xdr.send(null);
}
Es muy importante, la determinación del URL, si el sitio se ejecuta desde fuentes, en el URL no está el nombre del sitio, mientras que se si se ejecuta desde un despliegue, si hay nombre de sitio.
2.Usando la función de JQuery $.Ajax, que tiene los beneficios de usarla, pudiendo hacer uso de más parámetros como la configuración del manejo de caché, si es requerido:
var url;
var pathArray = window.location.pathname.split('/');
if (pathArray[1].toLowerCase() == "procesos") {
url = "/procesos/AddDespachoUsingAttributes";
} else {
url = "/" + pathArray[1] + "/procesos/AddDespachoUsingAttributes";
}
$.ajax({
url: url,
data: { nombre: nombreDespacho, tipo: tipoDespacho, ubicacion: ubicacionDespacho, direccion: direccionDespacho, telefono: telefonoDespacho },
type: "GET",
dataType: "json",
success: function (despachosData) {
CrearDespacho(despachosData);
},
cache: false
});
3. Usando la función de JQuery $.getJSON:
var url;
var pathArray = window.location.pathname.split('/');
if (pathArray[1].toLowerCase() == "procesos") {
url = "/procesos/AddDespachoUsingAttributes";
} else {
url = "/" + pathArray[1] + "/procesos/AddDespachoUsingAttributes";
}
$.getJSON(url, { nombre: nombreDespacho, tipo: tipoDespacho, ubicacion: ubicacionDespacho, direccion: direccionDespacho, telefono: telefonoDespacho },
function (despachosData) {
var select = $("#ddlDespacho");
select.children('option:not(:first)').remove();
$.each(despachosData, function (index, itemData) {
var isItemSelected = seleccionarOpcionDespacho(itemData.Value);
select.append($('<option/>', {
value: itemData.Value,
text: itemData.Text,
selected: isItemSelected
}));
});
});
Comentarios