Easy AJAX inline text edit 2.0: CSS ID-Problem lösen

[ezekiel23]

Hallo,

habe ein (hoffentlich) kleines Problem bei der Verwendung von Easy AJAX inline text edit 2.0, allerdings is mir das kleine Problem schon zu groß

Ich lasse mir mehrere <span>'s mit einer for-schleife erstellen (smarty und php). Innerhalb dieser <span>'s lässt sich der Text ja dann prima editieren.
Das Problem is nur, die <span>'s müssen alle von unterschiedlichen ID's sein und ich kann unmöglich für jeden <span> ne eigene CSS-ID anlegen.

Hab mir also überlegt die .js Datei umzuschreiben, dass die <span>'s alle die gleiche ID haben können. Da ich darin noch nicht so gut bin, hoffe ich wir können das Problem zusammen lösen, da sicher auch der ein oder andere schon vor dem gleichem Problem saß (und hat es vielleicht auch gelöst?)

Hier der Code -Ausschnitt aus der .js Datei:

//edit field created
function editBox(actual) {
    //alert(actual.nodeName+' '+changing);
    if(!changing){
        width = widthEl(actual.id) + 20;
        height =heightEl(actual.id) + 2;

        if(height < 40){
            if(width < 100)    width = 150;
            actual.innerHTML = "<input id=\""+ actual.id +"_field\" style=\"width: "+width+"px; height: "+height+"px;\" maxlength=\"254\" type=\"text\" value=\"" + actual.innerHTML + "\" onkeypress=\"return fieldEnter(this,event,'" + actual.id + "')\" onfocus=\"highLight(this);\" onblur=\"noLight(this); return fieldBlur(this,'" + actual.id + "');\" />";
        }else{
            if(width < 70) width = 90;
            if(height < 50) height = 50;
            actual.innerHTML = "<textarea name=\"textarea\" id=\""+ actual.id +"_field\" style=\"width: "+width+"px; height: "+height+"px;\" onfocus=\"highLight(this);\" onblur=\"noLight(this); return fieldBlur(this,'" + actual.id + "');\">" + actual.innerHTML + "</textarea>";
        }
        changing = true;
    }

        actual.firstChild.focus();
}

Vor dem Klick auf die <span>'s:


Nach dem Klick auf die <span>'s:


LG

 

[stroyer]

AW: Easy AJAX inline text edit 2.0: CSS ID-Problem lösen

Mehrere Elmemente, die die gleiche ID haben, sind meines Wissens nach nicht erlaubt (So kann man per javascript zB nur ein Element mit einer ID ansprechen).
Du kannst alle IDs mit einem gemeinsamen Namen beginnen lassen und hinten dran dann eine Zahl anhängen.

Der Codeausschnitt hat damit übrigens nichts zu tun (Der Funktion wird das Objekt und somit auch dessen ID übergeben.) Wichtig wäre hier das Script, welches es aufruft.

 

[ezekiel23]

AW: Easy AJAX inline text edit 2.0: CSS ID-Problem lösen

Danke, das hat schonmal funktioniert. Genau das war auch das Problem, dass eine ID nicht mehrfach vorkommen darf.

 

[stroyer]

AW: Easy AJAX inline text edit 2.0: CSS ID-Problem lösen

Es würde höchstens gehen, wenn du es entweder per name oder class löst.

 

[ezekiel23]

AW: Easy AJAX inline text edit 2.0: CSS ID-Problem lösen

Die class muss "editText" sein.
Die .js Datei such nach <span>'s die eine ID haben und die class="editText".
hier ist übrigens mal die gesamte Datei: instandedit.js

An die IDs ne Zahl anhängen funktioniert schon ganz gut..mal schaun obs später noch mehr Probleme gibt, wenn es darum geht den Inhalt auszulesen und an die DB zu senden