Ereignis ausführen nur auf gezeigter Tabellenzeile

gianfranco0104 · 25. August 2014

schon getestet, will einfach nicht.

Javascript:

var canvas = document.getElementById('expTable').getElementsByTagName('tr');

.

die Tabelle wird in einer anderen Function so erzeugt.

Java:

...
result +=
                '<TR' + ( ( toggle ) ? '' : '' ) + '>' +
                '<TD NOWRAP> <div id="folder" ' +
                'onClick="subFolder( \'' + escape( folder.Path ) + '\' ); return false;">' +
                '<span  CLASS="contentname">' + folder.name  + '</span>'+
                '</div>  </TD>' +
                '<TD NOWRAP><span CLASS="exptitles" > ' + folderDate + ' </span></TD>' +
                    '<TD NOWRAP  align="right"><span CLASS="exptitles" align="right"> ' +
                    toMetric( folder.size ) + '&nbsp; </span></TD></TR>';

...

result =
  '<TABLE id="expTable" class="expTable" WIDTH="100%" CELLPADDING="0"><TR>' +
  '<TD WIDTH="50%" CLASS="find"><b>&nbsp; </b></TD>' +
  '<TD WIDTH="5%" CLASS="exptitles"><b>&nbsp; </b></TD>' +
  '<TD WIDTH="3%" CLASS="exptitles" align="right"><b>&nbsp; </b></TD></TR>';

  // Sammle gültige Dateinamen
  FindFile( fso.GetFolder( frmSearch.txtPath.value ) );
  // Tabelle schließen
  explorerContents.innerHTML = result + "</TABLE>";
...

Parantatatam · 25. August 2014

Magst Du einfach mal mit uns teilen, wie der Quelltext der generierten Tabelle aussieht? Ich bin außerdem von zwei Sachen verwirrt: einerseits, dass Du jQuery nutzt, aber für die DOM-Manipulation trotzdem die Build-In-Methoden nutzt, andererseits, dass Du Deine Tabelle "canvas" nennst, obwohl "canvas" in JavaScript eine andere Bedeutung hat. Ist nicht schlimm, aber es verwirrt.

SpiceLab · 25. August 2014

@gianfranco0104 Als kleiner Zwischenstand: Mit einem heruntergebrochenen Testfile kann ich dir zustimmen, dass (eine) JS-Funktion ausschließlich dann greift, wenn das <tr>-Element einen ID-Bezeichner besitzt, und über die getElementByID()-Methode selektiert wird; getElementsByTagName() u. getElementsByClassName() führen hier ins Leere.

gianfranco0104 · 25. August 2014

Hi, nun CANVAS kam noch von einer anderen Aktion - wollte sie noch umbenennen, ist auch erl. "tabRow".
Wie dem auch sei. Der gesamte Code:
Aus einer Form beziehe ich einen Ordnerpfad, hier werden die Ordner und Dateien erkannt (eine Art eigener Explorer).

Javascript:

var fso = new ActiveXObject( "Scripting.FileSystemObject" );
var result = new String( );
var FileName = new String( );
var Extention = new String( );
var theProjPath = (pathToMyDocuments +  "\\CM5Projects\\");
var allThepathsFIX = null

// Wandle (bytes, KB, MB, GB oder TB).
function toMetric( bytes ) {

    // Check Terabytes (TB).
    if( bytes >= 1099511627776 ) { return ( Math.floor( bytes / 1099511627776 ) + ' TB' ); }

    // Check  Gigabytes (GB).
    if( bytes >= 1073741824 ) { return ( Math.floor( bytes / 1073741824 ) + ' GB' ); }

    // Check  Megabytes (MB).
    if( bytes >= 1048576 ) { return ( Math.floor( bytes / 1048576 ) + ' MB' ); }

    // Check  Kilobytes (KB).
    if( bytes >= 1024 ) { return ( Math.floor( bytes / 1024 ) + ' KB' ); }

    // Wenn weniger als 1 KB, zeige nur 1 KB.
    return '1 KB';
}


