Ankündigung

Einklappen
Keine Ankündigung bisher.

Formular Felder deaktivieren, wenn in CSS Display None steht

Einklappen

Google Anzeige oben

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Formular Felder deaktivieren, wenn in CSS Display None steht

    Hallo zusammen,

    ich programmier zurzeit an einer neuen Seite und Stelle einige Daten tabellarisch dar. Es ist möglich weitere Daten zu dieser Tabelle hinzuzufügen. Das geschieht über normale Input Felder, die anschließend mit PHP verarbeitet werden. Da die Seite auch für mobile Devices kompatibel sein soll, jedoch die Jquery Tabellenfunktion es nicht zufriedenstellend darstellen kann, wollte ich die Tabelle nach meinen Vorstellungen selbst erstellen. Ab einer gewissen Breite, wird die eine oder andere Tabelle angezeigt. Das Ausblenden wird über Display:none erzeugt.

    Jetzt habe ich das Problem, dass natürlich die Input-Felder nicht deaktiviert sind und es beim Speichern auf Fehler läuft . Gibt es eine Möglichkeit mit Javascript oder CSS only, dass alle Input-Fehler, die in einem DIV sind, die mit Display:none gekennzeichnet sind, zu deaktivieren?

    SG
    MasterGee

  • #2
    die Jquery Tabellenfunktion
    Was meinst Du damit? Meinst Du datatables?
    Ab einer gewissen Breite, wird die eine oder andere Tabelle angezeigt. Das Ausblenden wird über Display:none erzeugt.
    Mit einer Mediaquery?
    Jetzt habe ich das Problem, dass natürlich die Input-Felder nicht deaktiviert sind und es beim Speichern auf Fehler läuft ... alle Input-Fehler, die in einem DIV sind, die mit Display:none gekennzeichnet sind, zu deaktivieren?
    Mir fällt da eine ganz andere Lösung ein: Wenn ich dich richtig verstehe, liegen beide Tabellen in einem Formular und es gibt Tabellenzellen, die Inputfelder enthalten? Dann würde ich für jede Tabelle ein eigenes Formular anlegen und das Problem würde sich nicht stellen.

    Kommentar


    • #3
      Jetzt habe ich das Problem, dass natürlich die Input-Felder nicht deaktiviert sind und es beim Speichern auf Fehler läuft . Gibt es eine Möglichkeit mit Javascript oder CSS only, dass alle Input-Fehler, die in einem DIV sind, die mit Display:none gekennzeichnet sind, zu deaktivieren?
      Per CSS kannst Du die nicht deaktivieren, aber per JS auf einfache Weise:
      https://codepen.io/anon/pen/NMEroK
      PHProcks! » Tutorials

      Kommentar


      • #4
        Zitat von Sempervivum Beitrag anzeigen
        Was meinst Du damit? Meinst Du datatables?
        Ja, richtig. JQuery Datatables

        Zitat von Sempervivum Beitrag anzeigen
        Mit einer Mediaquery?
        Ja, richtig.

        Zitat von Sempervivum Beitrag anzeigen
        Mir fällt da eine ganz andere Lösung ein: Wenn ich dich richtig verstehe, liegen beide Tabellen in einem Formular und es gibt Tabellenzellen, die Inputfelder enthalten? Dann würde ich für jede Tabelle ein eigenes Formular anlegen und das Problem würde sich nicht stellen.
        Hmm. Das heißt ganz andere Felderbezeichnungen und den PHP Code für beide Varianten umprogrammieren.

        Kann ich nicht mit Javascript den HTML-Code entfernen, ala If(@mediaquery min-width 800 == active)

        Vielen Dank.



        Kommentar


        • #5
          Ab einer gewissen Breite, wird die eine oder andere Tabelle angezeigt. Das Ausblenden wird über Display:none erzeugt.
          Das verstehe ich so, dass Du ohnehin schon beide Tabellen generierst. Dann brauchst Du doch nur die <form> und </form> Tags etwas umzuorganisieren. So hatte ich es mir vorgestellt:
          HTML-Code:
          <style>
          #form2 {
          display: none;
          }
          @media (max-width: 600px) {
          #form1 {
          display: none;
          }
          #form2 {
          display: flex;
          flex-direction: column;
          }
          }
          </style>
          </head>
          <body>
          <form action="testpost.php" method="post" id="form1">
          <!-- Hier deine erste Tabelle -->
          <h1>Formular 1</h1>
          <input name="input1">
          <input name="input2">
          <input type="submit">
          </form>
          <form action="testpost.php" method="post" id="form2">
          <!-- Hier deine zweite Tabelle -->
          <h1>Formular 2</h1>
          <input name="input1">
          <input name="input2">
          <input type="submit">
          </form>
          (aaaarggh, die Forensoftware verschluckt die Einrückungen)

          Kann ich nicht mit Javascript den HTML-Code entfernen, ala If(@mediaquery min-width 800 == active)
          Das ist eine andere Möglichkeit, die ebenfalls praktikabel ist und an die ich noch nicht gedacht hatte.
          Zuletzt geändert von Sempervivum; 18.05.2018, 19:59.

          Kommentar

          Lädt...
          X