Anyone firm with JavaScript in HTML?

For everything that's not in any way related to PureBasic. General chat etc...
User avatar
jacdelad
Addict
Addict
Posts: 2029
Joined: Wed Feb 03, 2021 12:46 pm
Location: Riesa

Anyone firm with JavaScript in HTML?

Post by jacdelad »

I have written a tool which spits out a small list encased in html. It has a simple filter function. Since I'm not firm with Java and HTML I copied the code from some tutorial website and adapted it to my table. Now, it get's slower with more lines (one table has about 85000) and/or more header filters. This is surely improvable, and also surely super simple. Can anyone help me?

Shortened list (which is fast, because of the lack of 85000 items):

Code: Select all

<html>
<head>
<title>Assembly Shape-Liste</title>

<style>
* {
  box-sizing: border-box;
}

p {
  margin: 8px;
}
#myInput1, #myInput2, #myInput3, #myInput4, #myInput5, #myInput6, #myInput7, #myInput8, #myInput9 , #myInput10 , #myInput11  {
  width: 100%;
  font-size: 12px;
  padding: 6px 6px;
  border: 1px solid #ddd;
}

#myTable {
  border-collapse: collapse;
  width: 70%;
  border: 1px solid #ddd;
}

#myTable th {
  text-align: center;
  padding: 4px;
  font-size: 14px;
  background-color: #f1f1f1;
  border: 1px solid #ddd;
}

#myTable td {
  text-align: right;
  padding: 4px;
  font-size: 12px;
  border: 1px solid #ddd;
}

#myTable tr {
  border: 1px solid #ddd;
}

#myTable tr.header, #myTable tr:hover {
  background-color: #f1f1f1;
}
</style>

</head>
<body bgcolor=#FFFFFF>
<font size="1" color=#3300CC face=Verdana>
<p style="text-align:center; font-size:40"><b>Assembly Shape-Liste</b></p>
<p style="text-align:center">Letzte Aktualisierung: <b>24.08.2023 18:56:01</b></p>

<table id='myTable' align=center border="3">
<tr style="color:#3300CC">
<th><input type="text" size="5" id="myInput1"  onkeyup="myFunction()" placeholder="Assembly Shape"/></th>
<th><input type="text" size="5" id="myInput2"  onkeyup="myFunction()" placeholder="Body X"/></th>
<th><input type="text" size="5" id="myInput3"  onkeyup="myFunction()" placeholder="Body Y"/></th>
<th><b>Tolerance X</b></th>
<th><b>Tolerance Y</b></th>
<th><input type="text" size="5" id="myInput6"  onkeyup="myFunction()" placeholder="Part Height"/></th>
<th><b>Offset Z</b></th>
<th><input type="text" size="5" id="myInput8"  onkeyup="myFunction()" placeholder="MinNozzle"/></th>
<th><input type="text" size="5" id="myInput9"  onkeyup="myFunction()" placeholder="MaxNozzle"/></th>
<th><input type="text" size="5" id="myInput10" onkeyup="myFunction()" placeholder="Nozzle"/></th>
<th><input type="text" size="5" id="myInput11" onkeyup="myFunction()" placeholder="Vision Type"/></th>
</tr>


