Beiträge von ny_unity

ny_unity

Hier, wie es gerade ist:

die Erste Karte könnte doch breiter sein, die ganz hinten könnten doch unter die erste rutschen..

hier der code:

Spoiler anzeigen

Code

  <body>
    <div class="container-fluid" id="dashboard-startseite">
      <div class="card-columns">
        <div class="card bg-primary">
          <div class="card-body text-center">
            <div class="table-responsive">
             <table class="table mb-0">
               <tbody>
                 <tr>
                   <th scope="col">Team</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">XX</th>
                   <th scope="col">&#8721;</th>
                 </tr>
                 <tr>
                   <td>XXX</td>
                   <td>1</td>
                   <td>4</td>
                   <td>4</td>
                   <td>1</td>
                   <td>0</td>
                   <td>1</td>
                   <td>2</td>
                   <td>13</td>
                 </tr>
                 <tr>
                   <td>XXX</td>
                   <td>1</td>
                   <td>5</td>
                   <td>4</td>
                   <td>0</td>
                   <td>0</td>
                   <td>1</td>
                   <td>2</td>
                   <td>13</td>
                 </tr>
                 <tr>
                   <td>XXX</td>
                   <td>1</td>
                   <td>5</td>
                   <td>4</td>
                   <td>0</td>
                   <td>0</td>
                   <td>6</td>
                   <td>0</td>
                   <td>14</td>
                 </tr>
                 <tr>
                  <td>XXX</td>
                  <td>1</td>
                  <td>0</td>
                  <td>0</td>
                  <td>0</td>
                  <td>0</td>
                  <td>0</td>
                  <td>0</td>
                  <td>1</td>
                </tr>
               </tbody>
               <tfoot>
                 <tr>
                  <td>Summe</td>
                  <td>4</td>
                  <td>13</td>
                  <td>11</td>
                  <td>1</td>
                  <td>0</td>
                  <td>8</td>
                  <td>4</td>
                  <td>41</td>
                </tr>
               </tfoot>
             </table>
           </div>
          </div>
        </div>
        <div class="card bg-warning">
          <div class="card-body text-center">
            <div class="table-responsive">
              <table class="table mb-0">
                <thead>
                  <tr>
                    <th scope="col">YY</th>
                    <th scope="col">Anzahl</th>
                    <th scope="col">Anteil</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <tdZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                </tbody>
                <tfoot>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>12</td>
                    <td>8,16%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>147</td>
                    <td>100,00%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>5</td>
                    <td>3,40%</td>
                  </tr>
                  <tr>
                    <td>ZZZ</td>
                    <td>4</td>
                    <td>-2,72%</td>
                  </tr>
                </tfoot>
              </table>
            </div>
          </div>
        </div>
        <div class="card bg-success">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the third card</p>
          </div>
        </div>
        <div class="card bg-danger">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the fourth card</p>
          </div>
        </div>
        <div class="card bg-light">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the fifth card</p>
          </div>
        </div>
        <div class="card bg-info">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the sixth card</p>
          </div>
        </div>
      </div>
    </div>
  </body>

Alles anzeigen

ny_unity

Hallo zusammen,

ich versuche verzweifelt bei Bootstrap mit Cards zu arbeiten, genauer genommen mit card-columns

Von w3 habe ich folgenden Code mir kopiert:

Spoiler anzeigen

Code

<body>
    <div class="container-fluid" id="dashboard-startseite">
      <div class="card-columns">
        <div class="card bg-primary">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the first card</p>
          </div>
        </div>
        <div class="card bg-warning">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the second card</p>
          </div>
        </div>
        <div class="card bg-success">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the third card</p>
          </div>
        </div>
        <div class="card bg-danger">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the fourth card</p>
          </div>
        </div>
        <div class="card bg-light">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the fifth card</p>
          </div>
        </div>
        <div class="card bg-info">
          <div class="card-body text-center">
            <p class="card-text">Some text inside the sixth card</p>
          </div>
        </div>
      </div>
    </div>
  </body>

Alles anzeigen

Das sieht auch gut aus wenn man nicht viel Inhalt hat.

Jetzt möchte ich aber in die Cards responsive Tables reinbekommen, soll eine Art Dashboard werden.