// Zeige Inhalt wenn auf sub-folder geklickt
function subFolder( path ) {
  
    // Update den txtPath.
    frmSearch.txtPath.value = unescape( path );
  
    var pathcomplstring = path.replace(/%5C/g, ","); // Pfad trenner durch Komma ersetzen für besseres Splitting
  
    // vor > vor > vor > vorletzter Pfad
    var pathsrt02 = pathcomplstring.split(',', 1000); //1000 = max. mögl. verschachtelte Unterordner
    for (var i=0; i<pathsrt02.length -4; i++) {
                  thePath02 = "";
                  thePath02 +=  pathsrt02[i];
    }
    // vor > vor > vorletzter Pfad
    var pathsrt03 = pathcomplstring.split(',', 1000);
    for (var i=0; i<pathsrt03.length -3; i++) {
                  thePath03 = "";
                  thePath03 +=  pathsrt03[i];
    }
    // vor > vorletzter Pfad
    var pathsrt04 = pathcomplstring.split(',', 1000);
    for (var i=0; i<pathsrt04.length -2; i++) {
                  thePath04 = "";
                  thePath04 +=  pathsrt04[i];
    }
    // vorletzter Pfad
    var pathsrt05 = pathcomplstring.split(',', 1000);
    for (var i=0; i<pathsrt05.length -1; i++) {
                  thePath05 = "";
                  thePath05 +=  pathsrt05[i];
    }
    // Letzter Pfad
    var pathsrt06 = pathcomplstring.split(',', 1000);
    for (var i=0; i<pathsrt06.length; i++) {
                  thePath06 = "";
                  thePath06 +=  pathsrt06[i];
    }
   
    //Füge Pfade zusammen "rsaquo;" ist kleineres ">"-Zeichen
    var allThepaths = " &rsaquo; " +  "..." + thePath02 +
                      " &rsaquo; " + thePath03 +
                      " &rsaquo; " + thePath04 +
                      " &rsaquo; " + thePath05 +
                      " &rsaquo; " + thePath06 ;
  
    //Alle Pfade ab CM5Projects >> zeigen
    allThepathsFIX = allThepaths.substring(allThepaths.lastIndexOf("CM5Projects") + 11);
    // UmlautFix
    allThepathsFIX = allThepathsFIX.replace(/%C4/g, "Ä");
    allThepathsFIX = allThepathsFIX.replace(/%E4/g, "ä");
    allThepathsFIX = allThepathsFIX.replace(/%DC/g, "Ü");
    allThepathsFIX = allThepathsFIX.replace(/%FC/g, "ü");
    allThepathsFIX = allThepathsFIX.replace(/%D6/g, "Ö");
    allThepathsFIX = allThepathsFIX.replace(/%F6/g, "ö");
    allThepathsFIX = allThepathsFIX.replace(/%21/g, "!");
    allThepathsFIX = allThepathsFIX.replace(/%23/g, "#");  
    allThepathsFIX = allThepathsFIX.replace(/%A7/g, "§");
    allThepathsFIX = allThepathsFIX.replace(/%24/g, "$");  
    allThepathsFIX = allThepathsFIX.replace(/%25/g, "%");  
    allThepathsFIX = allThepathsFIX.replace(/%26/g, "&");
    allThepathsFIX = allThepathsFIX.replace(/%28/g, "(");
    allThepathsFIX = allThepathsFIX.replace(/%29/g, ")");
    allThepathsFIX = allThepathsFIX.replace(/%3D/g, "=");
    allThepathsFIX = allThepathsFIX.replace(/%26/g, "&");
    allThepathsFIX = allThepathsFIX.replace(/%2C/g, ",");
    //Anzeigen
    document.getElementById("pathstring").innerHTML = allThepathsFIX.replace(/%20/g, " ");
  
    // Neue Suche im neuen Ordner.
    scan( );
}

