Home / user-119157

Andres's questions

Martin Hope
Andres
Asked: 2020-09-25 07:18:55 +0800 CST
  • 0

I am building a page and I am using the w3.css style sheets and it turns out that I would like to assign all the elements "a" the same 4 classes, leaving each element defined as follows:

<a class="w3-bar-item w3-button w3-border-bottom w3-border-deep-purple" style="text-align:right;">Usuario</a>

As this seems very repetitive to me, I would like to do something like:

a {
  w3-bar-item;
  w3-button;
  w3-border-bottom;
  w3-border-deep-purple;
}

But clearly this doesn't work, is there a way to do something like this or is it just fantasy?

html
Martin Hope
Andres
Asked: 2020-12-21 06:42:10 +0800 CST
  • 3

I have an array of objects and I want to sort it by a property, but I want the sort function to ignore some rows.

Suppose I have the following array and would like to ignore index 1:

var datos = [
                {"asd1":"prueba11", "asd2":"prueba12", "asd3":"prueba13", "asd4":"prueba14", "asd5":"prueba15"}, 
                {"asd1":"prueba21", "asd2":"prueba22", "asd3":"prueba23", "asd4":"prueba24", "asd5":"prueba25"}, 
                {"asd1":"prueba11", "asd2":"prueba42", "asd3":"prueba43", "asd4":"prueba44", "asd5":"prueba45"}, 
                {"asd1":"prueba31", "asd2":"prueba32", "asd3":"prueba33", "asd4":"prueba34", "asd5":"prueba35"}, 
                {"asd1":"prueba41", "asd2":"prueba42", "asd3":"prueba43", "asd4":"prueba44", "asd5":"prueba45"}, 
                {"asd1":"prueba51", "asd2":"prueba52", "asd3":"prueba53", "asd4":"prueba54", "asd5":"prueba55"}
            ];

And I have the following function to order:

var x = "asd2";
datos.sort(function(a,b) {return (isNaN(a) && isNaN(b))?((a[x] > b[x]) ? 1 : ((b[x] > a[x]) ? -1 : 0)):(a - b);} );

How can I make it ignore (and keep in the same place) index 1?

javascript
Martin Hope
Andres
Asked: 2020-12-19 09:59:04 +0800 CST
  • 1

As the title indicates, I want to modify a global variable from a function without accessing it directly, thus:

var a = 5;

console.log(a);

midificaVariable(a);

console.log(a);

function modificaVariable(b)
{
    b--;
}

the variable a in the first log would have a value of 5 and in the second log a value of 4.

The idea of ​​this is to use a function to edit different variables regardless of their name.

If the variable ais an object or an array, when it is put as an argument a reference is created, meaning that if I modify the reference, I am modifying the global variable.

javascript
Martin Hope
Andres
Asked: 2020-09-28 09:12:34 +0800 CST
  • 1

I'm trying to make a submenu vary its position depending on whether it fits on the screen or not.

In the Snippet they will see a menu similar to the one I want to do and if they are placed in the New York offices (and also the screen is small) the sub menu is off the screen and I would like it to align on the other side , it's possible?

/* Menu Styles */

.third-level-menu {
  position: absolute;
  top: 0;
  right: -150px;
  width: 150px;
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
}
.third-level-menu > li {
  height: 30px;
  background: #999999;
}
.third-level-menu > li:hover {
  background: #CCCCCC;
}
.second-level-menu {
  position: absolute;
  top: 30px;
  left: 0;
  width: 150px;
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
  
 
}
.second-level-menu > li {
  position: relative;
  height: 30px;
  background: #999999;
  
}
.second-level-menu > li:last-child {
  border-radius: 0px 0px 8px 8px;
}

.second-level-menu > li:hover {
  background: #CCCCCC;
}
.top-level-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
.top-level-menu > li {
  position: relative;
  float: left;
  height: 30px;
  width: 150px;
  background: #999999;
}
.top-level-menu > li:hover {
  background: #CCCCCC;
}
.top-level-menu li:hover > ul {
  /* On hover, display the next level's menu */
  display: inline;
}
/* Menu Link Styles */

