phoenixjunge: hide/show button mit variablem text

Hallo zusammen,

ich weiß nicht genau in welche Kategorie das passt, deswegen pack ichs einfach mal hier rein, kann ja ggf. verschoben werden.

Ich habe folgendes "Problem":

Ich möchte in einem Forum mittels BBCode einen Hide/Show Button einfügen, der a) einen Standard-Buttontext und b) bei Bedarf einen variablen Buttontext hat.

Also als Beispiel:

der bbcode soll so aussehen: [spoiler=var1]var2[/spoiler]

soll heißen: wenn var1 = [keine Eingabe] dann soll der Text im Button = "Spoiler" sein
ansonsten soll der Text im Button = var1 sein.

das script sieht bisher so aus und funktioniert problemlos:

<table>
<td>
<div class="tabletitle">
    <input  type="button"
        value='Spoiler'

style="width:65px; font-size:10px; margin:0px; padding:0px;"
        onclick="
            if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '')
            {
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
                this.innerText = '';
                this.value = 'Verstecken';
            }
            else
            {
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
                this.innerText = '';
                this.value = 'Spoiler';
            }"/>
</div>
<div class="inposttable"><normalfont>
    <div style="display: none;">
        {param1}
    </div>
</div>
</td>
</table>

Gibt es da eine - am besten einfach umzusetzende - Möglichkeit? Oder muss ich dafür das ganze Script umkrempeln?

Vielen Dank im Voraus für die Mühen.