<tr><td style="text-align:left">008004</td><td>0.250</td><td>0.125</td><td>0.070</td><td>0.070</td><td>0.125</td><td>0.000</td><td>0.19</td><td>0.19</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">01005</td><td>0.400</td><td>0.200</td><td>0.070</td><td>0.070</td><td>0.100</td><td>0.000</td><td>0.30</td><td>0.30</td><td>R047-003-037</td><td>60</td></tr>
<tr><td style="text-align:left">01005H</td><td>0.400</td><td>0.200</td><td>0.070</td><td>0.070</td><td>0.200</td><td>0.000</td><td>0.30</td><td>0.30</td><td>R047-003-037</td><td>60</td></tr>
<tr><td style="text-align:left">0201</td><td>0.600</td><td>0.300</td><td>0.100</td><td>0.100</td><td>0.300</td><td>0.000</td><td>0.40</td><td>0.40</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0201R</td><td>0.600</td><td>0.300</td><td>0.100</td><td>0.100</td><td>0.200</td><td>0.000</td><td>0.40</td><td>0.40</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0205</td><td>5.300</td><td>1.850</td><td>0.450</td><td>0.450</td><td>1.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">0208</td><td>6.400</td><td>2.000</td><td>0.450</td><td>0.450</td><td>2.000</td><td>0.000</td><td>2.60</td><td>2.60</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">0209</td><td>7.050</td><td>2.750</td><td>0.300</td><td>0.300</td><td>2.450</td><td>0.000</td><td>2.40</td><td>2.40</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">0306</td><td>1.500</td><td>0.800</td><td>0.200</td><td>0.200</td><td>0.450</td><td>0.000</td><td>0.70</td><td>1.00</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0402</td><td>1.000</td><td>0.500</td><td>0.100</td><td>0.100</td><td>0.300</td><td>0.000</td><td>0.70</td><td>0.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0402BZ</td><td>1.000</td><td>0.500</td><td>0.100</td><td>0.100</td><td>0.300</td><td>-0.900</td><td>0.70</td><td>0.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0402F</td><td>1.100</td><td>0.550</td><td>0.100</td><td>0.100</td><td>0.300</td><td>0.000</td><td>0.70</td><td>0.70</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">0402H</td><td>1.000</td><td>0.500</td><td>0.100</td><td>0.100</td><td>0.450</td><td>0.000</td><td>0.70</td><td>0.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0402L</td><td>1.180</td><td>0.680</td><td>0.100</td><td>0.100</td><td>0.500</td><td>0.000</td><td>0.70</td><td>0.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0402RN</td><td>2.000</td><td>0.950</td><td>0.200</td><td>0.200</td><td>0.450</td><td>0.000</td><td>0.70</td><td>0.70</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">0508</td><td>1.900</td><td>1.300</td><td>0.400</td><td>0.400</td><td>0.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0603</td><td>1.500</td><td>0.800</td><td>0.200</td><td>0.200</td><td>0.450</td><td>0.000</td><td>0.70</td><td>1.00</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0603_LOT</td><td>1.500</td><td>0.800</td><td>0.200</td><td>0.200</td><td>0.700</td><td>0.000</td><td>0.70</td><td>1.00</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0805_DIO</td><td>2.000</td><td>1.250</td><td>0.400</td><td>0.400</td><td>0.460</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0805_LOT</td><td>2.000</td><td>1.250</td><td>0.400</td><td>0.400</td><td>0.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0805RN</td><td>2.000</td><td>1.200</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">0806</td><td>2.000</td><td>1.250</td><td>0.400</td><td>0.400</td><td>0.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0806RN</td><td>2.000</td><td>1.250</td><td>0.400</td><td>0.400</td><td>0.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0808</td><td>1.950</td><td>1.250</td><td>0.300</td><td>0.300</td><td>1.100</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0810</td><td>2.000</td><td>1.150</td><td>0.300</td><td>0.300</td><td>1.300</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">0812</td><td>2.500</td><td>1.250</td><td>0.500</td><td>0.500</td><td>0.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1008</td><td>2.500</td><td>2.000</td><td>0.300</td><td>0.300</td><td>1.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1008H</td><td>2.500</td><td>1.800</td><td>0.300</td><td>0.300</td><td>1.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1205</td><td>3.200</td><td>1.300</td><td>0.200</td><td>0.200</td><td>0.650</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206</td><td>3.050</td><td>1.550</td><td>0.250</td><td>0.250</td><td>0.700</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206_PAD</td><td>2.900</td><td>1.800</td><td>0.200</td><td>0.200</td><td>0.300</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206_RR</td><td>3.050</td><td>1.550</td><td>0.250</td><td>0.250</td><td>0.700</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>153</td></tr>
<tr><td style="text-align:left">1206H</td><td>3.200</td><td>1.600</td><td>0.300</td><td>0.300</td><td>1.200</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206H2</td><td>3.100</td><td>1.550</td><td>0.250</td><td>0.250</td><td>1.550</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206HH</td><td>3.200</td><td>1.700</td><td>0.300</td><td>0.300</td><td>1.700</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206LN</td><td>3.200</td><td>1.600</td><td>0.200</td><td>0.200</td><td>0.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">1206R</td><td>3.200</td><td>1.600</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1206R_VIS</td><td>3.200</td><td>1.600</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">1206RN</td><td>3.200</td><td>1.600</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">1206RN_H</td><td>3.000</td><td>1.750</td><td>0.200</td><td>0.200</td><td>1.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1206RX</td><td>3.200</td><td>1.600</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">1206S</td><td>3.100</td><td>1.600</td><td>0.200</td><td>0.200</td><td>1.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1207</td><td>3.200</td><td>2.500</td><td>0.440</td><td>0.440</td><td>1.750</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1209</td><td>3.000</td><td>2.200</td><td>0.200</td><td>0.200</td><td>1.300</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1209H</td><td>3.000</td><td>2.200</td><td>0.200</td><td>0.200</td><td>1.950</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1210</td><td>3.050</td><td>2.450</td><td>0.300</td><td>0.300</td><td>0.700</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1210H</td><td>3.150</td><td>2.500</td><td>0.300</td><td>0.300</td><td>1.300</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1210H2</td><td>3.150</td><td>2.500</td><td>0.300</td><td>0.300</td><td>2.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>61</td></tr>
<tr><td style="text-align:left">1210H2_oH12</td><td>2.900</td><td>2.300</td><td>0.300</td><td>0.300</td><td>1.900</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>61</td></tr>
<tr><td style="text-align:left">1210HH</td><td>3.150</td><td>2.500</td><td>0.400</td><td>0.400</td><td>2.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>61</td></tr>
<tr><td style="text-align:left">1210HH_25Noz</td><td>3.150</td><td>2.500</td><td>0.400</td><td>0.400</td><td>2.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>61</td></tr>
<tr><td style="text-align:left">1210HH_oH12</td><td>3.150</td><td>2.500</td><td>0.400</td><td>0.400</td><td>2.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1210R</td><td>3.050</td><td>2.450</td><td>0.300</td><td>0.300</td><td>0.500</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1210S</td><td>3.150</td><td>2.500</td><td>0.300</td><td>0.300</td><td>1.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1234</td><td>3.000</td><td>3.000</td><td>0.000</td><td>0.000</td><td>0.000</td><td>0.000</td><td>0.00</td><td>0.00</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1310</td><td>3.200</td><td>2.500</td><td>0.300</td><td>0.300</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1406_LOT</td><td>3.500</td><td>1.500</td><td>0.400</td><td>0.400</td><td>0.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1410H</td><td>3.100</td><td>2.600</td><td>0.500</td><td>0.500</td><td>1.900</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1411</td><td>3.500</td><td>2.600</td><td>0.500</td><td>0.500</td><td>1.900</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1411H</td><td>3.500</td><td>2.600</td><td>0.500</td><td>0.500</td><td>2.600</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1419</td><td>4.900</td><td>3.550</td><td>0.350</td><td>0.350</td><td>5.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1420</td><td>3.400</td><td>2.500</td><td>0.500</td><td>0.500</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1420_13Noz</td><td>3.000</td><td>2.550</td><td>0.400</td><td>0.400</td><td>2.550</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1420_oH12</td><td>3.400</td><td>2.500</td><td>0.500</td><td>0.500</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">15025</td><td>38.000</td><td>6.500</td><td>0.500</td><td>0.500</td><td>1.000</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1513H</td><td>3.900</td><td>3.300</td><td>0.200</td><td>0.200</td><td>3.700</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">1515</td><td>4.000</td><td>3.800</td><td>0.200</td><td>0.200</td><td>2.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1515S</td><td>3.700</td><td>3.700</td><td>0.200</td><td>0.200</td><td>1.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1606RN</td><td>4.000</td><td>1.550</td><td>0.200</td><td>0.200</td><td>0.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">1608RN</td><td>4.050</td><td>2.150</td><td>0.200</td><td>0.200</td><td>0.550</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1610</td><td>4.000</td><td>2.500</td><td>0.200</td><td>0.200</td><td>1.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1610RN</td><td>4.000</td><td>2.500</td><td>0.200</td><td>0.200</td><td>1.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">1612</td><td>4.150</td><td>3.100</td><td>0.200</td><td>0.200</td><td>2.200</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1612ISA</td><td>4.000</td><td>3.000</td><td>0.200</td><td>0.200</td><td>1.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">1612S</td><td>4.150</td><td>3.100</td><td>0.200</td><td>0.200</td><td>1.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1616</td><td>4.000</td><td>4.000</td><td>0.200</td><td>0.200</td><td>2.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1707</td><td>3.150</td><td>2.440</td><td>0.200</td><td>0.200</td><td>1.450</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1712</td><td>4.300</td><td>3.000</td><td>0.350</td><td>0.350</td><td>1.200</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1713</td><td>4.400</td><td>3.300</td><td>0.350</td><td>0.350</td><td>3.300</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1713S</td><td>4.400</td><td>3.300</td><td>0.350</td><td>0.350</td><td>2.600</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1806</td><td>4.450</td><td>1.600</td><td>0.300</td><td>0.300</td><td>1.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1806S</td><td>4.450</td><td>1.650</td><td>0.250</td><td>0.250</td><td>0.900</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1808</td><td>4.550</td><td>2.000</td><td>0.250</td><td>0.250</td><td>0.900</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1808H</td><td>4.550</td><td>2.000</td><td>0.250</td><td>0.250</td><td>1.400</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1808H2</td><td>4.550</td><td>2.000</td><td>0.250</td><td>0.250</td><td>1.800</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1808HH</td><td>4.550</td><td>2.000</td><td>0.250</td><td>0.250</td><td>2.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1808L</td><td>5.000</td><td>2.000</td><td>0.300</td><td>0.300</td><td>2.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812</td><td>4.450</td><td>3.150</td><td>0.350</td><td>0.350</td><td>0.950</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812H</td><td>4.550</td><td>3.200</td><td>0.350</td><td>0.350</td><td>2.050</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812HH</td><td>4.550</td><td>3.200</td><td>0.350</td><td>0.350</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812HH_4KP</td><td>4.550</td><td>3.200</td><td>0.350</td><td>0.350</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812R</td><td>4.500</td><td>3.150</td><td>0.350</td><td>0.350</td><td>0.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1812S</td><td>4.400</td><td>3.200</td><td>0.350</td><td>0.350</td><td>1.600</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812X</td><td>4.700</td><td>3.150</td><td>0.350</td><td>0.350</td><td>1.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1812XL</td><td>4.850</td><td>3.200</td><td>0.350</td><td>0.350</td><td>5.350</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1812XXL</td><td>4.500</td><td>3.100</td><td>0.350</td><td>0.350</td><td>4.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">1813</td><td>4.500</td><td>3.250</td><td>0.350</td><td>0.350</td><td>1.350</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1813H</td><td>4.500</td><td>3.350</td><td>0.350</td><td>0.350</td><td>2.150</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1813HH</td><td>4.800</td><td>3.350</td><td>0.350</td><td>0.350</td><td>2.700</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>185</td></tr>
<tr><td style="text-align:left">1813HX</td><td>4.800</td><td>3.300</td><td>0.300</td><td>0.300</td><td>3.900</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1813L</td><td>4.800</td><td>3.350</td><td>0.350</td><td>0.350</td><td>3.100</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1813R</td><td>4.900</td><td>3.350</td><td>0.350</td><td>0.350</td><td>1.150</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1815</td><td>4.550</td><td>3.850</td><td>0.400</td><td>0.400</td><td>1.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1817</td><td>4.600</td><td>4.100</td><td>0.400</td><td>0.400</td><td>1.550</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1818H</td><td>4.700</td><td>4.200</td><td>0.400</td><td>0.400</td><td>2.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1825</td><td>4.600</td><td>6.500</td><td>0.500</td><td>0.500</td><td>1.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1825H</td><td>4.700</td><td>6.500</td><td>0.500</td><td>0.500</td><td>2.400</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">1913</td><td>4.700</td><td>3.350</td><td>0.350</td><td>0.350</td><td>2.000</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">1926</td><td>4.900</td><td>6.600</td><td>0.350</td><td>0.350</td><td>2.100</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">195872100</td><td>6.570</td><td>2.780</td><td>0.500</td><td>0.500</td><td>2.900</td><td>0.000</td><td>1.80</td><td>1.80</td><td></td><td>18</td></tr>
<tr><td style="text-align:left">195991100</td><td>5.000</td><td>2.100</td><td>0.500</td><td>0.500</td><td>2.900</td><td>0.000</td><td>1.80</td><td>1.80</td><td></td><td>18</td></tr>
<tr><td style="text-align:left">1H</td><td>8.000</td><td>6.500</td><td>0.400</td><td>0.400</td><td>5.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1H_S</td><td>8.000</td><td>6.500</td><td>0.400</td><td>0.400</td><td>4.950</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">1H_STICK</td><td>8.000</td><td>6.500</td><td>0.400</td><td>0.400</td><td>5.500</td><td>3.500</td><td>3.70</td><td>3.70</td><td></td><td>12</td></tr>
<tr><td style="text-align:left">2</td><td>10.500</td><td>4.450</td><td>0.500</td><td>0.500</td><td>4.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>100</td></tr>
<tr><td style="text-align:left">2010H</td><td>5.000</td><td>2.520</td><td>0.300</td><td>0.300</td><td>2.100</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2010HH</td><td>5.000</td><td>2.520</td><td>0.300</td><td>0.300</td><td>3.200</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">2010R</td><td>5.000</td><td>2.500</td><td>0.350</td><td>0.350</td><td>0.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2012RN</td><td>5.100</td><td>3.100</td><td>0.350</td><td>0.350</td><td>0.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>62</td></tr>
<tr><td style="text-align:left">2013</td><td>5.000</td><td>3.400</td><td>0.300</td><td>0.300</td><td>2.800</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">2013_ECO</td><td>4.568</td><td>3.197</td><td>0.300</td><td>0.300</td><td>2.800</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">2013H</td><td>5.100</td><td>3.400</td><td>0.300</td><td>0.300</td><td>2.950</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">2014H</td><td>5.150</td><td>3.600</td><td>0.400</td><td>0.400</td><td>2.300</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2017H</td><td>5.200</td><td>4.400</td><td>0.400</td><td>0.400</td><td>3.100</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2018</td><td>5.100</td><td>4.550</td><td>0.400</td><td>0.400</td><td>0.950</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2019</td><td>5.050</td><td>4.850</td><td>0.400</td><td>0.400</td><td>2.300</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2022</td><td>5.000</td><td>5.800</td><td>0.600</td><td>0.600</td><td>2.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2022H</td><td>5.100</td><td>6.000</td><td>0.600</td><td>0.600</td><td>3.400</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2024</td><td>5.050</td><td>6.150</td><td>0.500</td><td>0.500</td><td>1.050</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2025</td><td>5.100</td><td>6.400</td><td>0.500</td><td>0.500</td><td>1.000</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2211</td><td>5.700</td><td>2.900</td><td>0.500</td><td>0.500</td><td>2.000</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220</td><td>5.800</td><td>4.900</td><td>0.600</td><td>0.600</td><td>0.900</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220H</td><td>5.650</td><td>5.000</td><td>0.500</td><td>0.500</td><td>2.400</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220H2</td><td>5.800</td><td>4.800</td><td>0.500</td><td>0.500</td><td>2.900</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220H3</td><td>5.600</td><td>5.100</td><td>0.500</td><td>0.500</td><td>5.100</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">2220H4</td><td>6.000</td><td>5.300</td><td>0.500</td><td>0.500</td><td>2.850</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">2220HH</td><td>5.800</td><td>5.000</td><td>0.300</td><td>0.300</td><td>3.800</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220HL</td><td>5.800</td><td>5.100</td><td>0.400</td><td>0.400</td><td>3.100</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220HX</td><td>6.000</td><td>5.100</td><td>0.300</td><td>0.300</td><td>4.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220HXL</td><td>6.300</td><td>5.050</td><td>0.300</td><td>0.300</td><td>6.300</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220L</td><td>5.800</td><td>4.800</td><td>0.600</td><td>0.600</td><td>1.850</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2220S</td><td>5.800</td><td>4.900</td><td>0.600</td><td>0.600</td><td>1.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2225</td><td>5.650</td><td>6.400</td><td>0.500</td><td>0.500</td><td>3.300</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2225S</td><td>5.650</td><td>6.400</td><td>0.500</td><td>0.500</td><td>2.100</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2225XS</td><td>5.650</td><td>6.400</td><td>0.500</td><td>0.500</td><td>1.500</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2311</td><td>5.800</td><td>2.800</td><td>0.500</td><td>0.500</td><td>1.350</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2311H</td><td>5.900</td><td>2.800</td><td>0.300</td><td>0.300</td><td>6.600</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2312</td><td>5.900</td><td>2.900</td><td>0.500</td><td>0.500</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2406RN</td><td>6.400</td><td>1.600</td><td>0.400</td><td>0.400</td><td>0.500</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2410</td><td>6.100</td><td>2.550</td><td>0.400</td><td>0.400</td><td>2.550</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2410R</td><td>6.200</td><td>2.600</td><td>0.300</td><td>0.300</td><td>1.000</td><td>0.000</td><td>1.30</td><td>1.30</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2411</td><td>6.000</td><td>3.000</td><td>0.400</td><td>0.400</td><td>2.500</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>60</td></tr>
<tr><td style="text-align:left">2412H</td><td>6.200</td><td>3.100</td><td>0.300</td><td>0.300</td><td>1.100</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2412HH</td><td>6.200</td><td>3.100</td><td>0.300</td><td>0.300</td><td>2.000</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>10</td></tr>
<tr><td style="text-align:left">2413</td><td>6.000</td><td>3.200</td><td>0.400</td><td>0.400</td><td>2.450</td><td>0.000</td><td>2.50</td><td>2.50</td><td></td><td>70</td></tr>
<tr><td style="text-align:left">2420</td><td>6.200</td><td>5.100</td><td>0.500</td><td>0.500</td><td>5.300</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2420S</td><td>6.100</td><td>5.000</td><td>0.500</td><td>0.500</td><td>3.700</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>61</td></tr>
<tr><td style="text-align:left">2423</td><td>6.400</td><td>6.100</td><td>0.600</td><td>0.600</td><td>2.600</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>11</td></tr>
<tr><td style="text-align:left">2423H</td><td>6.400</td><td>5.900</td><td>0.450</td><td>0.450</td><td>2.700</td><td>0.000</td><td>3.70</td><td>3.70</td><td></td><td>11</td></tr>

