Sweet Alert login popupu açtırmak
<script>
function alertlogin() {
Swal.fire(
"Lütfen Giriş Yapınız",
"Lütfen Giriş Yapınız",
"warning"
);
Swal.fire({
title: 'Lütfen Giriş Yapınız',
text: "Lütfen Giriş Yapınız",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Giriş Yap'
}).then((result) => {
if (result.value) {
window.location = "popup aç";
}
})
}
</script>
Bu şekil bir alertim mevut Giriş Yap butonuna tıklayınca login popunu açtırtmam gerek yapamadım nasıl yapabilirim
Login kodları
<div class="cdk-global-overlay-wrapper" id="loginn" dir="ltr" style="justify-content: center; align-items: center;display: none;">
<div id="cdk-overlay-1" class="cdk-overlay-pane obg-mat-dialog-panel"
style="min-height: 400px;max-width: 80vw;width: 580px;position: static;">
<div tabindex="0" class="cdk-visually-hidden cdk-focus-trap-anchor" aria-hidden="true"></div>
<mat-dialog-container tabindex="-1" aria-modal="true"
class="mat-dialog-container ng-tns-c157-3 ng-trigger ng-trigger-dialogContainer ng-star-inserted"
id="login" role="dialog" aria-labelledby="mat-dialog-title-0" style="transform: none;">
<ng-component class="ng-star-inserted obg-m-dialog-route">
<!---->
</ng-component>
<obg-m-login-with-dialog class="obg-m-login-with-dialog ng-star-inserted" style="">
<obg-m-dialog-layout test-id="login-modal" titletext="general.sign-in" class="obg-m-dialog-layout">
<span mat-dialog-title="" class="mat-dialog-title ng-star-inserted"
id="mat-dialog-title-0">Hesabınıza giriş yapın</span>
<!---->
<button mat-icon-button="" mat-dialog-close="" onclick="hideMe('loginn');" tabindex="-1" test-id="modal-close"
class="mat-focus-indicator ico-close mat-icon-button mat-button-base ng-star-inserted"
type="button"><span class="mat-button-wrapper"></span><span matripple=""
class="mat-ripple mat-button-ripple mat-button-ripple-round"></span><span
class="mat-button-focus-overlay"></span></button>
<!---->
<!---->
<!---->
<div class="obg-m-dialog-content">
<!---->
<obg-m-login-container autofocus="" class="obg-m-login">
<!---->
<!---->
<!---->
<!---->
<!---->
<!---->
<obg-m-generic-login-container class="obg-m-generic-login ng-star-inserted">
<!---->
<form novalidate="" method="POST" class="ng-pristine ng-invalid ng-touched">
<div class="obg-m-generic-login-content">
<mat-form-field
class="mat-form-field ng-tns-c136-4 mat-primary mat-form-field-type-mat-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-has-label mat-form-field-hide-placeholder ng-pristine ng-invalid ng-star-inserted mat-form-field-invalid ng-touched">
<div class="mat-form-field-wrapper ng-tns-c136-4">
<div class="mat-form-field-flex ng-tns-c136-4">
<!---->
<!---->
<div class="mat-form-field-infix ng-tns-c158-0">
<input type="text" name="kullanici_ad" class="mat-input-element mat-form-field-autofill-control mat-menu-trigger ng-tns-c158-0 mat-input-server ng-untouched ng-pristine ng-invalid" required="" data-placeholder="E-posta adresiniz">
<!---->
<span class="mat-form-field-label-wrapper ng-tns-c158-0">
<label class="mat-form-field-label ng-tns-c158-0 mat-empty mat-form-field-empty ng-star-inserted" for="mat-input-80" aria-owns="mat-input-80">
<span class="ng-tns-c158-0 ng-star-inserted">Eposta / Kullanıcı Adı
</span>
<!----><span aria-hidden="true" class="mat-placeholder-required mat-form-field-required-marker ng-tns-c158-0 ng-star-inserted">
*</span>
<!---->
</label>
<!---->
</span>
</div>
<!---->
</div>
<div
class="mat-form-field-underline ng-tns-c136-4 ng-star-inserted">
<span class="mat-form-field-ripple ng-tns-c136-4"></span>
</div>
<!---->
<div class="mat-form-field-subscript-wrapper ng-tns-c136-4">
<!---->
<div class="mat-form-field-hint-wrapper ng-tns-c136-4 ng-trigger ng-trigger-transitionMessages ng-star-inserted"
style="opacity: 1; transform: translateY(0%);">
<!---->
<div class="mat-form-field-hint-spacer ng-tns-c136-4"></div>
</div>
<!---->
</div>
</div>
</mat-form-field>
<mat-form-field
class="mat-form-field ng-tns-c136-5 mat-primary mat-form-field-type-mat-input mat-form-field-appearance-legacy mat-form-field-can-float mat-form-field-has-label mat-form-field-hide-placeholder ng-untouched ng-pristine ng-invalid ng-star-inserted">
<div class="mat-form-field-wrapper ng-tns-c136-5">
<div class="mat-form-field-flex ng-tns-c136-5">
<!---->
<!---->
<div class="mat-form-field-infix ng-tns-c158-0">
<input type="password" name="sifre" class="mat-input-element mat-form-field-autofill-control mat-menu-trigger ng-tns-c158-0 mat-input-server ng-untouched ng-pristine ng-invalid" required="" data-placeholder="E-posta adresiniz">
<!---->
<span class="mat-form-field-label-wrapper ng-tns-c158-0">
<label class="mat-form-field-label ng-tns-c158-0 mat-empty mat-form-field-empty ng-star-inserted" for="mat-input-80" aria-owns="mat-input-80">
<span class="ng-tns-c158-0 ng-star-inserted">Şifreniz
</span>
<!----><span aria-hidden="true" class="mat-placeholder-required mat-form-field-required-marker ng-tns-c158-0 ng-star-inserted">
*</span>
<!---->
</label>
<!---->
</span>
</div>
<div
class="mat-form-field-suffix ng-tns-c136-5 ng-star-inserted">
<mat-icon role="img" matsuffix="" passclass="ico-hide"
textclass="ico-show" test-id="show-password-icon"
class="mat-icon notranslate obg-m-password-toggle material-icons ico-hide mat-icon-no-color ng-tns-c136-5"
aria-hidden="true" data-mat-icon-type="font"></mat-icon>
</div>
<!---->
</div>
<div
class="mat-form-field-underline ng-tns-c136-5 ng-star-inserted">
<span class="mat-form-field-ripple ng-tns-c136-5"></span>
</div>
<!---->
<div class="mat-form-field-subscript-wrapper ng-tns-c136-5">
<!---->
<div class="mat-form-field-hint-wrapper ng-tns-c136-5 ng-trigger ng-trigger-transitionMessages ng-star-inserted"
style="opacity: 1; transform: translateY(0%);">
<!---->
<div class="mat-form-field-hint-spacer ng-tns-c136-5"></div>
</div>
<!---->
</div>
</div>
</mat-form-field>
</div>
<div class="obg-m-generic-login-actions">
<div class="extra-actions">
<mat-slide-toggle formcontrolname="shouldRememberUser"
test-id="login-should-remember-user" color="primary"
class="mat-slide-toggle mat-primary ng-untouched ng-pristine ng-valid ng-star-inserted"
id="mat-slide-toggle-1" tabindex="-1"><label
class="mat-slide-toggle-label" for="mat-slide-toggle-1-input">
<div class="mat-slide-toggle-bar"><input type="checkbox"
role="switch"
class="mat-slide-toggle-input cdk-visually-hidden"
id="mat-slide-toggle-1-input" tabindex="0"
aria-checked="false">
<div class="mat-slide-toggle-thumb-container">
<div class="mat-slide-toggle-thumb"></div>
<div mat-ripple=""
class="mat-ripple mat-slide-toggle-ripple mat-focus-indicator">
<div
class="mat-ripple-element mat-slide-toggle-persistent-ripple">
</div>
</div>
</div>
</div><span class="mat-slide-toggle-content"><span
style="display: none;"> </span>Beni hatırla </span>
</label></mat-slide-toggle>
<!----><a test-id="login-forgot-password"
href="sifremi-unuttum?username=" obg-route-link=""
rel="">Şifrenizi mi unuttunuz?</a>
</div>
<!---->
<!----><button mat-flat-button="" color="accent" test-id="login-submit"
class="mat-focus-indicator mat-flat-button mat-button-base mat-accent"><span
class="mat-button-wrapper">Giriş Yap </span><span matripple=""
class="mat-ripple mat-button-ripple"></span><span
class="mat-button-focus-overlay"></span></button>
</div>
</form>
</obg-m-generic-login-container>
<!---->
<!---->
<!---->
<!---->
<!---->
<!---->
<div class="obg-m-login-extra-action ng-star-inserted"><span>Hesabınız yok
mu? </span><a href="hesap-ac" obg-route-link="" rel="">Üye ol</a></div>
<!---->
<!---->
</obg-m-login-container>
</div>
<obg-compact-footer class="obg-compact-footer ng-star-inserted">
<div><img obgimagecontent="general.footer-pci"
src=""
alt="PCI"><img obgimagecontent="general.footer-secure"
src=""
alt="">
<!---->
</div><a href="" obg-route-link="" rel="noopener nofollow"
target="_blank" class="ng-star-inserted"> Müşteri Hizmetleri <span
class="ico-live-chat"></span></a>
<!---->
</obg-compact-footer>
<!---->
</obg-m-dialog-layout>
</obg-m-login-with-dialog>
<!---->
<!---->
</mat-dialog-container>
<div tabindex="0" class="cdk-visually-hidden cdk-focus-trap-anchor" aria-hidden="true"></div>
</div>
</div>
