How do I order this with html and css? - javascript

After having connected an api, I need to sort the data that it gives me.
I have configured the columns but it only responds to one and orders each card one below the other.
How do I get them to be side by side within the columns I want?
I also want to modify that where it says buy and next the price is one below the other.
I leave the html code and the api connection.
index:
<div class="container body-content">
<div class="container">
<div class="row">
<div class="col-md-8">
<div id="price"></div>
<hr>
<h1><b>*</b> (1) Aclaración importante sobre 'Dolar Bolsa':
La compra y venta de "Dolar Bolsa" o "Dolar MEP"
corresponde a operaciones con títulos valores, no
implicando en ningún momento el acceso al mercado de
cambios en el marco de las regulaciones establecidas por
el Banco Central de la República Argentina.</h1>
<br />
</div>
</div>
</div>
</div>
api:
function fetchData() {
fetch("https://www.dolarsi.com/api/api.php?type=valoresprincipales")
.then(response => {
return response.json();
})
.then(data => {
const filteredOutput = data.filter(item => {
switch (item.casa.nombre) {
case "Dolar Blue":
case "Dolar Oficial":
case "Dolar Bolsa":
case "Dolar Contado con Liqui":
case "Dolar turista":
case "Bitcoin":
return item;
break;
default:
return null;
}
})
let html = "";
filteredOutput.forEach(item => {
html += "<div class=\"col-12 col-lg-6\">";
html += "<div class=\"card bg-c-blue order-card\">";
html += "<div class=\"card-block\">";
html += "<div class=\"user\">";
html += "<h6 class= \"nombre\">" + item.casa.nombre + "</h6>";
html += "<div class=\"row\">";
html += "<div class=\"col-6 text-center\">";
html += "<p class= \"compra\"> COMPRA " +item.casa.compra + "</p>";
html += "</div>";
html += "<div class=\"col-6 text-center\">";
html += "<p class= \"venta\"> <small>VENTA</small><span</span> $ " + item.casa.venta + "</p>";
html += "</div>";
html += "</div>";
html += "</div>";
html += "</div>";
html += "</div>";
html += "</div>";
})
document
.querySelector('#price')
.insertAdjacentHTML("afterbegin", html);
});
}
fetchData();

Related

How to show retrieved data from firebase in html

How to show the data retrieved from firebase in a container.
this is my code
var dbBlogs = fiebase.database.ref("users").child("blogs").orderByChild("time");
dbBlogs.on("value", function(blogs){
if (blogs.exists())
{
var container = "";
blogs.forEach(function(singleBlog){
var mDesc = singleBlog.val().desc;
var mTime = singleBlog.val().time;
var mDate= singleBlog.val().date;
container += "<div class='jumbotron bg-light text-dark border border-dark'>";
container += "<div class='row'>";
container += "<div class='col-sm-5'> <p style='color:grey;>"
+"Desc: " + mDesc;
+"Date" + mTime;
+"time" + mDate;
+ "</p> </div>";
container += "/div>";
container += "/div>";
});
$("blogs").html(container);
}
});
this is my database
enter image description here
Please can anyone help me, I am new

Datatable ajax add row on condition