</table>

<script>
function myFunction() {
  var input1, input2, input3, input6, input8, input9, input10, input11, filter1, filter2, filter3, filter6, filter8, filter9, filter10, filter11, table, tr, td, i, txtValue;
  input1 = document.getElementById("myInput1");
  filter1 = input1.value.toUpperCase();
  input2 = document.getElementById("myInput2");
  filter2 = input2.value.toUpperCase();
  input3 = document.getElementById("myInput3");
  filter3 = input3.value.toUpperCase();
  input6 = document.getElementById("myInput6");
  filter6 = input6.value.toUpperCase();
  input8 = document.getElementById("myInput8");
  filter8 = input8.value.toUpperCase();
  input9 = document.getElementById("myInput9");
  filter9 = input9.value.toUpperCase();
  input10 = document.getElementById("myInput10");
  filter10 = input10.value.toUpperCase();
  input11 = document.getElementById("myInput11");
  filter11 = input11.value.toUpperCase();
  table = document.getElementById("myTable");
  tr = table.getElementsByTagName("tr");
  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[0];
    if (td) {
      txtValue = td.textContent || td.innerText;
      if (txtValue.toUpperCase().indexOf(filter1) > -1) {

		td = tr[i].getElementsByTagName("td")[1];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter2) > -1) {

		td = tr[i].getElementsByTagName("td")[2];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter3) > -1) {

		td = tr[i].getElementsByTagName("td")[5];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter6) > -1) {

		td = tr[i].getElementsByTagName("td")[7];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter8) > -1) {

		td = tr[i].getElementsByTagName("td")[8];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter9) > -1) {

		td = tr[i].getElementsByTagName("td")[9];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter10) > -1) {

		td = tr[i].getElementsByTagName("td")[10];
		if (td) {
		txtValue = td.textContent || td.innerText;
		if (txtValue.toUpperCase().indexOf(filter11) > -1) {
			tr[i].style.display = "";
		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

		} else {
			tr[i].style.display = "none";
			}
		}       

      } else {
        tr[i].style.display = "none";
      }
    }       
  }
}
</script>