.top-level-menu a
/* Apply to all links inside the multi-level menu */

{
  font: bold 14px Arial, Helvetica, sans-serif;
  color: #FFFFFF;
  text-decoration: none;
  padding: 0 0 0 10px;
  /* Make the link cover the entire list item-container */
  display: block;
  line-height: 30px;
}
.top-level-menu a:hover {
  color: #000000;
}
<ul class="top-level-menu">
  <li><a href="#">About</a>
  </li>
  <li><a href="#">Services</a>
  </li>
  <li>
    <a href="#">Offices</a>
    <ul class="second-level-menu">
      <li><a href="#">Chicago</a>
      </li>
      <li><a href="#">Los Angeles</a>
      </li>
      <li>
        <a href="#">New York</a>
        <ul class="third-level-menu">
          <li><a href="#">Information</a>
          </li>
          <li><a href="#">Book a Meeting</a>
          </li>
          <li><a href="#">Testimonials</a>
          </li>
          <li><a href="#">Jobs</a>
          </li>
        </ul>
      </li>
      <li><a href="#">Seattle</a>
      </li>
    </ul>
  </li>
  <li><a href="#">Contact</a>
  </li>
</ul>

You can also see the code in the JSFiddle ( https://jsfiddle.net/cw8w6rwr/ )

css
Martin Hope
Andres
Asked: 2020-07-16 05:25:44 +0800 CST
  • 1

I am making a small page that, depending on the data it receives (via websockets), shows one tablaor the other. My idea is that when the data arrives for one or the other tabla, the other is hidden with the método display noneand the other is shown with the método display blockand since only the body is modified, I predefine the rest of the table elements, including the border.

When the page is hardly loaded, both appear tablas(since no data has been received yet) and as soon as a new "message" arrives, one is forced to tablabe displayed and the other not, but this time with the data. When it is drawn for the first time, the bordedrawing of the tablaoccupies the smallest possible dimension, but when a piece of data arrives, the one bordeof the tablaoccupies the entire screen and those bordesof the tdare adjusted to the data they contain. That could be happening?

Edit 1: I leave a screenshot of what happens: http://prntscr.com/ofajfg

I leave the code even though the error cannot be seen (the data needs to be received by websocket).

var connection = new WebSocket('ws://localhost:algún_puerto/ws/pruebaWebsocket', ['soap', 'xmpp']);
var datos = {};
// When the connection is open, send some data to the server
connection.onopen = function () {
  connection.send('Ping'); // Send the message 'Ping' to the server
};

// Log errors
connection.onerror = function (error) {
  console.log('WebSocket Error ' + error);
};

// Log messages from the server
connection.onmessage = function (e) {
  var temp = JSON.parse(e.data);
  if(temp.topic === "reloj")
  {
    document.getElementById("asd").innerHTML = Date(datos.payload).toString();
  }
  else if(temp.topic === "piezasTotales")
  {
    console.log(temp);
  }
  else if(temp.topic === "ops1")
  {
    document.getElementById("selectorOp").style.display = "block";
    document.getElementById("informe").style.display = "none";
    datos = temp;
    llenarTabla1();
  }
  else
  {
    document.getElementById("selectorOp").style.display = "none";
    document.getElementById("informe").style.display = "block";
    datos = temp;
    llenarTabla();
  }
};

function enviar()
{
  connection.send("prueba");
}

function llenarTabla()
{
  console.log(datos);
  var abiertas = 0;
  var completadas = 0;
  var tbodie = document.getElementById("tbodie");
  for(var i = 0; i < datos.payload.length; i++) {
    var trCuerpo = document.createElement("tr");
    var td1 = document.createElement("td");
    var td2 = document.createElement("td");
    var td3 = document.createElement("td");
    var td4 = document.createElement("td");
    var td5 = document.createElement("td");
    var td6 = document.createElement("td");
    var td7 = document.createElement("td");
    var td8 = document.createElement("td");
    var td9 = document.createElement("td");
    var td10 = document.createElement("td");
    var td11 = document.createElement("td");
    var td12 = document.createElement("td");
    var td13 = document.createElement("td");
    var td14 = document.createElement("td");
    var td15 = document.createElement("td");
    var td16 = document.createElement("td");
    var td17 = document.createElement("td");
    var td18 = document.createElement("td");
    var td19 = document.createElement("td");
    var td20 = document.createElement("td");
    var td21 = document.createElement("td");
    var td22 = document.createElement("td");

    td1.appendChild(document.createTextNode(datos.payload[i].op));
    td2.appendChild(document.createTextNode(datos.payload[i].total));
    td3.appendChild(document.createTextNode(datos.payload[i].reprocesos.mel));
    td4.appendChild(document.createTextNode(datos.payload[i].reprocesos.pvc));
    td5.appendChild(document.createTextNode(datos.payload[i].reprocesos.vid));
    td6.appendChild(document.createTextNode(datos.payload[i].reprocesos.otr));
    td7.appendChild(document.createTextNode(datos.payload[i].frentes.mel));
    td8.appendChild(document.createTextNode(datos.payload[i].frentes.pvc));
    td9.appendChild(document.createTextNode(datos.payload[i].frentes.vid));
    td10.appendChild(document.createTextNode(datos.payload[i].frentes.otr));
    td11.appendChild(document.createTextNode(datos.payload[i].frenRep.mel));
    td12.appendChild(document.createTextNode(datos.payload[i].frenRep.pvc));
    td13.appendChild(document.createTextNode(datos.payload[i].frenRep.vid));
    td14.appendChild(document.createTextNode(datos.payload[i].frenRep.otr));
    td15.appendChild(document.createTextNode(datos.payload[i].piezas.mel));
    td16.appendChild(document.createTextNode(datos.payload[i].piezas.pvc));
    td17.appendChild(document.createTextNode(datos.payload[i].piezas.vid));
    td18.appendChild(document.createTextNode(datos.payload[i].piezas.otr));
    td19.appendChild(document.createTextNode(datos.payload[i].pieRep.mel));
    td20.appendChild(document.createTextNode(datos.payload[i].pieRep.pvc));
    td21.appendChild(document.createTextNode(datos.payload[i].pieRep.vid));
    td22.appendChild(document.createTextNode(datos.payload[i].pieRep.otr));

    trCuerpo.appendChild(td1);
    trCuerpo.appendChild(td2);
    trCuerpo.appendChild(td3);
    trCuerpo.appendChild(td4);
    trCuerpo.appendChild(td5);
    trCuerpo.appendChild(td6);
    trCuerpo.appendChild(td7);
    trCuerpo.appendChild(td8);
    trCuerpo.appendChild(td9);
    trCuerpo.appendChild(td10);
    trCuerpo.appendChild(td11);
    trCuerpo.appendChild(td12);
    trCuerpo.appendChild(td13);
    trCuerpo.appendChild(td14);
    trCuerpo.appendChild(td15);
    trCuerpo.appendChild(td16);
    trCuerpo.appendChild(td17);
    trCuerpo.appendChild(td18);
    trCuerpo.appendChild(td19);
    trCuerpo.appendChild(td20);
    trCuerpo.appendChild(td21);
    trCuerpo.appendChild(td22);

    tbodie.appendChild(trCuerpo);

    (datos.payload[i].COMPLETADO===1)?completadas++:abiertas++;
  }
}

function llenarTabla1()
{
  console.log(datos);
  var abiertas = 0;
  var completadas = 0;
  var tbodie = document.getElementById("selectorOpCuerpo");

  for(var i = 0; i < datos.payload.length; i++)
  {
    var trCuerpo = document.createElement("tr");

    var td1 = document.createElement("th");
    var td2 = document.createElement("th");
    var td3 = document.createElement("th");
    var td4 = document.createElement("th");
    td1.appendChild(document.createTextNode(datos.payload[i].ID));
    td2.appendChild(document.createTextNode(datos.payload[i].fecha));
    td3.appendChild(document.createTextNode(datos.payload[i].OP))
    td4.appendChild(document.createTextNode(datos.payload[i].COMPLETADO))

    td1.style.color = (datos.payload[i].COMPLETADO===1)?"green":"red";
    td2.style.color = (datos.payload[i].COMPLETADO===1)?"green":"red";
    td3.style.color = (datos.payload[i].COMPLETADO===1)?"green":"red";
    td4.style.color = (datos.payload[i].COMPLETADO===1)?"green":"red";

    td4.setAttribute('onclick', 'posicion(' + i + ')');

    trCuerpo.appendChild(td1);
    trCuerpo.appendChild(td2);
    trCuerpo.appendChild(td3);
    trCuerpo.appendChild(td4);

    tbodie.appendChild(trCuerpo);

    (datos.payload[i].COMPLETADO===1)?completadas++:abiertas++;
  }

  document.getElementById("cantidad").innerHTML = "<font color=\"green\">completadas: " + completadas + "</font><br><font color=\"red\">abiertas: " + abiertas + "</font>"
}

function posicion(i)
{
  console.log(datos);
  datos.payload[i].COMPLETADO = (datos.payload[i].COMPLETADO===0)?1:0;
  llenarTabla1();
}
<div id="asd"></div>
<button onClick="enviar()">enviar</button>
<br>
<div id="cantidad"></div>

<table id="selectorOp" border="1px">
  <thead>
  <tr>
    <th>id</th>
    <th>fecha</th>
    <th>op</th>
    <th>seleccionar</th>
  </tr>
  </thead>
  <tbody id="selectorOpCuerpo"> </tbody>
</table>

<table id="informe" border="1px">
  <thead>
    <tr>
      <th rowspan="2">Op</th>
      <th rowspan="2">Total</th>
      <th colspan="4">Total reprocesos</th>
      <th colspan="4">Frentes</th>
      <th colspan="4">Frentes reprocesados</th>
      <th colspan="4">Piezas</th>
      <th colspan="4">Piezas reprocesadas</th>
    </tr>
    <tr>
      <th>MEL</th>
      <th>MDF</th>
      <th>VID</th>
      <th>otr</th>
      <th>MEL</th>
      <th>MDF</th>
      <th>VID</th>
      <th>otr</th>
      <th>MEL</th>
      <th>MDF</th>
      <th>VID</th>
      <th>otr</th>
      <th>MEL</th>
      <th>MDF</th>
      <th>VID</th>
      <th>otr</th>
      <th>MEL</th>
      <th>MDF</th>
      <th>VID</th>
      <th>otr</th>
    </tr>
  </thead>
  <tbody id="tbodie"> </tbody>
</table>

javascript
Martin Hope
Andres
Asked: 2020-05-17 05:06:22 +0800 CST
  • 0

Suppose I have two tables with the same column names and the only difference is that one is the continuation of the other, how do I join the two tables (one after the other) to obtain all the data in one? query?

sqlite
Martin Hope
Andres
Asked: 2020-02-29 05:07:52 +0800 CST
  • 1

Good day everyone, my question is the following, suppose I have the following two tables:

table1 id1
id2 data1 data2
---- ---- ------- -------
1 a d1a1 d2a1
1 b d1b1 d2b1
2 a d1a2 d2a2
2 b d1a2 d2a2
3 a d1a3 d2a3
3 c d1c3 d2c3

table2
id1 id2 data3 data4
---- ---- ------- -------
1 a d3a1 d4a1
null b d3b1 d4b1
null a d3a2 d4a2
2 b d3a2 d4a2

and I want to join them by doing:

SELECT t1.*, t2.* FROM table1 t1 JOIN table2 t2 ON t1.id1 = t2.id2 AND t1.id2 = t2.id2

This will return the following table:

id1 id2 data1 data2 data3 data4
---- ---- ------- ------- -------- --------
1 to d1a1 d2a1 d3a1 d4a1
2b d1b2 d2b2 d3b2 d4b2

What should I do to get the following table as a result:

id1 id2 data1 data2 data3 data4
---- ---- ------- ------- -------- --------
1 to d1a1 d2a1 d3a1 d4a1
null b null null d3b2 d4b2
null a null null d3a2 d4a2
2 b d1b2 d2b2 d3b2 d4b2

sqlite