ursus contionabundo: Formular über die gesamte Tabelle hinweg

Beitrag lesen

Das Formular über die gesamte Tabelle hinweg hat aber Vorteile:

Bevor die Frage kommt: Ja. Dass ist ein "Schnellschrieb" für diesen Thread.

<!DOCTYPE html>
<html>
	<head>
		<title>Table - Multiform</title>
		<style>
		.jsOnly_inline { display:none; }
		</style>
	</head>
	<body>
		<form method="POST" action="https://home.fastix.org/phpinfo.php#_POST">
		  <button type="button" class="jsOnly_inline" name="selectAll" id="selectAll"  value="1">Alle auswählen</button>
		  <button name="deleteSelected" id="deleteSelected" value="1">Gewählte Löschen</button>
		  <table>
			<tr>
			  <td>
				<input class="MultiSelectors" name="selector[1]" type="checkbox" id="selections[1">
			  </td>
			  <td>
				Daten 1
			  </td>
			  <td>
				<button name="edit"   value="1">edit</button>
				<button name="delete" value="1">delete</button>			  
			  </td>
			</tr>
			<tr>
			  <td>
				<input class="MultiSelectors" name="selector[2]" type="checkbox" name=""  id="selections[2]">
			  </td>
			  <td>
				Daten 2
			  </td>
			  <td>
				<button name="edit"   value="2">edit</button>
				<button name="delete" value="2">delete</button>			  
			  </td>
			</tr>
		  </table>
		</form>
		<script>
			var ar = document.getElementsByClassName('jsOnly_inline');
			for (var i = 0; i < ar.length; i++) {
			   ar[i].style.display="inline"
			}
			
			function selectAllMultiSelectors() {
				var ar = document.getElementsByClassName('MultiSelectors');
				for (var i = 0; i < ar.length; i++) {
				   ar[i].checked=true;
				}
				var o = document.getElementById('selectAll');
				o.removeEventListener("click", selectAllMultiSelectors, true );
				o.addEventListener("click", unSelectAllMultiSelectors, true );	
				o.innerHTML="Auswahl aufheben";		
			}
			
			function unSelectAllMultiSelectors() {
				var ar = document.getElementsByClassName('MultiSelectors');
				for (var i = 0; i < ar.length; i++) {
				   ar[i].checked=false;
				}
				var o = document.getElementById('selectAll');
				o.removeEventListener("click", unSelectAllMultiSelectors, true );	
				o.addEventListener("click", selectAllMultiSelectors, true );
				o.innerHTML="alle auswählen";	
			}			
			
			var o = document.getElementById('selectAll');
			o.addEventListener("click", selectAllMultiSelectors, true );
		</script>
	</body>
</html>

Test

0 47

Verstecken von HTML Formularen für das einfache bedinen administrativer Funktionen

MB
  • formulare
  • html
  • php
  1. 0
    Matthias Apsel
    1. 0
      pl
      1. 1
        Matthias Apsel
        • sonstiges
      2. 0
        dedlfix
        1. -2
          pl
  2. -1
    pl
  3. 0

    Formular über die gesamte Tabelle hinweg

    ursus contionabundo
    1. 0
      pl
      1. 0
        ursus contionabundo
        1. 0
          pl
          1. 1
            ursus contionabundo
            1. 0
              pl
              1. 1
                ursus contionabundo
                1. 0
                  pl
              2. 0
                pl
      2. 0
        dedlfix
        1. 0
          pl
          1. 0
            dedlfix
            1. 0
              pl
              1. 0
                dedlfix
                1. 0
                  pl
                  1. 0
                    dedlfix
                    1. 0
                      pl
    2. 0
      Rolf B
      1. 0
        Gunnar Bittersmann
        • html
        • javascript
    3. 0

      Frage betreffs Aria-Label oder Aria Alert

      ursus contionabundo
      1. 0
        Rolf B
        1. 0
          ursus contionabundo
  4. 0
    MB
    1. -1
      pl
      1. 0
        dedlfix
      2. 0
        pl
        1. 0
          dedlfix
        2. 0
          pl
      3. 0
        pl
    2. 1
      dedlfix
      1. 1
        dedlfix
        1. 0
          MB
    3. 3
      Rolf B
      1. 0
        pl
        1. 0
          Rolf B
          1. 0
            pl
            1. 0
              Gunnar Bittersmann
            2. 0
              pl
              1. 0
                Gunnar Bittersmann
                • formulare
                • progressive enhancement
                1. 0
                  pl