Wenn ich meine responsive Table:

Spoiler anzeigen

Code

<div class="table-responsive">
    <table class="table">
        <thead>
            <tr>
                .....
             </tr>
         </thead>
    </table>
</div>

reinnehme, bleibt die Card auf der Größe, wird nicht größer.

Es sollen quasi die Cards so groß werden wir deren Inhalt, ist der Platz in der Reihe gefüllt mir Cards und deren Größe, dann soll es eine Zeile weiter darunter weiter gehen.

Ich schaffs einfach nicht, hänge zwei Tage dran...

Hat jemand eine Idee?

Danke,

Erik

ny_unity

Hallo zusammen,

mir fehlt gerade der Ansatz, um richtig voranzukommen.

Ich habe im html eine Tabelle, die wird mit javascript auf Basis einer form Eingabe erstellt. Jetzt kann es zwischen 2-16 Spalten geben, deren Inhalt auf ich nun füllen möchte, aber nicht recht weißt wie. Erstmal was ich habe und was es macht:

Tabelle:

Code

<table class="table text-center" id="tabellefuerberechnung">
                    <thead>
                      <tr>
                                            <th scope="col">Wette</th>
                                            <!-- colspan muss angepasst werden auf Basis der Auswahl des Systems, 2 von 3 = 2 Kombinationen-->
                                            <th id="kombianzahl" scope="col">Kombinationen</th>
                                            <th scope="col">Gesamtquote</th>
                                            <th scope="col">Gewinn in €</th>
                      </tr>
                    </thead>
                    <tbody>
                                        <tr>
                        <td></td>
                        <td id="kombi1">1</td>
                        <td id="kombi2">2</td>
                                            <td id="kombi3" class="displayrow">3</td>
                                            <td id="kombi4" class="displayrow">4</td>
                                            <td id="kombi5" class="displayrow">5</td>
                                            <td id="kombi6" class="displayrow">6</td>
                                            <td id="kombi7" class="displayrow">7</td>
                                            <td id="kombi8" class="displayrow">8</td>
                                            <td id="kombi9" class="displayrow">9</td>
                                            <td id="kombi10" class="displayrow">10</td>
                                            <td id="kombi11" class="displayrow">11</td>
                                            <td id="kombi12" class="displayrow">12</td>
                                            <td id="kombi13" class="displayrow">13</td>
                                            <td id="kombi14" class="displayrow">14</td>
                                            <td id="kombi15" class="displayrow">15</td>
                                            <td id ="quote"></td>
                                            <td id="gewinn"></td>
                      </tr>
                                    </tbody>
                                </table>

Alles anzeigen

Code

var counter = 0;
            for (let i = 0; i < anzahlkombination; i++) {
                counter++;
                var table = document.getElementById('tabellefuerberechnung');
                var row = table.insertRow();
                var cell1 = row.insertCell();
                var cell2 = row.insertCell();
                var cell3 = row.insertCell();

                cell1.id = "wette";
                cell1.innerHTML = counter;

                cell2.id = "kombiq1";
                cell2.innerHTML = quote1;
                cell3.id = "kombiq2";
                cell3.innerHTML = quote2;
                
                var kombi = 2;
                for (let j = 0; j < colspanzahl-2; j++) {
                    kombi++;
                    var cell = row.insertCell();
                    cell.id = "kombiq"+kombi;
                    cell.innerHTML = 3;
                    var cell4 = row.insertCell();
                    var cell5 = row.insertCell();
                    cell4.id = "quote";
                    cell4.innerHTML = 4;
                    cell5.id = "gewinn";
                    cell5.innerHTML = 9;
                }
                if(colspanzahl<=2) {
                    var cell4 = row.insertCell();
                    var cell5 = row.insertCell();
                    cell4.id = "quote";
                    cell4.innerHTML = 4;
                    cell5.id = "gewinn";
                    cell5.innerHTML = 9;
                }
            }

Alles anzeigen

Die Variable "anzahlkombination" gibt an, wie viele Kombinationen es gibt, also beispielsweise bei 2 aus 3 sind es 3 Kombinationen (1&2, 1&3 und 2&3). Auf Basis dessen werden die Zeilen (row) erstellt. Die Variable quote1 und quote2 und quote3 sind aus einer Eingabemaske. Jetzt ist die Frage, wie kann ich in row1 es so darstellen, das quote1 mit quote 2, in row2 quote 1 mit quote3 und in row3 dann quote2 mit quote3 dargestellt wird?