// Scan der Pfade.
function FindFile( searchPath ) {

    // Tabellenfarbe aktivieren.
    var toggle = true;

    // chkShowFolders ist checked, Unterordner anzeigen
    if( frmSearch.chkShowFolders.checked ) {

        // Check ob  Projektfolder (ROOT) ist.
        if( fso.GetParentFolderName( frmSearch.txtPath.value ).length > 39 ) { //39 war hier die höhe des Rootsfolders (Projekte)
            MM_changeProp('folderUP','','visibility','visible',''); //UP Folder zeigen wenn außerhalb von root

            // Hinzufügen des Zurück-Folders zur Tabelle.
            result += '<A HREF="#" onClick=" subFolder( \'' + escape( fso.GetParentFolderName( frmSearch.txtPath.value ) ) + '\' ); return false;"></A>'
            // Setzen der Colortoggle variable
            toggle = !toggle;
          
        } else { MM_changeProp('folderUP','','visibility','hidden',''); } //UP Folder verstecken wenn in root


        // Ordner zu Ordner aktionen
        var folderEnum = new Enumerator( searchPath.SubFolders );
        for( var i = 0; !folderEnum.atEnd( ); folderEnum.moveNext( ) ) {
            var folder = folderEnum.item( );
          
            //Ordnerdatum Deklarieren
            var folderDate = folder.DateLastAccessed;
            var folderYear = new Date(folderDate).getFullYear()
                // MonatsFix>> problem mit dem Datum, es wird immer eins abgezogen:
                //          >> hier setze ich es wieder drauf. Test ob bei Sommerzeit/Winterzeit wieder normal
                var folderMonthErr = ('0' + new Date(folderDate).getMonth()).substr(-2)
                var folderMonthN = parseInt(folderMonthErr) +1
                // ENDE MonatsFix <<
            var folderMonth = ('0' + folderMonthN).substr(-2)
            var folderDay = ('0' + new Date(folderDate).getDate()).substr(-2)
            folderDate = " &nbsp; " + folderYear + "." + folderMonth + "." + folderDay
          
            // Hinzufügen der Ordner Zur Tabelle.
            result +=
                '<TR' + ( ( toggle ) ? '' : '' ) + '>' +
                '<TD NOWRAP> <div id="folder" ' +
                'onClick="subFolder( \'' + escape( folder.Path ) + '\' ); return false;">' +
                '<span  CLASS="contentname">' + folder.name  + '</span>'+
                '</div>  </TD>' +
                '<TD NOWRAP><span CLASS="exptitles" > ' + folderDate + ' </span></TD>' +
                    '<TD NOWRAP  align="right"><span CLASS="exptitles" align="right"> ' +
                    toMetric( folder.size ) + '&nbsp; </span></TD></TR>';

            // Setzen der Colortoggle variable
            toggle = !toggle;
        }
    }

    // Dateien zu Dateien der Ordnerinhalte Aktionen.
    var fileEnum = new Enumerator( searchPath.Files );
    for( var i = 0; !fileEnum.atEnd( ); fileEnum.moveNext( ) ) {
        var file = fileEnum.item( );
        // Vergleiche Datei mit Filenameparameter.
        if( FileName == "*" || file.name.slice( 0, file.name.lastIndexOf( "." ) ).toLowerCase( ).indexOf( FileName ) > -1 ) {

            // Vergleiche DateiSuffix
            if( Extention == "*" || file.name.slice( file.name.lastIndexOf( "." ) + 1 ).toLowerCase( ).indexOf( Extention ) > -1 ) {

                //File Datum Deklarieren
                var proectDate = file.DateLastAccessed;
                var proectYear = new Date(proectDate).getFullYear()
                    // MonatsFix>> problem mit dem Datum, es wird immer eins abgezogen:
                    //          >> hier setze ich es wieder drauf. Test ob bei Sommerzeit/Winterzeit wieder normal
                    var proectMonthErr = ('0' + new Date(proectDate).getMonth()).substr(-2)
                    var proectMonthN = parseInt(proectMonthErr) +1
                    // ENDE MonatsFix <<
                var proectMonth = ('0' + proectMonthN).substr(-2)
                var proectDay = ('0' + new Date(proectDate).getDate()).substr(-2)
                proectDate = " &nbsp; " + proectYear + "." + proectMonth + "." + proectDay
              
                // Füge Datei der Tabelle hinzu
                result +=
                    '<TR' + ( ( toggle ) ? '' : ' ' ) + '>' +
                    '<TD NOWRAP><div id="file" <A TARGET="_blank" HREF="' +
                    file.Path + '">' +
                    '<span  CLASS="contentname"> ' + file.name + '</span>' +
                    '</A> </div></TD>' +
                    '<TD NOWRAP><span CLASS="exptitles" > ' + proectDate + ' </span></TD>' +
                    '<TD NOWRAP  align="right"><span CLASS="exptitles" align="right"> ' +
                    toMetric( file.size ) + '&nbsp; </span></TD></TR>';

                // Setzen der Colortoggle variable
                toggle = !toggle;
            }
        }
    }
}