So I'm having some trouble setting up datatable using Ajax.
Some context:
I have a Ajax that request certain files information.
The response contains two sets
The files information
The users information (to figure out the user of the files).
I've completed the entire logic without Datatable but now i want to implement it using datatable.
I have 2 condition
Is the end date between today and 4 days from now?
is the end date after 4 days form now?
These condition are used to indicate to the user witch files (project) needs the most attention.
CODE TIME (I'm using the Django framework btw) :D
The AJAX CALL
function ajax_dates() {
$.ajax({
url: "{% url 'get_files_dates' %}",
type: "GET"
}).done(function (object) {
date_calculation(object.dates, object.users);
});
}
THE TWO CONDITION
// CONDITION ONE (ATTEMPT using Datatable)
// Projecten met een waarschuwing
if (enddate.isBetween(today, today.clone().add(4, 'd'))) {
// TABLE ROW VOOR ELK TYPE
running_waring = "";
running_waring += '<tr>';
running_waring += '<td>'+ checker.first_name + " " + checker.last_name+'</td>';
running_waring += '<td>'+ checker.first_name + " " + checker.last_name+'</td>';
running_waring += '<td id="testing">'+result.name+'</td>';
running_waring += '<td>'+result.word_count+'</td>';
running_waring += '<td>'+enddate.format("D MMM YYYY").replace(".","")+'</td>';
running_waring += '<td>'+enddate.format("HH:mm:ss")+'</td>';
running_waring += '<td>Verloopt binnenkort </td>';
running_waring += '<td> Verloopt' + upper_first(today.clone().subtract(0,"d").to(enddate))+'</td>';
running_waring += '</tr>';
$("#lopend_project").html(running_waring);
}
// CONDITION TWO (no datatable)
// Lopende projecten
if (enddate > (today.clone().add(4, 'd'))) {
active_html += "Eigennaar: " + owner.first_name + " " + owner.last_name + "<br>";
if (typeof(checker) === 'undefined') {
active_html += "Checker: None <br>";
} else {
active_html += "Checker: " + checker.first_name + " " + checker.last_name + "<br>";
}
active_html += "Bestand: " + result.name + "<br>" +
"Nog lopend tot: <strong>" + enddate.format("D/M/YYYY HH:mm") + "</strong><br>";
active_html += '<a href=' + "../project/" + result.id + ' >details</a><br><br>';
$("#active_project").html(active_html);
}
});
Condition one seems to work however I'm unable to use filter (it empties the datatable).
I've read on their documentation page that i should use
data and column[] but I dont know how to implement this using my condition.
The full code on this can be found in here :[https://pastebin.com/1qmu9Vva][1]
DATATABLE
$('#project_table').DataTable({
lengthChange: false,
responsive: true,
// scrollY: '50vh',
sScrollY: "100%",
scrollCollapse: true,
paging: false,
stateSave: true,
colReorder: true,
rowGroup: {
startRender: function (rows, group) {
return group + ' (' + rows.count() + ')';
},
dataSrc: 6
},
// taal zorg voor een variabele om de taal in te stellen
"language": {
"lengthMenu": "Toon _MENU_ records per pagina",
"search": "",
"zeroRecords": "Er werd helaas niks gevonden dat voldoet aan uw zoekcriteria",
"emptyTable": "Deze tabel is helaas leeg",
"info": " _TOTAL_ records gevonden",
"infoEmpty": "Niks Gevonden",
"infoFiltered": "(gefilter van _MAX_ record(s))",
"paginate": {
"first": "Eerste",
"last": "Laatste",
"next": "Volgende",
"previous": "Vorige"
}
},
"columnDefs": [
{"width": "10%", "targets": 3}
]
});
I'm Dutch(Belgium) so I apologize in advance for spelling mistakes.
I'll like to thank the awesome folks from stackoverflow in advance.
(seriously you guys are the unseen heroes :D)

Get DOM tree with javascript

Good afternoon, I am developing a small script that analyzes the DOM of an HTML page and write on screen the tree of nodes.
It is a simple function that is called recursively for get all nodes and their children. The information for each node is stored in an array (custom object).
I have gotten get all the nodes in the DOM, but not how to paint in a tree through nested lists.
JSFIDLE
https://jsfiddle.net/06krpdyh/
HTML
<html>
<head>
<title>Formulario para validar</title>
<script type="text/javascript" src="actividad_1.js">Texto script</script>
</head>
<body>
<p>Primer texto que se visualiza en la Pagina</p>
<div>Esto es un div</div>
<div>Otro div que me encuentro</div>
<p>Hay muchos parrafos</p>
<ul>
<li>Lista 1</li>
<li>Lista 2</li>
<li>Lista 3</li>
</ul>
<button type="button" id="muestra_abol">Muestra Arbol DOM</button>
</body>
</html>
JS
// Ejecuta el script una vez se ha cargado toda la página, para evitar que el BODY sea NULL.
window.onload = function(){
// Evento de teclado al hacer click sobre el boton que muestra el arbol.
document.getElementById("muestra_abol").addEventListener("click", function(){
muestraArbol();
});
// Declara el array que contendrá los objetos con la información de los nodos.
var nodeTree = [];
// Recoge el nodo raíz del DOM.
var obj_html = document.documentElement;
// Llama a la función que genera el árbol de nodos de la página.
getNodeTree(obj_html);
console.log(nodeTree);
// Función que recorre la página descubriendo todo el árbol de nodos.
function getNodeTree(node)
{
// Comprueba si el nodo tiene hijos.
if (node.hasChildNodes())
{
// Recupera la información del nodo.
var treeSize = nodeInfo(node);
// Calcula el índice del nodo actual.
var treeIndex = treeSize - 1;
// Recorre los hijos del nodo.
for (var j = 0; j < node.childNodes.length; j++)
{
// Comprueba, de forma recursiva, los hijos del nodo.
getNodeTree(node.childNodes[j]);
}
}
else
{
return false;
}
}
// Función que devuelve la información de un nodo.
function nodeInfo(node,)
{
// Declara la variable que contendrá la información.
var data = {
node: node.nodeName,
parent: node.parentNode.nodeName,
childs: [],
content: (typeof node.text === 'undefined'? "" : node.text)
}
var i = nodeTree.push(data);
return i;
}
// Función que devuelve los datos de los elementos hijos de un nodo.
function muestraArbol()
{
var txt = "";
// Comprueba si existen nodos.
if (nodeTree.length > 0)
{
// Recorre los nodos.
for (var i = 0; i < nodeTree.length; i++)
{
txt += "<ul><li>Nodo: " + nodeTree[i].node + "</li>";
txt += "<li> Padre: " + nodeTree[i].parent + "</li>";
txt += "<li>Contenido: " + nodeTree[i].content + "</li>";
txt += "</ul>";
}
document.write(txt);
}
else
{
document.write("<h1>No existen nodos en el DOM.</h1>");
}
}
};
Does anyone comes up how to draw a nested tree to glance at the parent and child nodes you distinguish?
Greetings and thank you
You have a recursive DOM reader, but you also need a recursive outputter. You're also dealing with a one dimensional array when you need a multi-level object (tree).
We'll start with refactoring getNodeTree. Instead of adding to a global array (nodeTree in your code), let's have it return a tree:
function getNodeTree (node) {
if (node.hasChildNodes()) {
var children = [];
for (var j = 0; j < node.childNodes.length; j++) {
children.push(getNodeTree(node.childNodes[j]));
}
return {
nodeName: node.nodeName,
parentName: node.parentNode.nodeName,
children: children,
content: node.innerText || "",
};
}
return false;
}
Same for muestraArbol (for our monolingual friends out there, it means "show tree"): We'll have it work recursively and return a string containing nested lists:
function muestraArbol (node) {
if (!node) return "";
var txt = "";
if (node.children.length > 0) {
txt += "<ul><li>Nodo: " + node.nodeName + "</li>";
txt += "<li> Padre: " + node.parentName + "</li>";
txt += "<li>Contenido: " + node.content + "</li>";
for (var i = 0; i < node.children.length; i++)
if (node.children[i])
txt += "<li> Hijos: " + muestraArbol(node.children[i]) + "</li>";
txt += "</ul>";
}
return txt;
}
Finally, if we put it together in a snippet:
var nodeTree = getNodeTree(document.documentElement);
console.log(nodeTree);
function getNodeTree(node) {
if (node.hasChildNodes()) {
var children = [];
for (var j = 0; j < node.childNodes.length; j++) {
children.push(getNodeTree(node.childNodes[j]));
}
return {
nodeName: node.nodeName,
parentName: node.parentNode.nodeName,
children: children,
content: node.innerText || "",
};
}
return false;
}
function muestraArbol(node) {
if (!node) return "";
var txt = "";
if (node.children.length > 0) {
txt += "<ul><li>Nodo: " + node.nodeName + "</li>";
txt += "<li> Padre: " + node.parentName + "</li>";
txt += "<li>Contenido: " + node.content + "</li>";
for (var i = 0; i < node.children.length; i++)
if (node.children[i])
txt += "<li> Hijos: " + muestraArbol(node.children[i]) + "</li>";
txt += "</ul>";
}
return txt;
}
document.getElementById("muestra_abol").addEventListener("click", function() {
document.getElementById("result").innerHTML = muestraArbol(nodeTree);
});
<title>Formulario para validar</title>
<body>
<p>Primer texto que se visualiza en la Pagina</p>
<div>Esto es un div</div>
<div>Otro div que me encuentro</div>
<p>Hay muchos parrafos</p>
<ul>
<li>Lista 1</li>
<li>Lista 2</li>
<li>Lista 3</li>
</ul>
<button type="button" id="muestra_abol">Muestra Arbol DOM</button>
<div id="result"></div>
</body>
Finally: My apologies, for my Spanish-JavaScript reading skills are not in their prime. :)

