Filterbare html aus Excel VBA

  • HTML

Es gibt 6 Antworten in diesem Thema. Der letzte Beitrag () ist von petaod.

    Filterbare html aus Excel VBA

    Hallo zusammen,

    ich stehe vor folgendem Problem. Ich habe eine .xlsm mit mehreren sheets. Ein Sheet enthält eine Tabelle.

    Ganz einfaches Prinzip:

    Name
    		Vorname
    		Personalnr.
    		Info1
    		Info2
    		Info3
    		usw.
    Mustermann
    		Max
    		123
    		abbcc
    		bbccdd
    		ddeeff
    		gghhjj

    Nun möchte ich dieses Sheet mit der Tabelle gerne als eine html speichern bzw. exportieren. Diese Möglichkeit bietet Office. Allerdings wäre mein Wunsch, dass ich in dieser html im Browser dann nach Name, Vorname oder Personalnummer filtern kann. Ist so etwas machbar, kann mir dabei vielleicht jemand helfen? Ich habe leider keine Programmierkenntnisse außer bissl VBA. VBA reicht aber sicher hier nicht aus.

    In HTML kannst Du nicht einfach Filterfunktion einbauen, dafür benötigt man entweder clientseitig JavaScript oder einen serverseitige Umsetzung da gibt es dann viele Sprachen zur Auswahl.

    Mit VBA kommst Du da definitiv nicht weit.

    PS. Ich hoffe, Du hast bei Deiner Veröffentlichungsstrategie auch den Datenschutz im Blick.
    NB. Es ist doch schön, wenn man lesbare Namen vergibt. Siehe auch [VB.NET] Beispiele für guten und schlechten Code (Stil).

    Hab dir mal ein Beispiel erstellt wie du eine HTML Tabelle mit JS filtern kannst.
    Filtern einer HTML Tabelle

    HTML-Quellcode

    1. <!DOCTYPE html>
    2. <html lang="de">
    3. <head>
    4. <style>
    5. input[type="checkbox"] {
    6. margin:0;
    7. }
    8. #ctrl-wrapper {
    9. padding: .5em 0;
    10. margin-bottom: 1em;
    11. border-bottom: 1px solid black;
    12. }
    13. #ctrl-wrapper > div:first-of-type {
    14. display:grid;
    15. grid-template-columns:1fr auto;
    16. grid-column-gap:4px;
    17. margin-bottom: .25em;
    18. }
    19. table {
    20. border-collapse: collapse;
    21. }
    22. table, th, td {
    23. border: 1px solid #ccc;
    24. }
    25. th {
    26. padding: .25em .5em;
    27. background-color: #eee;
    28. }
    29. td {
    30. padding: .1em .25em;
    31. }
    32. tr:hover {
    33. background-color: #eef;
    34. }
    35. </style>
    36. </head>
    37. <body>
    38. <!-- Controls für die Filterung -->
    39. <div id="ctrl-wrapper">
    40. <div>
    41. <input id="inp-search-pattern" type="text">
    42. <button id="btn-search">Suche</button>
    43. </div>
    44. <div>
    45. <input id="cb-search-in-first-name" type="checkbox">
    46. <label for="cb-search-in-first-name">Vorname</label>
    47. <input id="cb-search-in-last-name" type="checkbox">
    48. <label for="cb-search-in-last-name">Nachname</label>
    49. <input id="cb-search-in-pers-number" type="checkbox">
    50. <label for="cb-search-in-pers-number">Pers. Nummer</label>
    51. </div>
    52. </div>
    54. <!-- Tabelle -->
    55. <table id="tbl-sheet">
    56. <thead>
    57. <tr>
    58. <th>Vorname</th>
    59. <th>Nachname</th>
    60. <th>Pers. Nummer</th>
    61. </tr>
    62. </thead>
    63. <tbody>
    64. <tr>
    65. <td>Max</td>
    66. <td>Mustermann</td>
    67. <td>123456</td>
    68. </tr>
    69. <tr>
    70. <td>Maxima</td>
    71. <td>Musterfrau</td>
    72. <td>654321</td>
    73. </tr>
    74. <tr>
    75. <td>Hanz</td>
    76. <td>Dampf</td>
    77. <td>82465</td>
    78. </tr>
    79. </tbody>
    80. </table>
    82. <!-- JavaScript um in Tabelle zu suchen -->
    83. <script type="text/ecmascript">
    84. window.addEventListener("load", () => {
    85. const searchButton = document.querySelector("#btn-search");
    86. const searchPattern = document.querySelector("#inp-search-pattern");
    87. const cbFirstName = document.querySelector("#cb-search-in-first-name");
    88. const cbLastName = document.querySelector("#cb-search-in-last-name");
    89. const cbPersNumber = document.querySelector("#cb-search-in-pers-number");
    90. searchButton.addEventListener("click", () => {
    91. if (searchPattern.value === "") {
    92. <!-- Alle Zeilen einblenden -->
    93. let hiddenRows = document.querySelectorAll("#tbl-sheet > tbody tr[style*='display: none']");
    94. hiddenRows.forEach(row => { row.style.display=""; })
    95. }
    96. else {
    97. // All zeilen ausblenden
    98. let visibleRows = document.querySelectorAll("#tbl-sheet > tbody tr:not([style*='display: none'])");
    99. visibleRows.forEach(x => { x.style.display="none"; });
    101. if (cbFirstName.checked) {
    102. let entries = document.querySelectorAll("#tbl-sheet > tbody tr td:nth-child(1)");
    103. searchIn(entries, searchPattern.value);
    104. }
    106. if (cbLastName.checked) {
    107. let entries = document.querySelectorAll("#tbl-sheet > tbody tr td:nth-child(2)");
    108. searchIn(entries, searchPattern.value);
    109. }
    111. if (cbPersNumber.checked) {
    112. let entries = document.querySelectorAll("#tbl-sheet > tbody tr td:nth-child(3)");
    113. searchIn(entries, searchPattern.value);
    114. }
    115. }
    116. });
    117. });
    118. function searchIn(entries, pattern) {
    119. if (entries.length < 1 || typeof pattern !== "string" || pattern === "")
    120. return;
    121. entries.forEach(x => {
    122. if (x.innerText.includes(pattern))
    123. x.parentElement.style.display = "";
    124. });
    125. }
    126. </script>
    127. </body>
    128. </html>



    Wie du ein Sheet exportieren kannst wird hier erklärt kann aber nicht bestätigen ob das so klappt. Hab von VBA keine Ahnung.

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von „Fakiz“ ()

Facebook
Telefonspende