</body></html>
PS: It's crucial that this stays in one file!


// Subject adjusted (Kiffi)
Good morning, that's a nice tnetennba!

PureBasic 6.21/Windows 11 x64/Ryzen 7900X/32GB RAM/3TB SSD
Synology DS1821+/DX517, 130.9TB+50.8TB+2TB SSD
User avatar
Kiffi
Addict
Addict
Posts: 1509
Joined: Tue Mar 02, 2004 1:20 pm
Location: Amphibios 9

Re: Anyone firm with JavaScript in HTML?

Post by Kiffi »

jacdelad wrote: Thu Aug 24, 2023 6:07 pmPS: It's crucial that this stays in one file!
Is it allowed to integrate libraries via CDN? If so, I would suggest using the excellent Tabulator library.

Here is a quick draft:

Code: Select all

<html>

  <head>
    <title>Assembly Shape-Liste</title>
  </head>

  <body bgcolor=#FFFFFF>

    <font size="1" color=#3300CC face=Verdana>
      <p style="text-align:center; font-size:40"><b>Assembly Shape-Liste</b></p>
      <p style="text-align:center">Letzte Aktualisierung: <b>24.08.2023 18:56:01</b></p>
      <div id="example-table" style="margin: 20px;"></div>
    </font>

    <link href="https://unpkg.com/tabulator-tables@5.5.0/dist/css/tabulator.min.css" rel="stylesheet">
    <script type="text/javascript" src="https://unpkg.com/tabulator-tables@5.5.0/dist/js/tabulator.min.js"></script>

