Probleme mit JavaScript/DOM und Tabelle

Diskutiere mit über: Probleme mit JavaScript/DOM und Tabelle im Web-Programmierung Forum

  1. balufreak

    balufreak Thread Starter MacUser Mitglied

    Beiträge:
    1.560
    Zustimmungen:
    28
    Registriert seit:
    12.10.2003
    Hallo allerseits!

    Habe wiedereinmal ein Problem. Ich habe Folgendes.

    Ein Formular, wo ich einen Artikel und die Anzahl festlegen kann. Wenn ich auf Hinzufügen klicke, soll es mir das in eine Tabelle unterhalb reinschreiben. Das habe ich mit Javascript realisiert und sieht folgendermassen aus:
    Code:
      function addArticle() {
      	
      	var actualCount = document.getElementById('articleListRows').value;
        actualCount++;
      	document.getElementById('articleListRows').value = actualCount;
    
      	
      	var articleId = document.getElementById('articleId').value;
      	var articleCount = document.getElementById('articleCount').value;
      	var articleName = document.getElementById('article').value;
      	
      	var articleList = document.getElementById('articleList');
      	var aRow = document.createElement('tr');
      	var _articleId = document.createElement('td');
      	var _articleName = document.createElement('td');
      	var _articleCount = document.createElement('td');
      	var _options = document.createElement('td');
      	
        aRow.id = actualCount;
      	
      	_articleId.innerHTML = articleId;
      	aRow.appendChild(_articleId);
      	
      	_articleName.innerHTML = articleName;
      	aRow.appendChild(_articleName);
      	
      	_articleCount.innerHTML = articleCount;
      	aRow.appendChild(_articleCount);
      	
      	var link = "<a href=\"#\" onClick=\"removeArticle('" + actualCount + "')\">L&ouml;schen</a>";
      	_options.innerHTML = link;
      	aRow.appendChild(_options);
      	
      	articleList.appendChild(aRow);
      	
      }
    Das funktioniert auch wunderbar. Es gibt bei mir immer schön eine neue Zeile.
    In jeder Zeile, habe ich einen Link mit der ZeilenId. Wenn ich diesen klicke, soll die zeile gelöscht werden. Und hier ist mein Problem. Es will einfach nicht funktionieren.
    hab schon folgendes Probiert
    Code:
      function removeArticle(rowId) {
        var articleList = document.getElementById('articleList');
        articleList.deleteRow(rowId);
      }
    
    Das funktioniert nur mit der ersten Zeile (rowId = 0)! Mit den dynamisch hinzugefügten Zeilen funktioniert das nicht. :( Ich weiss echt nicht mehr weiter. Könnt ihr mir da helfen?

    achso die tabelle sieht am anfang so aus, wenn sie leer ist:
    Code:
    <table id="articleList" class="last5billings" cellspacing="0" cellpadding="0" border="0" width="98%">
    <tr>
    <th>Artikel-Nr:</th>
    <th>Artikel</th>
    <th>Anzahl</th>
    <th>&nbsp;</th>
    </tr>
    </table>
    
     
  2. Manjo

    Manjo MacUser Mitglied

    Beiträge:
    903
    Zustimmungen:
    22
    Registriert seit:
    25.07.2005
    Gib mal einen Link zur kompletten Seite!
     
  3. balufreak

    balufreak Thread Starter MacUser Mitglied

    Beiträge:
    1.560
    Zustimmungen:
    28
    Registriert seit:
    12.10.2003
    öhm das geht nicht. Ich verwende einige Frameworks, und bis ich diese alle bei meinem Hoster installiert habe... Die applikation soll am schluss nur lokal laufen.

    Aber im Prinzip hast du ja alles was du brauchst.
     
  4. Manjo

    Manjo MacUser Mitglied

    Beiträge:
    903
    Zustimmungen:
    22
    Registriert seit:
    25.07.2005
    HTML:
    function removeArticle(rowId) {
        var aRow = document.getElementById(rowId);
        aRow.parentNode.removeChild(aRow);
      }
    ansonsten probiere mal das! Du solltest vielleicht der ID einen besseren Namen als nur eine Nummer geben aRow.id = 'row_' + actualCount; und dann enstprechend var link = "<a href=\"#\" onClick=\"removeArticle('row_" + actualCount + "')\">L&ouml;schen</a>";

    Ich habe etwas zum Thema deleteRow und Performance gefunden. Wenn Dich das interessiert:
    http://www.oreillynet.com/pub/a/javascript/2003/05/06/dannygoodman.html
     
  5. balufreak

    balufreak Thread Starter MacUser Mitglied

    Beiträge:
    1.560
    Zustimmungen:
    28
    Registriert seit:
    12.10.2003
    dankevielmals! mit dieser funktion funktionierts.
    Das mit der ID habe ich schon geändert. Aber danke für den Tipp!

    Wegen der Performance, ich werde mir das mal zu herzen nehmen, wenn ich zeit habe. danke!
     
Die Seite wird geladen...
Ähnliche Themen - Probleme JavaScript DOM Forum Datum
Ich verzweifel! Vorher iWeb jetzt Typo3. Probleme Verlinkung Startseite Web-Programmierung 16.05.2011
Probleme mit mySQL Update Funktion Web-Programmierung 22.03.2011
Probleme mit HTACCESS Web-Programmierung 31.08.2010
Shop Probleme ... php Web-Programmierung 29.05.2010
Joomla Navi-Probleme Web-Programmierung 18.01.2010

Diese Seite empfehlen

Benutzerdefinierte Suche