JavaScript, pomoć, preuređivanje buttona - how to?

Zdravo drugari, moze li mi neko pomoci da preuredim ovaj JS code How To Toggle Between Hiding And Showing an Element

Potrebno mi je nesto kao ovo gore sto sam navela s tim da je meni potrebno da kad neko klikne na button da se button sakrije i da se prikaze kontakt forma.

Znaci, korisnik dolazi na sajt, klikne na button, button se sakrije i prikazuje se kontakt forma, on popuni formu i to je to.

<button id="tipka" onclick="myFunction()">Try it</button>

<div id="myDIV">
This is my DIV element.
</div>

<p><b>Note:</b> The element will not take up any space when the display property set to "none".</p>

<script>
document.getElementById("myDIV").style.display = "none";
function myFunction() {
  var x = document.getElementById("myDIV");
  var y= document.getElementById("tipka");
  if (x.style.display === "none") {
    x.style.display = "block";
    y.style.display = "none";
  } else {
    x.style.display = "none";
    y.style.display = "block";
  }
}
</script>

Hvala ti, ovo pomaze.

A htjela bi jos nesto, ako iznad te forme imam rečenicu npr. u ovom obliku

<p>Da biste nas kontaktirali <a id="tipka" onclick="myFunction()">kliknite ovdje</a></p>

ova recenica bi trebala da nestane kada se pojavi forma, pa kako bi to uradila?

Isto kao i sa buttonom tj. staviš text i tipku u div a možeš i p-u dodat id (buttonu sam pobrisao id jer nije potrebno)

<p id="tipka">OVdje ide text <button onclick="myFunction()">Try it</button>

ili ovako

<div id="tipka">OVdje ide text <button onclick="myFunction()">Try it</button></div>

1 Like

E ovo je odlično hvala ti puno. Super si.:wink:

Hvala. Mada s JavaScriptom nisam na ti nego više na vi ali kad mi treba skužim neke stvari.

Kako mogu da pomocu JavaScript uradim sljedece:

Imam komentare na blogu i forma za komentarisanje nalazi se na početku gore, a ispod su komentari, na komentarima postoji replay, ako neko klikne na replay pojavi se jos jedna forma ispod komentara, a postoji i ona iznad, pa me zanima kako da onu prvu sakrijem kad neko klikne na replay da se pojavi samo jedna forma.

Koristim ovaj js kod za prikazivanje forme kad neko klikne na replay

<a href="javascript:" onclick="commentReplay()">Reply</a><div id="comment-replay">

     <h3>Ostavite odgovor</h3>
     <form action="" method="POST">
         <input type="text" name="name" class="form-control" placeholder="Ime">
         <textarea name="comment" class="form-control" placeholder="Unesite komentar"></textarea>
        <button type="submit" name="send" class="btn-main">Objavi komentar</button>
     </form>  

js

document.getElementById("comment-replay").style.display = "none";
        function commentReplay() {
          var x = document.getElementById("comment-replay");
          if (x.style.display === "none") {
            x.style.display = "block";
          } else {
            x.style.display = "none";
          }
        }

Tebi treba ovo?

http://www.haustor.ga/js/show-hide.html

Kode znaš pogledati?

1 Like

Ja sam uspjela uraditi nesto na svoj nacin ali ne znam da li sam dobro slozila ovaj js code.
Capture213
mozda sam ga malo zakomplicirala…

Ovo sto si ti uradio je oke, samo treba biti jedna forma na vrhu u slucaju da nema komentara da se moze ostaviti komentar, a ako ima komentara oni su ispod forme i kada se klikne na replay na komentarima treba da nestane ta prva forma i da se prikazuje samo ona na replay.

Ispiši komentare prije forme i ubaci formu poslije komentara i stvar riješena.

Ne znam čime radiš ali recimo ide članak i forma, kada se ostavi komentar ide prije između članka i forme.

I nisi bas, moze to puno bolje i jednostavnije

  • Zasto putem JS skrivas comment-replay div, zar nije jednostavnije i bolje uraditi isto inicijalno sa CSS-om ?
  • koristis isti naziv za varijablu za dva razlicita elementa.U tvom slucaju desit ce se re-assignment sa deklaracijom po drugi put.

Po meni dosta jednostavnija solucija bi bila uraditi toggle klase.

function commentReplay() {
  var replayNode = document.querySelector('#comment-replay');
  var commentFormNode = document.querySelector('#comment-form');

  replayNode.classList.toggle('hidden');
  commentFormNode.classList.toggle('hidden');
}

.hidden {
  display: none;
}

U HTML-u dodaj klasu hidden na comment-replay

Taj tvoj code ne funkcionira onako kako meni treba.

Kada otvorim blog forma za komentare i forma na replay su otvorene i ako kliknem na replay sakriva formu za komentare i formu za replay.

A meni treba da forma na replay bude sakrivena a forma za komentare prikazana, tek kad neko klikne na replay na komentarima da se ona prikaze a ova za komentare sakrije.

Vrlo vjerovatno zato sto nisi dodala .hidden klasu na HTML element koji inicijalno zelis sakriti.

A evo i dokaz.

Imam ovaj JS code koji mi radi dobro posao, potrebna mi je mala nadogradnja…

Samo zelim da kad kliknem van dropdown meni-a ili na dropdown-button da se zatvori.

Kako to mogu uraditi na jednostavan nacin?