<script>

var data = `008004;0.250;0.125;0.070;0.070;0.125;0.000;0.19;0.19;;60
01005;0.400;0.200;0.070;0.070;0.100;0.000;0.30;0.30;R047-003-037;60
01005H;0.400;0.200;0.070;0.070;0.200;0.000;0.30;0.30;R047-003-037;60
0201;0.600;0.300;0.100;0.100;0.300;0.000;0.40;0.40;;10
0201R;0.600;0.300;0.100;0.100;0.200;0.000;0.40;0.40;;10
0205;5.300;1.850;0.450;0.450;1.500;0.000;2.50;2.50;;12
0208;6.400;2.000;0.450;0.450;2.000;0.000;2.60;2.60;;12
0209;7.050;2.750;0.300;0.300;2.450;0.000;2.40;2.40;;12
0306;1.500;0.800;0.200;0.200;0.450;0.000;0.70;1.00;;10
0402;1.000;0.500;0.100;0.100;0.300;0.000;0.70;0.70;;10
0402BZ;1.000;0.500;0.100;0.100;0.300;-0.900;0.70;0.70;;10
0402F;1.100;0.550;0.100;0.100;0.300;0.000;0.70;0.70;;60
0402H;1.000;0.500;0.100;0.100;0.450;0.000;0.70;0.70;;10
0402L;1.180;0.680;0.100;0.100;0.500;0.000;0.70;0.70;;10
0402RN;2.000;0.950;0.200;0.200;0.450;0.000;0.70;0.70;;62
0508;1.900;1.300;0.400;0.400;0.600;0.000;1.30;1.30;;10
0603;1.500;0.800;0.200;0.200;0.450;0.000;0.70;1.00;;10
0603_LOT;1.500;0.800;0.200;0.200;0.700;0.000;0.70;1.00;;10
0805_DIO;2.000;1.250;0.400;0.400;0.460;0.000;1.30;1.30;;10
0805_LOT;2.000;1.250;0.400;0.400;0.600;0.000;1.30;1.30;;10
0805RN;2.000;1.200;0.200;0.200;0.400;0.000;1.30;1.30;;62
0806;2.000;1.250;0.400;0.400;0.800;0.000;1.30;1.30;;10
0806RN;2.000;1.250;0.400;0.400;0.800;0.000;1.30;1.30;;10
0808;1.950;1.250;0.300;0.300;1.100;0.000;1.30;1.30;;10
0810;2.000;1.150;0.300;0.300;1.300;0.000;1.30;1.30;;10
0812;2.500;1.250;0.500;0.500;0.800;0.000;1.30;1.30;;10
1008;2.500;2.000;0.300;0.300;1.000;0.000;1.30;1.30;;10
1008H;2.500;1.800;0.300;0.300;1.800;0.000;1.30;1.30;;60
1205;3.200;1.300;0.200;0.200;0.650;0.000;1.30;1.30;;10
1206;3.050;1.550;0.250;0.250;0.700;0.000;1.30;1.30;;10
1206_PAD;2.900;1.800;0.200;0.200;0.300;0.000;1.30;1.30;;10
1206_RR;3.050;1.550;0.250;0.250;0.700;0.000;1.30;1.30;;153
1206H;3.200;1.600;0.300;0.300;1.200;0.000;1.30;1.30;;10
1206H2;3.100;1.550;0.250;0.250;1.550;0.000;1.30;1.30;;10
1206HH;3.200;1.700;0.300;0.300;1.700;0.000;1.30;1.30;;10
1206LN;3.200;1.600;0.200;0.200;0.800;0.000;1.30;1.30;;62
1206R;3.200;1.600;0.200;0.200;0.400;0.000;1.30;1.30;;10
1206R_VIS;3.200;1.600;0.200;0.200;0.400;0.000;1.30;1.30;;70
1206RN;3.200;1.600;0.200;0.200;0.400;0.000;1.30;1.30;;62
1206RN_H;3.000;1.750;0.200;0.200;1.000;0.000;1.30;1.30;;60
1206RX;3.200;1.600;0.200;0.200;0.400;0.000;1.30;1.30;;62
1206S;3.100;1.600;0.200;0.200;1.000;0.000;1.30;1.30;;10
1207;3.200;2.500;0.440;0.440;1.750;0.000;1.30;1.30;;11
1209;3.000;2.200;0.200;0.200;1.300;0.000;1.30;1.30;;10
1209H;3.000;2.200;0.200;0.200;1.950;0.000;1.30;1.30;;10
1210;3.050;2.450;0.300;0.300;0.700;0.000;1.30;1.30;;10
1210H;3.150;2.500;0.300;0.300;1.300;0.000;1.30;1.30;;60
1210H2;3.150;2.500;0.300;0.300;2.000;0.000;1.30;1.30;;61
1210H2_oH12;2.900;2.300;0.300;0.300;1.900;0.000;2.50;2.50;;61
1210HH;3.150;2.500;0.400;0.400;2.400;0.000;1.30;1.30;;61
1210HH_25Noz;3.150;2.500;0.400;0.400;2.400;0.000;2.50;2.50;;61
1210HH_oH12;3.150;2.500;0.400;0.400;2.400;0.000;1.30;1.30;;11
1210R;3.050;2.450;0.300;0.300;0.500;0.000;1.30;1.30;;10
1210S;3.150;2.500;0.300;0.300;1.000;0.000;1.30;1.30;;10
1234;3.000;3.000;0.000;0.000;0.000;0.000;0.00;0.00;;60
1310;3.200;2.500;0.300;0.300;0.400;0.000;1.30;1.30;;11
1406_LOT;3.500;1.500;0.400;0.400;0.800;0.000;1.30;1.30;;10
1410H;3.100;2.600;0.500;0.500;1.900;0.000;2.50;2.50;;11
1411;3.500;2.600;0.500;0.500;1.900;0.000;2.50;2.50;;11
1411H;3.500;2.600;0.500;0.500;2.600;0.000;2.50;2.50;;11
1419;4.900;3.550;0.350;0.350;5.400;0.000;2.50;2.50;;10
1420;3.400;2.500;0.500;0.500;2.500;0.000;2.50;2.50;;10
1420_13Noz;3.000;2.550;0.400;0.400;2.550;0.000;1.30;1.30;;10
1420_oH12;3.400;2.500;0.500;0.500;2.500;0.000;2.50;2.50;;10
15025;38.000;6.500;0.500;0.500;1.000;0.000;3.70;3.70;;10
1513H;3.900;3.300;0.200;0.200;3.700;0.000;2.50;2.50;;62
1515;4.000;3.800;0.200;0.200;2.400;0.000;2.50;2.50;;12
1515S;3.700;3.700;0.200;0.200;1.400;0.000;2.50;2.50;;12
1606RN;4.000;1.550;0.200;0.200;0.400;0.000;1.30;1.30;;62
1608RN;4.050;2.150;0.200;0.200;0.550;0.000;1.30;1.30;;12
1610;4.000;2.500;0.200;0.200;1.600;0.000;1.30;1.30;;12
1610RN;4.000;2.500;0.200;0.200;1.600;0.000;1.30;1.30;;70
1612;4.150;3.100;0.200;0.200;2.200;0.000;2.50;2.50;;10
1612ISA;4.000;3.000;0.200;0.200;1.800;0.000;1.30;1.30;;70
1612S;4.150;3.100;0.200;0.200;1.500;0.000;2.50;2.50;;10
1616;4.000;4.000;0.200;0.200;2.600;0.000;1.30;1.30;;12
1707;3.150;2.440;0.200;0.200;1.450;0.000;1.30;1.30;;10
1712;4.300;3.000;0.350;0.350;1.200;0.000;2.50;2.50;;10
1713;4.400;3.300;0.350;0.350;3.300;0.000;2.50;2.50;;10
1713S;4.400;3.300;0.350;0.350;2.600;0.000;2.50;2.50;;60
1806;4.450;1.600;0.300;0.300;1.600;0.000;1.30;1.30;;10
1806S;4.450;1.650;0.250;0.250;0.900;0.000;1.30;1.30;;10
1808;4.550;2.000;0.250;0.250;0.900;0.000;1.30;1.30;;10
1808H;4.550;2.000;0.250;0.250;1.400;0.000;1.30;1.30;;10
1808H2;4.550;2.000;0.250;0.250;1.800;0.000;1.30;1.30;;10
1808HH;4.550;2.000;0.250;0.250;2.000;0.000;1.30;1.30;;10
1808L;5.000;2.000;0.300;0.300;2.000;0.000;1.30;1.30;;10
1812;4.450;3.150;0.350;0.350;0.950;0.000;2.50;2.50;;10
1812H;4.550;3.200;0.350;0.350;2.050;0.000;2.50;2.50;;10
1812HH;4.550;3.200;0.350;0.350;2.500;0.000;2.50;2.50;;10
1812HH_4KP;4.550;3.200;0.350;0.350;2.500;0.000;2.50;2.50;;10
1812R;4.500;3.150;0.350;0.350;0.500;0.000;2.50;2.50;;60
1812S;4.400;3.200;0.350;0.350;1.600;0.000;2.50;2.50;;10
1812X;4.700;3.150;0.350;0.350;1.500;0.000;2.50;2.50;;10
1812XL;4.850;3.200;0.350;0.350;5.350;0.000;2.50;2.50;;60
1812XXL;4.500;3.100;0.350;0.350;4.500;0.000;2.50;2.50;;60
1813;4.500;3.250;0.350;0.350;1.350;0.000;2.50;2.50;;10
1813H;4.500;3.350;0.350;0.350;2.150;0.000;2.50;2.50;;10
1813HH;4.800;3.350;0.350;0.350;2.700;0.000;2.50;2.50;;185
1813HX;4.800;3.300;0.300;0.300;3.900;0.000;2.50;2.50;;10
1813L;4.800;3.350;0.350;0.350;3.100;0.000;1.30;1.30;;10
1813R;4.900;3.350;0.350;0.350;1.150;0.000;2.50;2.50;;10
1815;4.550;3.850;0.400;0.400;1.400;0.000;2.50;2.50;;11
1817;4.600;4.100;0.400;0.400;1.550;0.000;2.50;2.50;;10
1818H;4.700;4.200;0.400;0.400;2.400;0.000;2.50;2.50;;11
1825;4.600;6.500;0.500;0.500;1.500;0.000;2.50;2.50;;11
1825H;4.700;6.500;0.500;0.500;2.400;0.000;2.50;2.50;;11
1913;4.700;3.350;0.350;0.350;2.000;0.000;2.50;2.50;;10
1926;4.900;6.600;0.350;0.350;2.100;0.000;2.50;2.50;;60
195872100;6.570;2.780;0.500;0.500;2.900;0.000;1.80;1.80;;18
195991100;5.000;2.100;0.500;0.500;2.900;0.000;1.80;1.80;;18
1H;8.000;6.500;0.400;0.400;5.500;0.000;3.70;3.70;;12
1H_S;8.000;6.500;0.400;0.400;4.950;0.000;3.70;3.70;;12
1H_STICK;8.000;6.500;0.400;0.400;5.500;3.500;3.70;3.70;;12
2;10.500;4.450;0.500;0.500;4.500;0.000;3.70;3.70;;100
2010H;5.000;2.520;0.300;0.300;2.100;0.000;2.50;2.50;;11
2010HH;5.000;2.520;0.300;0.300;3.200;0.000;2.50;2.50;;70
2010R;5.000;2.500;0.350;0.350;0.500;0.000;2.50;2.50;;10
2012RN;5.100;3.100;0.350;0.350;0.500;0.000;2.50;2.50;;62
2013;5.000;3.400;0.300;0.300;2.800;0.000;2.50;2.50;;60
2013_ECO;4.568;3.197;0.300;0.300;2.800;0.000;2.50;2.50;;70
2013H;5.100;3.400;0.300;0.300;2.950;0.000;2.50;2.50;;70
2014H;5.150;3.600;0.400;0.400;2.300;0.000;1.30;1.30;;11
2017H;5.200;4.400;0.400;0.400;3.100;0.000;2.50;2.50;;11
2018;5.100;4.550;0.400;0.400;0.950;0.000;2.50;2.50;;11
2019;5.050;4.850;0.400;0.400;2.300;0.000;2.50;2.50;;11
2022;5.000;5.800;0.600;0.600;2.500;0.000;3.70;3.70;;10
2022H;5.100;6.000;0.600;0.600;3.400;0.000;3.70;3.70;;10
2024;5.050;6.150;0.500;0.500;1.050;0.000;2.50;2.50;;10
2025;5.100;6.400;0.500;0.500;1.000;0.000;2.50;2.50;;10
2211;5.700;2.900;0.500;0.500;2.000;0.000;3.70;3.70;;10
2220;5.800;4.900;0.600;0.600;0.900;0.000;3.70;3.70;;10
2220H;5.650;5.000;0.500;0.500;2.400;0.000;3.70;3.70;;10
2220H2;5.800;4.800;0.500;0.500;2.900;0.000;3.70;3.70;;10
2220H3;5.600;5.100;0.500;0.500;5.100;0.000;3.70;3.70;;60
2220H4;6.000;5.300;0.500;0.500;2.850;0.000;3.70;3.70;;60
2220HH;5.800;5.000;0.300;0.300;3.800;0.000;3.70;3.70;;10
2220HL;5.800;5.100;0.400;0.400;3.100;0.000;3.70;3.70;;10
2220HX;6.000;5.100;0.300;0.300;4.500;0.000;3.70;3.70;;10
2220HXL;6.300;5.050;0.300;0.300;6.300;0.000;3.70;3.70;;10
2220L;5.800;4.800;0.600;0.600;1.850;0.000;3.70;3.70;;10
2220S;5.800;4.900;0.600;0.600;1.500;0.000;3.70;3.70;;10
2225;5.650;6.400;0.500;0.500;3.300;0.000;3.70;3.70;;10
2225S;5.650;6.400;0.500;0.500;2.100;0.000;3.70;3.70;;10
2225XS;5.650;6.400;0.500;0.500;1.500;0.000;3.70;3.70;;10
2311;5.800;2.800;0.500;0.500;1.350;0.000;2.50;2.50;;10
2311H;5.900;2.800;0.300;0.300;6.600;0.000;1.30;1.30;;10
2312;5.900;2.900;0.500;0.500;2.500;0.000;2.50;2.50;;10
2406RN;6.400;1.600;0.400;0.400;0.500;0.000;1.30;1.30;;10
2410;6.100;2.550;0.400;0.400;2.550;0.000;1.30;1.30;;10
2410R;6.200;2.600;0.300;0.300;1.000;0.000;1.30;1.30;;10
2411;6.000;3.000;0.400;0.400;2.500;0.000;2.50;2.50;;60
2412H;6.200;3.100;0.300;0.300;1.100;0.000;2.50;2.50;;10
2412HH;6.200;3.100;0.300;0.300;2.000;0.000;2.50;2.50;;10
2413;6.000;3.200;0.400;0.400;2.450;0.000;2.50;2.50;;70
2420;6.200;5.100;0.500;0.500;5.300;0.000;3.70;3.70;;11
2420S;6.100;5.000;0.500;0.500;3.700;0.000;3.70;3.70;;61
2423;6.400;6.100;0.600;0.600;2.600;0.000;3.70;3.70;;11
2423H;6.400;5.900;0.450;0.450;2.700;0.000;3.70;3.70;;11`;

  var tabledata = [];

  var rows = data.split("\n");

  for (var row = 0; row < rows.length; row++) {

    var fields = rows[row].split(";");

    tabledata.push({
      "id": row,
      "AssemblyShape" : fields[0],
      "BodyX": fields[1],
      "BodyY": fields[2],
      "ToleranceX": fields[3],
      "ToleranceY": fields[4],
      "PartHeight": fields[5],
      "OffsetZ": fields[6],
      "MinNozzle": fields[7],
      "MaxNozzle": fields[8],
      "Nozzle": fields[9],
      "VisionType": fields[10],
    });

  }

  var table = new Tabulator("#example-table", {
    data:tabledata, //assign data to table
    layout:"fitColumns", //fit columns to width of table (optional)
    pagination:true, //enable pagination
    paginationSize: 30,
    paginationSizeSelector:[10, 20, 30, 50, 100],
    columns:[ //Define Table Columns
      {title:"AssemblyShape", field:"AssemblyShape", headerFilter:"input", hozAlign:"left"},
      {title:"BodyX", field:"BodyX", headerFilter:"input", hozAlign:"right"},
      {title:"BodyY", field:"BodyY", headerFilter:"input", hozAlign:"right"},
      {title:"ToleranceX", field:"ToleranceX", headerFilter:"input", hozAlign:"right"},
      {title:"ToleranceY", field:"ToleranceY", headerFilter:"input", hozAlign:"right"},
      {title:"PartHeight", field:"PartHeight", headerFilter:"input", hozAlign:"right"},
      {title:"OffsetZ", field:"OffsetZ", headerFilter:"input", hozAlign:"right"},
      {title:"MinNozzle", field:"MinNozzle", headerFilter:"input", hozAlign:"right"},
      {title:"MaxNozzle", field:"MaxNozzle", headerFilter:"input", hozAlign:"right"},
      {title:"Nozzle", field:"Nozzle", headerFilter:"input", hozAlign:"right"},
      {title:"VisionType", field:"VisionType", headerFilter:"input", hozAlign:"right"},
    ],
  });

