Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Button Click issue on Signin signup page


In balzor clcik event not working. Not hitting login function instead of this its moved to Other page. Anyone guide me about the issue


Code.....................



@using JWTAuthentication.Authentication;
@using Solution.UI.Shared.Partials.General;
@using Solution.UI._keenthemes.libs;
@inject IJSRuntime JS
@inject IKTTheme KTTheme;
@inject HttpClient httpClient;
@page "/signin"


<script suppress-error="BL9992" src=@KTTheme.GetAssetPath("js/custom/authentication/sign-in/general.js")></script>

<!--begin::Form-->
<form class="form w-100" novalidate="novalidate" id="kt_sign_in_form" data-kt-redirect-url="/" action="#">
<!--begin::Heading-->
<div class="text-center mb-11">
<!--begin::Title-->
<h1 class="text-dark fw-bolder mb-3">
Sign In
</h1>
<!--end::Title-->

<!--begin::Subtitle-->
<div class="text-gray-500 fw-semibold fs-6">
Your Social Campaigns
</div>
<!--end::Subtitle--->
</div>
<!--begin::Heading-->

<!--begin::Login options-->
<div class="row g-3 mb-9">
<!--begin::Col-->
<div class="col-md-6">
<!--begin::Google link--->
<a href="#%22%20class=%22btn%20btn-flex%20btn-outline%20btn-text-gray-700%20btn-active-color-primary%20bg-state-light%20flex-center%20text-nowrap%20w-100" target="_blank">
<img alt="Logo" src="@KTTheme.GetAssetPath("media/svg/brand-logos/google-icon.svg")" class="h-15px me-3"/>
Sign in with Google
</a>
<!--end::Google link--->
</div>
<!--end::Col-->

<!--begin::Col-->
<div class="col-md-6">
<!--begin::Google link--->
<a href="#%22%20class=%22btn%20btn-flex%20btn-outline%20btn-text-gray-700%20btn-active-color-primary%20bg-state-light%20flex-center%20text-nowrap%20w-100" target="_blank">
<img alt="Logo" src=@KTTheme.GetAssetPath("media/svg/brand-logos/apple-black.svg") class="theme-light-show h-15px me-3"/>
<img alt="Logo" src=@KTTheme.GetAssetPath("media/svg/brand-logos/apple-black-dark.svg") class="theme-dark-show h-15px me-3"/>
Sign in with Apple
</a>
<!--end::Google link--->
</div>
<!--end::Col-->
</div>
<!--end::Login options-->

<!--begin::Separator-->
<div class="separator separator-content my-14">
<span class="w-125px text-gray-500 fw-semibold fs-7">Or with email</span>
</div>
<!--end::Separator-->

<!--begin::Input group--->
<div class="fv-row mb-8">
<!--begin::Email-->
<input type="text" placeholder="Email" name="email" autocomplete="off" class="form-control bg-transparent"/>
<!--end::Email-->
</div>

<!--end::Input group--->
<div class="fv-row mb-3">
<!--begin::Password-->
<input type="password" placeholder="Password" name="password" autocomplete="off" class="form-control bg-transparent"/>
<!--end::Password-->
</div>
<!--end::Input group--->

<!--begin::Wrapper-->
<div class="d-flex flex-stack flex-wrap gap-3 fs-base fw-semibold mb-8">
<div></div>

<!--begin::Link-->
<a class="link-primary">
Forgot Password ?
</a>
<!--end::Link-->
</div>
<!--end::Wrapper-->

<!--begin::Submit button-->
<div class="d-grid mb-10">
<button type="button" @onclick="login" id="kt_sign_in_submit" class="btn btn-primary">
log In
</button>
</div>
<!--end::Submit button-->

<!--begin::Sign up-->
<div class="text-gray-500 text-center fw-semibold fs-6">
Not a Member yet?

<a class="link-primary">
Sign up
</a>
</div>
<!--end::Sign up-->
</form>
<!--end::Form-->


@code{
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if(firstRender){
await Task.Delay(1000);
await JS.InvokeVoidAsync("KTSigninGeneral.init");
}
}

private async Task login()
{
var requestModel = new LoginModel
{
Username = "Danish",
Password = "Danish@123"
};

var response = await httpClient.PostAsJsonAsync("/api/authenticate/login", requestModel);
//var response = await httpClient.PostAsJsonAsync($"Authenticate/login", data);
//var response = await http.PostAsync($"api/authenticate/login", requestModel);
if (response.IsSuccessStatusCode)
{
// Handle success response

}
else
{
// Handle error response
}
}
}


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)


Hi,

In the latest Metronic version, we do not have this issue. Please make sure you have included file js/custom/authentication/sign-in/general.js on your sign-in page view.

Also, please verify that you still have the correct form and submit button ids. The form should have kt_sign_in_form id and submit button should have kt_sign_in_submit id.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(