Merhabalar arkadaşlar. Sitenin giriş ve kayit alanlarına modal form koydum. Kayıt butonuna tıklayınca sayfa açılıyor ama giriş butonuna tıklayınca açılmıyor. Aşağıdaki kodlar alt alta yani aynı sayfada. Css kodlarını, kod karmaşası olmasın diye koymadım ama lazım ise onu da koyayım. Kodlar aşağıda.

<button class="kayityazisi" id="open">Kayıt</button>
<dialog>
<h2 class="kayit-yazisi">Kayıt</h2>
<form>

<div class="kayit-ad">Kullanıcı Adı</div>
<div class="kayit-ad-input">
<input type="text" name="ad" placeholder="Kullanıcı Adınızı Giriniz" required />
</div>

<br>

<div class="kayit-sifre">Şifre</div>
<div class="kayit-sifre-input">
<input type="password" name="sifre" placeholder="Şifrenizi Giriniz" required />
</div>

<br>

<div class="kayit-eposta">E-Posta</div>
<div class="kayit-eposta-input">
<input type="email" name="eposta" placeholder="E-Postanızı Giriniz" required />
</div>

<br>

<div class="kayit-buton">
<input type="submit" value="Gönder" />
<button id="kapat">Kapat</button>
</div>


</form>
</dialog>

<button class="girisyazisi" id="open">Giriş</button>
<dialog>
<h2 class="giris-yazisi">Giriş</h2>
<form>

<div class="login-ad">Kullanıcı Adı</div>
<div class="login-ad-input">
<input type="text" name="ad" placeholder="Kullanıcı Adınızı Giriniz" required />
</div>

<br>

<div class="login-sifre">Şifre</div>
<div class="login-sifre-input">
<input type="password" name="sifre" placeholder="Şifrenizi Giriniz" required />
</div>

<br>

<div class="login-buton">
<input type="submit" value="Gönder" required />
<button id="kapat">Kapat</button>
</div>

</form>
</dialog>


<script>
var modal = document.querySelector("dialog");
document.querySelector("#open").onclick = function() {
modal.showModal();

document.querySelector("#kapat").onclick = function() {
modal.close();
return false;
}

}
</script>