Return to Ajax - Error - Symfony2

For over a week I can not solve a problem with ajax . I have a form where the customer chooses the product to buy , the amount you are going to buy , and to what extent ( 1kg, 5kg, etc ) . Everything works properly, when you choose the product, the other two fields with the corresponding quantities and units will auto . When sending the form, tells me the following error:
The controller must return a response (null given). Did you forget to add a return statement somewhere in your controller?
I'll put all code , but actually the problem should be in the driver. To that reading is not so difficult to do , I will be commenting on each step.
1°: First, sending the form to the view. (obviously , first passes through the routing, but do not go if)
TablasController.php
public function pedidoAction()
{
$em = $this->getDoctrine()->getManager();
$prodped= new ProdPedido();//creo la entidad de los productos
$form = $this->createForm(new ProdPedidoType(), $prodped);
$nombres = $em->getRepository('ProyectoAdminBundle:Catalogo')->findByArticulo();
return $this->render('AtajoBundle:General:pedido.html.twig', array('form' => $form->createView(), 'nombres' => $nombres));
}
2°: I reduced a little code so that not so long . Here , I present the form, and make the corresponding javascript that handles dynamically add fields , and that I mentioned above, the auto-complete fields. Although this does not go much to the case , since the problem would be in the controller.
pedido.html.twig
{% block content %}
<section class="pedido">
<form id="formulario" action="{{ path('crear_pedido', { 'id': app.user.id } ) }}" method="post" {{ form_enctype(form) }}>
{{ form_start (form) }}
{{ form_errors(form) }}
<div id="agrega">
<ul>
<li>{{ form_label(form.producto, 'Nombre del producto: ') }}</li>
<li>{{ form_label(form.cantidad, 'Cantidad que va a llevar: ') }}</li>
<li>{{ form_label(form.valor, 'Valor en numero (KGS/LTS): ') }}</li>
</ul>
<ul class="ul_0">
<li>{{ form_widget(form.producto, { 'attr': {'class': 'producto_0'} }) }}</li>
<li>{{ form_widget(form.cantidad, { 'attr': {'class': 'cantidad_0'} }) }}</li>
<li>{{ form_widget(form.valor, { 'attr': {'class': 'medida_0'} }) }}</li>
</ul>
</div>
<div ><input id="agregarCampo" type="button" value="Agregar Producto"/></div>
<div ><input id="quitarCampo" type="button" value="Quitar Producto"/></div>
<div ><input id="enviar" type="submit" id="submit"/></div>
{{ form_end (form) }}
</section>
{% endblock %}
{% block javascripts %}
{{ parent() }}
<script type="text/javascript" src=" {{ asset('bundles/MICARPETA/js/jquery-2.1.4.min.js') }} "></script>
<script type="text/javascript">
$(document).ready(function() {
var loqueagrego;
var busqueda = $('#busqueda');
var contenedor = $("#agrega"); //ID del contenedor
var AddButton = $("#agregarCampo"); //ID del Botón Agregar
var QuitButton = $("#quitarCampo");
var productos = '{% for nombre in nombres %}<option value="{{ nombre.articulo }}"> {{ nombre.articulo }} </option>{% endfor %}';
var x = 1;
//agregar boton
$(AddButton).click(function (e) {
//el html que voy a agregar
loqueagrego = '<ul>';
loqueagrego = loqueagrego + '<li><label>Nombre del producto: </label></li>';
loqueagrego = loqueagrego + '<li><label>Cantidad que va a llevar: </label></li>';
loqueagrego = loqueagrego + '<li><label>Valor en numero (KGS/LTS): </label></li>';
loqueagrego = loqueagrego + '</ul>';
loqueagrego = loqueagrego + '<ul class="ul_'+x+'">';
loqueagrego = loqueagrego + '<li><select class="producto_0" name="producto[]">'+ productos +'</select></li>';
loqueagrego = loqueagrego + '<li><select class="cantidad_0" name="cantidad[]"></select></li>';
loqueagrego = loqueagrego + '<li><select class="medida_0" name="medida[]"></select></li>';
loqueagrego = loqueagrego + '</ul>';
//lo agrego
$(contenedor).append(loqueagrego);
x++; //sumo la cantidad de campos que hay
return false;
});
//quitar boton
$(QuitButton).click(function (e){
if (x !== 1){ // si es distinto a 1, remuevo los input que no deseo
$("#agrega ul:last-child").remove();
$("#agrega ul:last-child").remove();
x--;
}
return false;
});
//le digo que todos los que se agreguen dinamicamente tambien van a ser afectados
$('#agrega').on("change",".producto_0", function(e){
var elegido = $(this).val();
var medidahermano = $(this).parent().parent().attr("class");
var cantidadhermano = medidahermano;
medidahermano = $('.'+ medidahermano +' li:last-child');//recupero el ultimo hijo
medidahermano = medidahermano.children(1); //recupero el primer hijo
cantidadhermano = $('.'+ cantidadhermano +' li:nth-child(2)');
cantidadhermano = cantidadhermano.children(1);
var solido;
var liquido;
solido = '<option value="1">1</option>';
solido = solido + '<option value="5">5</option>';
solido = solido + '<option value="10">10</option>';
solido = solido + '<option value="15">15</option>';
solido = solido + '<option value="20">20</option>';
solido = solido + '<option value="30">30</option>';
solido = solido + '<option value="50">50</option>';
solido = solido + '<option value="100">100</option>';
liquido = '<option value="6">6</option>'
liquido = liquido + '<option value="12">12</option>';
liquido = liquido + '<option value="24">24</option>';
liquido = liquido + '<option value="48">48</option>';
liquido = liquido + '<option value="12">96</option>';
$.ajax({
type: "POST",
url: "{{ path('que_unidad') }}",
data: { 'id' : ' ' + elegido + ' ' },
error: function(){
alert("Error petición Ajax");
},
success: function(data){
alert(data);
if(data == 'KG' | data == 'unidad'){
$(cantidadhermano).html(solido);
}
else if(data == 'LTS'){
$(cantidadhermano).html(liquido);
}
$.ajax({
type: "POST",
url: "{{ path('medidas_y_unidades') }}",
data: { 'id' : ' ' + elegido + ' ' },
error: function(){
alert("Error petición ajax");
},
success: function(data){
$(medidahermano).html(data);
}
});
}
});
});
});
</script>
{% endblock %}
3°: This is where it is assumed that this error. For me it is the way to return the information to the ajax , but not really , because it seems like it's okay . Return information through a view, everything works fine , the fields will auto . But sending the form , I get this error.
TablasController.php
public function recuperarMedidasyUnidadesAction(){
$id = $_POST['id'];
$em = $this->getDoctrine()->getManager();
// busco las diferentes unidades que existen (1kg, 5kg, 10kg, etc)
$medidas = $em->getRepository('ProyectoAdminBundle:Unidades')->findByUnidadesJoinCatalogo($id);
return $this->render('AtajoBundle:Ajax:medidasYUnidades.html.twig', array('medidas' => $medidas));
}
public function recuperarUnidadAction(){
$id = $_POST['id'];
$em = $this->getDoctrine()->getManager();
// busco las diferentes unidades que existen (1kg, 5kg, 10kg, etc)
$unidad = $em->getRepository('ProyectoAdminBundle:Categoria')->findByUnidad($id);
return $this->render('AtajoBundle:Ajax:unidad.html.twig', array('unidad' => $unidad));
}
4°:views
medidasYUnidades.html.twig
{% for medida in medidas %}
<option value="{{ medida.medida }}">{{ medida.medida }}</option>
{% endfor %}
unidad.html.twig
{{ unidad.unidad }}
a response object requires data in an associative array. Your code gives an entity object. You have to convert that entity to an array.
If you would like to convert all the entity data into an array then you could use JMSSerializer. See also this other stackoverflow topic
Try modifying the code as given below. It includes changes to your controller actions as well as the ajax call in the
template.
public function recuperarMedidasyUnidadesAction(){
$id = $_POST['id'];
$em = $this->getDoctrine()->getManager();
// busco las diferentes unidades que existen (1kg, 5kg, 10kg, etc)
$medidas = $em->getRepository('ProyectoAdminBundle:Unidades')->findByUnidadesJoinCatalogo($id);
//modified code
$status = 'error';
$html = '';
if($medidas){
$data =$this->render('AtajoBundle:Ajax:medidasYUnidades.html.twig', array('medidas' => $medidas));
$status = 'success';
$html = $data->getContent();
}
$jsonArray = array(
'status' => $status,
'data' => $html,
);
$response = new Response(json_encode($jsonArray));
$response->headers->set('Content-Type', 'application/json; charset=utf-8');
return $response;
}
public function recuperarUnidadAction(){
$id = $_POST['id'];
$em = $this->getDoctrine()->getManager();
// busco las diferentes unidades que existen (1kg, 5kg, 10kg, etc)
$unidad = $em->getRepository('ProyectoAdminBundle:Categoria')->findByUnidad($id);
//modified code
$status = 'error';
$html = '';
if($unidad){
$data = $this->render('AtajoBundle:Ajax:unidad.html.twig', array('unidad' => $unidad));
$status = 'success';
$html = $data->getContent();
}
$jsonArray = array(
'status' => $status,
'data' => $html,
);
$response = new Response(json_encode($jsonArray));
$response->headers->set('Content-Type', 'application/json; charset=utf-8');
return $response;
}
JavaScript in template:
$.ajax({
type: "POST",
url: "{{ path('medidas_y_unidades') }}",
data: { 'id' : ' ' + elegido + ' ' },
error: function(){
alert("Error petición ajax");
},
success: function(result, request) {
var parsedData =JSON.parse(result);
if(parsedData.status ==='success'){
userListDiv.html(parsedData.data);
$(medidahermano).html(parsedData.data);
}else{
//handle no result case
}
}
});