</script>

</body>

</html>


P.S.: Java <> JavaScript! :wink:
Hygge
User avatar
jacdelad
Addict
Addict
Posts: 2029
Joined: Wed Feb 03, 2021 12:46 pm
Location: Riesa

Re: Anyone firm with JavaScript in HTML?

Post by jacdelad »

Hi Kiffi,
thanks for the code. Unfortunately I will need until tomorrow to test it. I don't know about CDN, but simply testing it will show. I'll let you know tomorrow.
Good morning, that's a nice tnetennba!

PureBasic 6.21/Windows 11 x64/Ryzen 7900X/32GB RAM/3TB SSD
Synology DS1821+/DX517, 130.9TB+50.8TB+2TB SSD
normeus
Enthusiast
Enthusiast
Posts: 475
Joined: Fri Apr 20, 2012 8:09 pm
Contact:

Re: Anyone firm with JavaScript in HTML?

Post by normeus »

I sent you a PM with a couple of changes you can use to make it faster.

If you go Kiffi's route, and CDN does not work, then you can download the 2 tabulator files from https://www.tabulator.info/ ( it's actually one zip file and from there extract "tabulator.min.js" and "tabulator.min.css" ) then include those in your final output

Norm.
google Translate;Makes my jokes fall flat- Fait mes blagues tombent à plat- Machte meine Witze verpuffen- Eh cumpari ci vo sunari
Post Reply