// Überprüfen und Vergleichen der der Pfade und Dateinamen und initiiert den Dateiscan.
function scan( ) {

    // Parse den Dateinamen und Suffix
    FileName = ( frmSearch.txtMask.value.lastIndexOf( "." ) > -1 ) ? frmSearch.txtMask.value.slice( 0, frmSearch.txtMask.value.lastIndexOf( "." ) ) : ( frmSearch.txtMask.value.length > 0 ) ? frmSearch.txtMask.value.toLowerCase( ) : "*";
    Extention = ( frmSearch.txtMask.value.lastIndexOf( "." ) > -1 ) ? frmSearch.txtMask.value.slice( frmSearch.txtMask.value.lastIndexOf( "." ) + 1 ).toLowerCase( ) : "*";

    // Vergleichen erhaltenen Pfad
    if( frmSearch.txtPath.value.length > 0 && fso.FolderExists( frmSearch.txtPath.value ) ) {

        // Wenn Pfad Exisiiert Erstelle Tabellenkopf
        result =
            '<TABLE id="expTable" class="expTable" WIDTH="100%" CELLPADDING="0"><TR>' +
            '<TD WIDTH="50%" CLASS="find"><b>&nbsp; </b></TD>' +
            '<TD WIDTH="5%" CLASS="exptitles"><b>&nbsp; </b></TD>' +
            '<TD WIDTH="3%" CLASS="exptitles" align="right"><b>&nbsp; </b></TD></TR>';


        // Sammle gültige Dateinamen
        FindFile( fso.GetFolder( frmSearch.txtPath.value ) );
        // Tabelle schließen
        explorerContents.innerHTML = result + "</TABLE>";
    } else {

        // Probleme mit dem Pfad
        alert( "The path structure is incorrect. Please check the path structure. n\If it's correct try again or contact KC-Produkte Gmbh." );
    }
}

Dann die CSS (wie oben)
und eben meine Funktion um die Tabellenzeile via langem Drücken, bzw. langer Fingertab.
Wo jetzt noch alert('erkannt') steht, wird ein Menüerzeugt, welcher mir die Möglichkeit bietet die Datei zu öffnen, kopieren usw...

also beim durchlesen anderer Foren müsste eigentlich das mit
>> document.getElementById('expTable').getElementsByTagName('tr'); <<
funktionieren, leider bei mir nicht. Wenn ich andere Elemente anspreche klappt es. Komisch

Ereignis ausführen nur auf gezeigter Tabellenzeile

gianfranco0104

Erfahrenes Mitglied

Parantatatam

mag Cookies & Kekse

SpiceLab

ZENmechanic

gianfranco0104

Erfahrenes Mitglied

Neue Beiträge