IE Parsing XML JQuery and AJAX

$.ajax({
url : SrvHandlerCalendar,
type : 'post',
data : {"persona": str, "day2" : dia + '.' + mes + '.' + anio},
timeout : 2000,
tryCount : 0,
retryLimit : 3,
cache: false,
dataType: ($.browser.msie) ? "text" : "xml",
success: function(data) {
var xml;
if (typeof data == 'string') {
xml = new ActiveXObject("Microsoft.XMLDOM");
xml.async = false;
xml.loadXML(data);
} else {
xml = data;
}
$(xml).find('evento').each(function(){
ai++;
var id = $(this).attr('id');
var rdia = $(this).find('dia').text();
var rmes = $(this).find('mes').text();
var ranio = $(this).find('anio').text();
var hora = $(this).find('hora').text();
var horario = $(this).find('horario').text();
var desc = $(this).find('d').text();
var estado = $(this).find('estado').text();
var localidad = $(this).find('localidad').text();
var colonia = $(this).find('colonia').text();
var calle = $(this).find('calle').text();
var numero = $(this).find('ncasa').text();
var telefono = $(this).find('telefono').text();
var celular = $(this).find('celular').text();
var persona = $(this).find('persona').text();
var creador = $(this).find('creador').text();
var observaciones = $(this).find('observaciones').text();
if(persona != $("#personas_select option:selected").text()) return 1;
var html = "<font size=5>Informacion del evento con <u>" + persona + "</u></font><br>";
html += "<font size=2>"+desc+"</font><br><br><br>";
html += "<table class=\"datatable\" cellpadding=10>"
html += "<tr><td><strong>Hora de la Cita</strong></td><td>" + hora + horario+"</td></tr>";
html += "<tr><td><strong>Domicilio</strong></td><td>" + calle + " #"+numero+"</td></tr>";
html += "<tr><td><strong>Colonia</strong></td><td>" +colonia+"</td></tr>";
//html += "<tr colspan=\"2\" style=\"text-align: center;\"><td>Datos de contacto</td></tr>";
html += "<tr><td><strong>Telefono</strong></td><td>" + telefono +"</td></tr>";
html += "<tr><td><strong>Celular</strong></td><td>" + celular +"</td></tr>";
html += "<tr><td><strong>Encuestador</strong></td><td>" + creador +"</td></tr>"
html += "<tr><td><strong>Observaciones</strong></td><td>" + observaciones +"</td></tr></table>";
$('#datos').html(html);
/*
var html = "<font size=5>Informacion del evento con <u>" + persona + "</u></font><br>";
html += "<font size=2>"+desc+"</font><br>";
html += "<table>"
html += " <tr> <td>Hora de la Cita</td><td>horario y fecha</td></tr>";
html += "<tr> <td>Domicilio</td><td>vdomicilio</td></tr>";
html += "<tr><td>Colonia</td><td>vcolonia</td></tr>";
html += "<tr><td>Datos de contacto</td><td>(no hay otra columna)</td></tr>";
html += "<tr><td>telefono</td><td></td></tr>";
html += "<tr><td>celular</td><td></td></tr>";
html += "<tr><td>encuestador</td><td></td></tr></table>";
*/
});
if($("#datos").html() == loading){
$('#datos').html("Uups! No hay datos de evento para esta persona. <strong>Notificar de inmediato al administrador del sistema</strong> <a href=\"#\" onclick='alert(\"No se encontro el primer atributo XML\" + \" "+" \" )'> Ficha Técnica</a>");
}
},
error : function(xhr, textStatus, errorThrown ) {
if (textStatus == 'timeout') {
$('#datos').html(loading);
this.tryCount++;
if (this.tryCount <= this.retryLimit) {
//try again
$.ajax(this);
return;
}
$('#datos').html("Uups! Hubo un error procesando su solicitud <a href=\"#\" onclick='alert(\"Respuesta HTTP: \" + \" "+ xhr.status+" \" + \"\\nManejador del servidor: \" + \" " + SrvHandlerCalendar + " \" + \"\\nDescripcion de error: \" + \" " + textStatus + " \" + \"\\nIntentos: \" + \" " + this.retryLimit + " \" )'> Ficha Técnica</a>");
return;
}
if (xhr.status == 500) {
$('#datos').html('Uups! Hubo un error con el servidor. Intente nuevamente mas tarde y pongase en contacto con el administrador de sistemas.');
} else {
$('#datos').html("Uups! Hubo un error procesando su solicitud <a href=\"#\" onclick='alert(\"Respuesta HTTP: \" + \" "+ xhr.status+" \" + \"\\nManejador del servidor: \" + \" " + SrvHandlerCalendar + " \" + \"\\nDescripcion de error: \" + \" " + textStatus + " \" )'> Ficha Técnica</a>");
}
}
});`
And basically this:
var xml;
if (typeof data == 'string') {
xml = new ActiveXObject("Microsoft.XMLDOM");
xml.async = false;
xml.loadXML(data);
} else {
xml = data;
}
$(xml).find('evento').each(function(){
ai++;
var id = $(this).attr('id');
var rdia = $(this).find('dia').text();
var rmes = $(this).find('mes').text();
var ranio = $(this).find('anio').text();
var hora = $(this).find('hora').text();
var horario = $(this).find('horario').text();
var desc = $(this).find('d').text();
var estado = $(this).find('estado').text();
var localidad = $(this).find('localidad').text();
var colonia = $(this).find('colonia').text();
var calle = $(this).find('calle').text();
var numero = $(this).find('ncasa').text();
var telefono = $(this).find('telefono').text();
var celular = $(this).find('celular').text();
var persona = $(this).find('persona').text();
var creador = $(this).find('creador').text();
var observaciones = $(this).find('observaciones').text();
if(persona != $("#personas_select option:selected").text()) return 1;
var html = "<font size=5>Informacion del evento con <u>" + persona + "</u></font><br>";
html += "<font size=2>"+desc+"</font><br><br><br>";
html += "<table class=\"datatable\" cellpadding=10>"
html += "<tr><td><strong>Hora de la Cita</strong></td><td>" + hora + horario+"</td></tr>";
html += "<tr><td><strong>Domicilio</strong></td><td>" + calle + " #"+numero+"</td></tr>";
html += "<tr><td><strong>Colonia</strong></td><td>" +colonia+"</td></tr>";
//html += "<tr colspan=\"2\" style=\"text-align: center;\"><td>Datos de contacto</td></tr>";
html += "<tr><td><strong>Telefono</strong></td><td>" + telefono +"</td></tr>";
html += "<tr><td><strong>Celular</strong></td><td>" + celular +"</td></tr>";
html += "<tr><td><strong>Encuestador</strong></td><td>" + creador +"</td></tr>"
html += "<tr><td><strong>Observaciones</strong></td><td>" + observaciones +"</td></tr></table>";
$('#datos').html(html);
/*
var html = "<font size=5>Informacion del evento con <u>" + persona + "</u></font><br>";
html += "<font size=2>"+desc+"</font><br>";
html += "<table>"
html += " <tr> <td>Hora de la Cita</td><td>horario y fecha</td></tr>";
html += "<tr> <td>Domicilio</td><td>vdomicilio</td></tr>";
html += "<tr><td>Colonia</td><td>vcolonia</td></tr>";
html += "<tr><td>Datos de contacto</td><td>(no hay otra columna)</td></tr>";
html += "<tr><td>telefono</td><td></td></tr>";
html += "<tr><td>celular</td><td></td></tr>";
html += "<tr><td>encuestador</td><td></td></tr></table>";
*/
});
if($("#datos").html() == loading){
$('#datos').html("Uups! No hay datos de evento para esta persona. <strong>Notificar de inmediato al administrador del sistema</strong> <a href=\"#\" onclick='alert(\"No se encontro el primer atributo XML\" + \" "+" \" )'> Ficha Técnica</a>");
}
Only works on Chrome/Firefox and Not on IE.
I don't know why, I googled about JQuery and IE errors, tried the 'fixes' and they still do not work.
Thank you in advance.
UPDATE
It now works.
The problem with IE is that the XML It was receiving was bad because IE doesn't allow áéíóú letters (commonly used in spanish) instead displaying a square character therfor it could't process the XML.

Categories

Resources