Ich vermute ich muss hier eine schleife in eine schleife, aber ich weiß nicht wie ich das in Abhängigkeit mit den Kombinationen mache, hat jemand eine Idee?

Besten Dank!

ny_unity

klappt alles, vielen dank an alle!

schönes WE!

ny_unity

ich hab es ehrlich gesa

Zitat von nextuser

Ansonsten halt z.B. so:

JavaScript

function set_lang(l)
{
    // Hier entweder Sprachdaten laden
    // ...

    // oder Cookie setzen
    document.cookie = "LANG=" + l + "; max-age=86400*30; path=/; domain=DOMAIN_HALT; samesite=lax";
    location.reload();
}

HTML

<div class="col-2 button_flags">
    <input type="image" src="./src/css/images/hu.png" alt="ungarisch" name="parm2" value="ungarisch" id="button-ungarisch" onclick="set_lang('ungarisch')">
</div>

Und dann wie oben im PHP-Skript reagieren.

wie kann ich den cookie dann auslesen und was bedeutet im script domain=DOMAIN_HALT;?

ny_unity

ich rufe ja die übersetzten Wörter beim Aufruf der Seite aus der Datenbank. Es muss ja die Seite neu geladen werden. Der Cookie bringt hier nichts, oder?

Ich möchte im prinzip folgendes:

Klick auf Button England:

Seite neu geladen werden, vorher war http://www.google.de

nach dem Klick soll:

Google

das möchte ich gern

ny_unity

das ist das letzte was mir fehlt, mein button:

Code

<div class="col-2 button_flags">
                            <input type="image" src="./src/css/images/hu.png" alt="ungarisch" name="parm2" value="ungarisch" id="button-ungarisch" onclick="window.location.reload(true)">
                        </div>

dann macht er ?parm2.x=8&parm2.y=6 an die url dran, anstatt ?parm2=ungarisch... wo kommt die.x=8 und .y=6 her? Sind das die Koordinaten wo der Button sich befindet?

würde es wirklich lieber über den refresh lösen

ny_unity

und einfach einen button, der die seite neu lädt und in der url im browser dabei ein parm2=englisch dranhängt?

ny_unity

mit coockies habe ich noch nicht gearbeitet

ny_unity

Hallo zusammen,

ich habe ein kleines Formular gebaut, in dem meine Mitarbeiter die angezeigten Daten/Werte unterschreiben können und ich bekomme diese dann als PDF Datei mit der Unterschrift per E-Mail zugeschickt.

Klappt alles super, auch responsive auf dem Handy/Tablet.

Die Links die die Mitarbeiter bekommen sind alle spezifisch, darin enthalten ist auch die Muttersprache des Mitarbeiters, nicht im Link in der URL, sondern im dahinter liegenden PHP Script, welches die Daten aus einer Datenbank liest und dem Kollegen dann anzeigt.

Beispiel:

Herr Meier bekommt von mir für Juli 2023 den Link zugeschickt. Wenn er diesen Link aufruft, lädt es im Hintergrund die aktuellen Daten für Herrn Meier im Juli 2023, ruft er diese erneut auf, kann es sein die sind aktualisiert. Da Herr Meier als Muttersprache deutsch bei seinen Stammdaten hinterlegt hat, bekommt er die Seite auf deutsch angezeigt. Möchte Herr Meier aber die englische Seite lesen, weil er über Nacht seine Muttersprache verloren hat, kann er auf die englische Flagge klicken und soll dann die Seite auf englisch angezeigt bekommen.

Die Buttons mit den Flaggen habe ich oben links auf der Website in einem eigenen Form eingebunden.

Wichtig ist, es gibt in der Datenbank eine Tabelle, die die ganzen Übersetzungen gespeichert hat und dort abruft, also wenn Muttersprache = deutsch, dann werden aus der Tabelle Uebersetzung die Werte aus der spalte "deutsch" gezogen. Hat der Mitarbeiter aber englisch als Muttersprache, werden beim Seitenaufruf die Werte aus der Spalte "englisch" in der Tabelle Uebersetzung geladen.

