Hello community Stackoverflow,
i recently begun again to make some experiments with web developing and I would appreciate it, if you could help me with the following issue:
I'm trying to save the string of each input in the following pictured form in a database, after the mouse cursor had left the textBox (OnLeave), this string will be called from the database, after the user clicked on the button "save". I need to check this string before the data being saved after clicking on "save"
Exemple:
step 1: a user types his Name = 'Stackoverflower' in the inputfield and then moves the mouse cursor outside the the inputfiel;
step 2: by leaving the inputfiel occurs the following event, in the background: a php code will save that input (the name: 'Stackoverflower') in the database;
step 3: after the user clicked on the button "save", a php code will call that string 'Stackoverflower';
That is a solution, but I don't want to save any data in the database unless the user clicks "save". So how can I save that input temporarily (not in the database - maybe in a hidden dom element ? Or do you maybe have a better idea?).
I'll appreciate your interaction
Friendly regards Reda
PHP only executes on page load, to do this, you will need to use Ajax to execute the save PHP script.
To store the value, you can use a variable.
let fname; // declare the fname value
let lname; // declare the lname value
let bday; // declare the bday value
function mouseLeft() {
fname = document.getElementById('fname').value; // store the first name value
lname = document.getElementById('lname').value; // store the last name value
bday = document.getElementById('bday').value; // store the birthday value
//optional:
document.getElementById('storedvalues').innerText = "fname=" + fname + ", lname=" + lname + ", bday=" + bday;
// your ajax script goes here with fname, lname and bday being the values of their respective inputs
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>test</title>
</head>
<body onmouseleave="mouseLeft();"> <!-- function that executes on mouse leave -->
<form> <!-- your form goes here, just add the ids to the inputs -->
<label for="fname">First name:</label>
<input type="text" id="fname">
<br>
<label for="lname">Last name:</label>
<input type="text" id="lname">
<br>
<label for="bday">Birthday:</label>
<input type="date" id="bday">
</form>
<!-- optional, just for debug -->
<p>stored values: <span id="storedvalues">fname=, lname=, bday=</span></p>
</body>
</html>
Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.
Find the answer in similar questions on our website.
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.
PHP (from the English Hypertext Preprocessor - hypertext preprocessor) is a scripting programming language for developing web applications. Supported by most hosting providers, it is one of the most popular tools for creating dynamic websites.
The PHP scripting language has gained wide popularity due to its processing speed, simplicity, cross-platform, functionality and distribution of source codes under its own license.
https://www.php.net/
JavaScript is a multi-paradigm language that supports event-driven, functional, and mandatory (including object-oriented and prototype-based) programming types. Originally JavaScript was only used on the client side. JavaScript is now still used as a server-side programming language. To summarize, we can say that JavaScript is the language of the Internet.
https://www.javascript.com/
CSS (Cascading Style Sheets) is a formal language for describing the appearance of a document written using a markup language.
It is mainly used as a means of describing, decorating the appearance of web pages written using HTML and XHTML markup languages, but can also be applied to any XML documents, such as SVG or XUL.
https://www.w3.org/TR/CSS/#css
HTML (English "hyper text markup language" - hypertext markup language) is a special markup language that is used to create sites on the Internet.
Browsers understand html perfectly and can interpret it in an understandable way. In general, any page on the site is html-code, which the browser translates into a user-friendly form. By the way, the code of any page is available to everyone.
https://www.w3.org/html/
Welcome to the Q&A site for web developers. Here you can ask a question about the problem you are facing and get answers from other experts. We have created a user-friendly interface so that you can quickly and free of charge ask a question about a web programming problem. We also invite other experts to join our community and help other members who ask questions. In addition, you can use our search for questions with a solution.
Ask about the real problem you are facing. Describe in detail what you are doing and what you want to achieve.
Our goal is to create a strong community in which everyone will support each other. If you find a question and know the answer to it, help others with your knowledge.