Fixed issue with form ajax

nodejs/public/lib/js/app-base.js

@@ -313,7 +313,7 @@ app.util = (function(app){
 
 	function downloadFile(filename, text){
 		// https://stackoverflow.com/a/18197341
-		
+
 		var element = document.createElement('a');
 		element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
 		element.setAttribute('download', filename);
@@ -354,7 +354,7 @@ $( document ).ready(function(){
 	});
 
 	setInterval(()=>{
-		$('.momentFromNow').each((idx,el)=>{
+		$('.momentFromNow').each((idx, el)=>{
 			var $el = $(el);
 			try{
 				$el.html(moment($(el).data('date')).fromNow());
@@ -364,9 +364,9 @@ $( document ).ready(function(){
 });
 
 //ajax form submit
-function formAJAX(btn, del){
-	event.preventDefault(); // avoid to execute the actual submit of the form.
-	var $form = $(btn).closest('[action]'); // gets the 'form' parent
+function formAJAX(btn){
+	event.preventDefault(btn); // avoid to execute the actual submit of the form.
+	var $form = $(btn || event.target).closest('[action]'); // gets the 'form' parent
 	var formData = $form.find('[name]').serializeObject(); // builds query formDataing
 	var method = ($form.attr('method') || 'post').toLowerCase();
 

nodejs/routes/render.js

@@ -36,7 +36,7 @@ router.get('/users', async function(req, res, next) {
   res.render('users', {...values});
 });
 
-router.get('/login', async function(req, res, next) {
+router.get('/login*', async function(req, res, next) {
   res.render('login', {...values, redirect: req.query.redirect});
 });
 

nodejs/views/login.ejs

@@ -12,9 +12,24 @@
 <div class="row" style="display: none;">
 	<div class="col-md-4">
 		<div class="shadow-lg card">
-			<div class="card-header shadow">
-				Password Log in
+
+			<div class="card-header text-center">
+				<span class="card-icon float-start">
+					<i class="fa-solid fa-lock"></i>
+				</span>
+				<span class="card-title">
+					User Login
+				</span>
+				<span class="float-end">
+					<i class="fa-solid fa-circle-minus"></i>
+				</span>
 			</div>
+
+
+
+
+
+
 			<div class="card-header shadow actionMessage" style="display:none"></div>
 			<div class="card-body">
 				<form action="auth/login" onsubmit="formAJAX(this)" evalAJAX="
@@ -23,26 +38,40 @@
 				">
 					<input type="hidden" name="redirect" value="<%= redirect %>">
 
-					<div class="form-group">
+					<div class="mb-3">
+						<label></label>
+						<div class="input-group">
+							<span class="input-group-text" id="addon-wrapping"><i class="fa-solid fa-user-tie"></i></span>
+							<input type="text" name="username" class="form-control" placeholder="jsmith" aria-label="Username" aria-describedby="addon-wrapping">
+						</div>
+					</div>
+					<div class="mb-3">
+						<div class="input-group">
+							<span class="input-group-text" id="addon-wrapping"><i class="fa-solid fa-key"></i></span>
+							<input type="password" name="password" class="form-control" placeholder="huunteR!23" aria-label="Username" aria-describedby="addon-wrapping">
+						</div>
+					</div>
+
+<!-- 					<div class="group">
 						<label class="control-label">User name</label>
 						<div class="input-group mb-3 shadow">
 						  <div class="input-group-prepend">
 						    <span class="input-group-text" ><i class="fa-solid fa-user-tie"></i></span>
 						  </div>
-							<input type="text" name="username" class="form-control" placeholder="jsmith" />
+							<input type="text" name="username" class="input-control" placeholder="jsmith" />
 						</div>
 					</div>
 
-					<div class="form-group">
+					<div class="group">
 						<label class="control-label">Password</label>
 						<div class="input-group mb-3 shadow">
 						  <div class="input-group-prepend">
 						    <span class="input-group-text" ><i class="fa-solid fa-key"></i></span>
 						  </div>
-							<input type="password" name="password" class="form-control" placeholder="hunter123!"/>
+							<input type="password" name="password" class="input-control" placeholder="hunter123!"/>
 						</div>
-					</div>
-
+					</div> -->
+					<hr />
 					<button type="submit" class="btn btn-outline-dark"><i class="fa-solid fa-right-to-bracket"></i> Log in</button>
 				</form>
 			</div>