der phoenixjunge

  1. Hi,

    ich weiß nicht genau in welche Kategorie das passt, deswegen pack ichs einfach mal hier rein, kann ja ggf. verschoben werden.

    Kommt wohl darauf an, welche serverseitige Sprache du benutzt. Ausser editierst du das Javascript jedesmal per Hand.

    Also als Beispiel:

    der bbcode soll so aussehen: [spoiler=var1]var2[/spoiler]

    soll heißen: wenn var1 = [keine Eingabe] dann soll der Text im Button = "Spoiler" sein
    ansonsten soll der Text im Button = var1 sein.

    Also hat jeder Button immer den gleichen Text. Diesen solltest du ihm zuweisen, bevor du den HTML-Code an den Browser schickst, sprich in PHP, Perl, ...

    das script sieht bisher so aus und funktioniert problemlos:

    Wie wird dieses Script erzeugt? Die Beschriftung sollte eigentlich Hier im HTML-Quellcode schon richtig drinstehen.

    <table>

    Hier fehlt tr.

    <td>
    <div class="tabletitle">
        <input  type="button"
            value='Spoiler'

    style="width:65px; font-size:10px; margin:0px; padding:0px;"
            onclick="
                if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '')
                {
                    this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
                    this.innerText = '';

    Was willst du damit erreichen? Bei input mit type=button wird doch der Value und nicht der innerText angezeigt.
    Ausserdem machst du im if- und else-Teil das gleiche.

    this.value = 'Verstecken';
                }
                else
                {
                    this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
                    this.innerText = '';
                    this.value = 'Spoiler';
                }"/>
    </div>
    <div class="inposttable"><normalfont>

    Was ist <normalfont>? Das gehoert da wohl weg?

    <div style="display: none;">
            {param1}
        </div>
    </div>
    </td>
    </table>

    Gibt es da eine - am besten einfach umzusetzende - Möglichkeit? Oder muss ich dafür das ganze Script umkrempeln?

    Du musst das Script, das dieses Javascript erzeugt, abaendern.

    mfG,
    steckl

    1. Kommt wohl darauf an, welche serverseitige Sprache du benutzt. Ausser editierst du das Javascript jedesmal per Hand.

      Dazu sollte ich wohl sagen, dass es sich um so ein typisches vorprogrammiertes Bulletin Board handelt, welches mit Templates arbeitet. Ich hab erst vor kurzem damit begonnen, mich mit den ganzen Funktionen und der Programmierung auseinander zu setzen. Das ganze läuft über php. Der bbcode wird über die bbcode.js gesteuert/definiert (verzeih meine laienhafte Ausdrucksweise, aber ich stecke - wie gesagt  - noch in den Kinderschuhen was so Programmierung angeht).

      Also hat jeder Button immer den gleichen Text. Diesen solltest du ihm zuweisen, bevor du den HTML-Code an den Browser schickst, sprich in PHP, Perl, ...

      Ayayay. Das wird noch ein Spaß, ich sehs schon kommen. Komme wohl nicht drum rum, mich intensiver mit php zu beschäftigen.

      das script sieht bisher so aus und funktioniert problemlos:

      Wie wird dieses Script erzeugt? Die Beschriftung sollte eigentlich Hier im HTML-Quellcode schon richtig drinstehen.

      Ich vermute du meinst die bbcode.js? Wie gesagt, das Forum arbeitet mit Templates, da muss ich normalerweise nix mehr definieren.

      <table>
      Hier fehlt tr.
      <td>
      <div class="tabletitle">
          <input  type="button"
              value='Spoiler'

      style="width:65px; font-size:10px; margin:0px; padding:0px;"
              onclick="
                  if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '')
                  {
                      this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
                      this.innerText = '';
      Was willst du damit erreichen? Bei input mit type=button wird doch der Value und nicht der innerText angezeigt.
      Ausserdem machst du im if- und else-Teil das gleiche.

      Das ganze soll einen Text verstecken und erst auf Buttonclick sichtbar machen. Und wenn man dann wieder auf den Button clickt, soll der Text wieder versteckt werden.
      Hier muss ich gestehen, dass ich mir den Code aus einem anderen Forum "geklaut" hab. Ich hab auch schon versucht mir das ganze ein bisschen anzulesen, damit ich verstehe, was genau da passiert. So ganz hat das aber noch nicht geklappt. ;) Aber ich arbeite dran.
      Jedenfalls funktioniert das ganze, so wie es da steht, wunderbar. Auch ohne tr

      this.value = 'Verstecken';
                  }
                  else
                  {
                      this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
                      this.innerText = '';
                      this.value = 'Spoiler';
                  }"/>
      </div>
      <div class="inposttable"><normalfont>
      Was ist <normalfont>? Das gehoert da wohl weg?

      Das gehört zum Forum. Mittels <smallfont><normalfont> kann man die Größe der Schrift anpassen. Da hab ich nix mit zu tun, das war schon so vorprogrammiert.

      <div style="display: none;">
              {param1}
          </div>
      </div>
      </td>
      </table>

      Gibt es da eine - am besten einfach umzusetzende - Möglichkeit? Oder muss ich dafür das ganze Script umkrempeln?

      Du musst das Script, das dieses Javascript erzeugt, abaendern.

      mfG,
      steckl

      Scheint so, als ob das ganze eine kompliziertere Aktion ist, wenn man sich damit nicht auskennt. ;)
      Ich dachte, es gäbe vielleicht sowas ähnliches wie if else, um den value des buttons zu verändern.
      quasi sowas wie

      if var1 = [text] -> value = text
      else value = spoiler

      Haha, nun gut. Dann ist es wohl besser, wenn ich mich nochmal intensiv mit dem Ganzen beschäftige und dann nochmal auf das Board hier zurückkomme.

      Vielen Dank jedenfalls.
      phoenixjunge

      1. Ahoi phoenixjunge,

        Haha, nun gut. Dann ist es wohl besser, wenn ich mich nochmal intensiv mit dem Ganzen beschäftige und dann nochmal auf das Board hier zurückkomme.

        Ich habs jetzt nur grob überflogen aber der HTML Code kommt also aus
        templates. bei dem Spoiler hast du den JS-code eingebunden zum
        anzeigen/verstecken der Texte.

        ersetzte this.value = 'Spoiler'; in deinem Template durch das dem
        Template entsprechende this.value = '$var1' damit wenn diese Variable
        nicht gegeben ist musst halt nochn if drum bauen.

        MfG

        1. Ahoi phoenixjunge,

          Ich habs jetzt nur grob überflogen aber der HTML Code kommt also aus
          templates. bei dem Spoiler hast du den JS-code eingebunden zum
          anzeigen/verstecken der Texte.

          ersetzte this.value = 'Spoiler'; in deinem Template durch das dem
          Template entsprechende this.value = '$var1'

          Jau, das hatte ich schonmal gemacht. Aber dann muss man ja IMMER die var1 eingeben. ;)

          damit wenn diese Variable nicht gegeben ist musst halt nochn if drum bauen.

          MfG

          Hehe, ja, genau da liegt mein Problem ;) mal eben ein if drumbauen stellt mich vor große Probleme, weil ich keinen Plan davon hab. Aber das hat meinen Ehrgeiz geweckt, ich beiß mich da jetzt durch und versuch mal, das irgendwie hinzubekommen. Vermutlich komm ich dann ganz bald auf euch zurück und poste euch meine ergebnisse, die nicht funktionieren werden und ihr dürft die dann auseinander nehmen und mir sagen, was ich falsch gemacht hab.
          Bis hierher jedenfalls nochmal vielen Dank.

          der phoenixjunge