Mein Gedanke war, wenn der Mitarbeiter die deutsche Seite geladen hat, er aber auf englisch umschalten will, klickt er oben im Form auf die englische Flagge, die Seite lädt es neu und statt den Paramter sprache aus dem Mitarbeiterstamm, wird die angeklickte Sprache genommen.

Kann ich das so lösen?

MfG

Erik

ny_unity

Hallo zusammen,

ich habe ein kleines HTML Formular gebaut. Dort habe ich auch ein Feld für die Unterschrift.

Code

<div class="container">
                <div class="row abstand">
                    <div class="col-12">
                        <canvas id="signature-pad" width="300" height="auto" name="signature-pad"></canvas>
                    </div>
                </div>
            </div>

Der Javacode dazu habe ich wie folgt:

Code

<script>
            window.addEventListener("DOMContentLoaded", function(event) {
                var canvas = document.getElementById("signature-pad");

                function resizeCanvas() {
                   var ratio = Math.max(window.devicePixelRatio || 1, 1);
                   canvas.width = canvas.offsetWidth * ratio;
                   canvas.height = canvas.offsetHeight * ratio;
                   canvas.getContext("2d").scale(ratio, ratio);
                }
                window.onresize = resizeCanvas;
                resizeCanvas();

                var signaturePad = new SignaturePad(canvas, {
                    backgroundColor: 'rgb(250,250,250)'
                });

                document.getElementById("clear").addEventListener('click', function(){
                    signaturePad.clear();
                })
            });
        </script>

Alles anzeigen

Ich kann die Unterschrift zeichnen und löschen, jetzt möchte ich diese, wenn auf den "Absenden" Button gedrückt wird, dass die Unterschrift als BLOB in meine MySQL Tabelle geschrieben wird.

Kann mir jemand einen Tipp geben wie ich das gezeichnete in meine mysql Tabelle bekomme?

Besten Dank,

Erik

ny_unity

ah okay, hab es mit margin-top -13rem gelöst, da kam das Hauptelement wieder hoch. Frage noch, wenn ich es am Handy ausgeblendet machen möchte aber man es mit klick einblenden kann, also mit so einem Pfeil, hat da jemand nen Tipp?

ny_unity

Hallo zusammen,

ich möchte auf der Website auf der linken Seite am Rand ein Bild (mit Linkweiterleitung) platzieren. Das Bild soll mitgescrollt werden, also sticky. An der richtigen Stelle ist es auch schon, aber das erste Hautpelement in der Mitte wird leider nach unten geschoben.

Welche Einstellung kann ich da nutzen?

Spoiler anzeigen

.sticky{

position:sticky;

top:50px;

left:5px;

width:250px;

height:250px;

background-color:#ffff00;

}

<div class="sticky">sticky</div>

Danke,

Erik

ny_unity

gibt es eine Möglichkeit im noscript herauszufinden, welches Gerät genutzt wird und dann einen device Link zum aktivieren von javascript zu hinterlegen? Also quasi so, dass sich auf dem Gerät die richtigen Einstellungen öffnen?

ny_unity

Danke, schau ich mir die Tage an… mach jetzt Feierabend 😅

ny_unity

JavaScript scheint Standard bei Safari seit einem Update deaktiviert zu sein. Kann ich das beim Laden der Homepage dem User melden? Und auffordern zu aktivieren?

ny_unity

Ja, in meinem Safari war JavaScript aus, warum auch immer 😅

ny_unity

Hat es nicht hochgeladen

habe mehrfach jetzt Cache gelöscht und jetzt gehts… ich danke dir

ny_unity

Ist mein Screenshot lesbar?

ny_unity

Sah am PC anders aus

Beiträge von ny_unity

Bootstrap Cards - Wrap und Cardgröße

Bootstrap Cards - Wrap und Cardgröße

Schleife erstellen von Zellen mit dynamischen Inhalt

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

Button Value merken und Seite neu laden

bootstrap canvas Unterschrift in MySQL speichern

Sticky Box an der linken Seite

Sticky Box an der linken Seite

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen

Bilder verschiedener Größen gleich darstellen