Ankündigung

Einklappen
Keine Ankündigung bisher.

Einen Link mittels JavaScript in ein Input Feld umwandeln?

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Einen Link mittels JavaScript in ein Input Feld umwandeln?

    Hallo, die Überschrift sagt eigentlich schon alles,

    ich habe einen Link
    HTML-Code:
    <a href="#">add</a>
    den ich in
    HTML-Code:
    <form .....><input></form>
    verwandeln will, ohne dabei die Seite neu zu laden

    LG, Chris


  • #2
    Ich sehe gerade ihr habt eine eigene JavaScript spalte, vielleicht kan das ein Admin verschieben!

    Kommentar


    • #3
      Dein Anliegen wäre mit folgendem Code beantwortet.

      HTML-Code:
      var myLink= '<a href="#">add</a>'
      var myReplace = myLink.replace( '<a href="#">add</a>', '<form .....><input></form>' )
      console.log ( myReplace )
      Das ist sicher nicht das, was Du willst. Teile uns mal genau mit, was Du machen willst.

      Kommentar


      • #4
        Ja wie recht Du hast, das ist nicht das was ich will, eigentlich dachte ich, das ich das so gut beschrieben habe, das weiter keine Zusatzinfo nötig ist, aber na gut, ich probiere es noch mal:

        ich habe einen link, der schon auf meiner Seite geladen ist und angezeigt wird also
        HTML-Code:
        <a href="#">add</a>
        wie man sieht geht der link ins leere und hat die bezeichnung add was im deutschen hinzufügen heißt, weil ich damit daten über ein Formular über PHP in eine Datenbank schreiben will, wenn ich also jetzt auf add klicke hätte ich gerne, das der link add verschwindet und genau an dieser stelle ein Formular auftaucht, das nur ein Eingabefeld
        HTML-Code:
        <form action="...hier steht die PHP datei drin.."><input type="text" name="name"><input type="submite" style="display:none"></form>
        hat.

        Ich hoffe das war jetzt verständlich!

        LG, Chris

        Kommentar


        • #5
          Es gäbe auch ein JavaScript-Unterforum.

          Du packst den Link in einen Container, z.b.

          HTML-Code:
          <div id="link"><a href="#*>add</a></div>
          Wenn auf add geklickt wurde leerst du den Container, z.b (jQuery)
          HTML-Code:
          $('#link').html('')
          ;

          Und anschliessend fügst du mit derselben Funktion das Formular hinzu.

          Kommentar


          • #6
            Das alles geht auch nur mit HTML und ein wenig CSS:
            HTML-Code:
            <!DOCTYPE html>
            <html lang="de">
            
            <head>
                <meta charset="UTF-8">
                <title>test</title>
                <style>
                #add > form {
                  display: none;
                }
                #add:target > form {
                  display: block;
                }
                #add:target > a {
                  display: none;
                }
                </style>
            </head>
            
            <body>
                <main id="add">
                    <a href="#add">add</a>
            
                    <form action="add.php" method="post">
                        <input type="text" name="name">
                        <input type="submit">
                    </form>
                </main>    
            </body>
            
            </html>

            Kommentar


            • #7
              Hallo Jonas,

              das es ein JavaScript Unterforum gibt, hatte ich auch nach dem schreiben gesehen, siehe oben!

              Javascript Code schnipsel helfen mir leider nicht weiter, da ich mich mit JavaScript überhaupt nicht auskenne, aber ein Buch ist bestellt und wird demnächst auch aufmerksam durchgeackert.

              Desshalb die Bitte, mir diesen Teil mal als funktionierenden Code hier zu posten, dann könnte ich erst mal mein programieren fortsetzen, da mich das Problem jetzt schon zwei Tage beschäftigt, aber ohne JavaScript überhaupt nur ansatzweise zu verstehen kann ich auch nur sehr dürftig gefundenen Code modifizieren.

              LG, Chris

              Kommentar


              • #8
                Hallo protestix

                Danke, werde ich gleich testen.....

                LG, Chris

                Kommentar


                • #9
                  Ist ja cool, CSS ist mächtig geworden, ich bin seit 15 Jahren wieder das erste mal am programmieren!

                  Kommentar


                  • #10
                    [MOD: verschoben von PHP-Einsteiger]
                    Competence-Center -> Enjoy the Informatrix
                    PHProcks!Einsteiger freundliche Tutorials

                    Kommentar

                    Lädt...
                    X