Member Avatar for fiaolle

Hi
I want to make my own login box to popup when I click a button Is there a way to do that? I don't want a whole page for the loging in part. I just want something like the msgbox, but with two textboxes and two buttons for login or exit.

Thanks in advance

Fia

  • 2 Contributors
  • 1 Reply
  • 90 Views
  • 7 Hours Discussion Span
  • Latest Post Latest Post by kvprajapati

Dani AI

Generated

wanted a small inline login dialog rather than a whole page. suggested opening a new browser window, which works but is fragile (popup blockers, separate UX, mobile issues). A better pattern is an in-page modal: a hidden element that is shown on button click and overlayed over the page. Use the HTML5 <dialog> when available, or a simple DIV + CSS/JS modal, or an established widget (jQuery UI or Bootstrap) for built-in focus and keyboard handling (MDN dialog, jQuery UI dialog).

Implementation notes to apply immediately: keep the login form markup inside a hidden container; show it on click; move focus into the first input; close on Esc or backdrop click; restore focus when closed. Submit credentials via POST over HTTPS and validate on the server. Avoid any client-side-only authentication logic. Example HTML structure (minimal):

<button id="showLogin">Login</button>

<div id="loginModal" aria-hidden="true" role="dialog" style="display:none;">
  <form method="post" action="/account/login">
    <input name="username" />
    <input type="password" name="password" />
    <button type="submit">Login</button>
    <button type="button" id="cancel">Cancel</button>
  </form>
</div>

For ASP.NET: WebForms can use ModalPopupExtender (AjaxControlToolkit) or a Panel shown with JS; MVC apps commonly load a partial view into a modal and post via AJAX. For secure design guidance see OWASP's Authentication Cheat Sheet (OWASP Authentication Cheat Sheet).

Member Avatar for kvprajapati

Use JavaScript open method to open a url in the new browser .

open("url","_blank","left=100px,top=100px,width=300px,height=200px");
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.