Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

user login from tables in my mySql database


I would like to authenticate the user login from the databases stored in mySql database on my server.

would like to know how I can get that done when using the Datatables in your example shown.

using the html version of Metronic


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

You can customize src/js/custom/authentication/sign-in/general.js script and remove the demo form submit function and use the below one which uses ajax submit using Axios Ajax library:


var handleSubmit = function(e) {
// Handle form submit
submitButton.addEventListener("click", function (e) {
// Prevent button default action
e.preventDefault();

// Validate form
validator.validate().then(function (status) {
if (status == "Valid") {
// Hide loading indication
submitButton.removeAttribute("data-kt-indicator");

// Enable button
submitButton.disabled = false;

axios.post("/your/ajax/login/url", {
email: form.querySelector("[name="email"]").value,
password: form.querySelector("[name="password"]").value
}).then(function (response) {
if (response) {
form.querySelector("[name="email"]").value= "";
form.querySelector("[name="password"]").value= "";

const redirectUrl = form.getAttribute("data-kt-redirect-url");

if (redirectUrl) {
location.href = redirectUrl;
}
} else {
// Show error popup. For more info check the plugin"s official documentation:
Swal.fire({
text: "Sorry, the email or password is incorrect, please try again.",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-primary"
}
});
}
}).catch(function (error) {
Swal.fire({
text: "Sorry, looks like there are some errors detected, please try again.",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-primary"
}
});
});
} else {
// Show error popup. For more info check the plugin"s official documentation:
Swal.fire({
text: "Sorry, looks like there are some errors detected, please try again.",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-primary"
}
});
}
});
});
}


Then recompile your assets folder with Gulp or Webpack.

Please note that the build tools are required only in the development environment just to compile the assets when the source folder files are modified. In the hosting/server deployment you will only need the compile assets, no need to install the build tools dependencies there.

Regards.



Thanks Sean,
so the /your/ajax/login/url is my php program that collects the email and pwd, checks for them in the mysqldb.

and what do I return from the php file to axios?



Hi,

This post can be useful.

Regards.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(