AJAX/JQuery. Create a table with the following fields in your own DB create scri
ID: 3723628 • Letter: A
Question
AJAX/JQuery.
Create a table with the following fields in your own DB
create script query to create a dataBASE IN MYSQL
EMAIL (40)
ADDRESS(100)
PHONE VARCHAR(10)
1. Enter at least three rows of data.
2. Create a HTML form that contains three input fields and an update button. After user enters an email in the email field, the form auto populates other fields. Display a message asks if user needs to update the information. If so, use can update the information (After user hits the Update button, display a message saying your information has been updated. Keep other parts on the screen as it is) . Do all these using AJAX/JQuery.
Explanation / Answer
Hi.. Please check below.
Script.sql
CREATE DATABASE Users;
USE Users;
CREATE TABLE Address ( EMAIL varchar2(40) not null, ADDRESS varchar(100) not null,PHONE number(10) not null, constraint pk_example primary key (EMAIL) );
INSERT INTO tablename VALUES ( "abc@mm.com", "Palakura", 123456789 );
INSERT INTO tablename VALUES ( "cdf@mm.com", "Pappu", 123456789 );
INSERT INTO tablename VALUES ( "efr@mm.com", "Pulihora", 123456789 );
Abc.html
<html>
<head>
<script type="text/javascript">
function updateData(){
var email = document.getElementById("email").value;
var address = document.getElementById("address").value;
var phone = document.getElementById("phone").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
alert("Data uploaded successfully");
}
};
xhttp.open("GET", "updateData?email="+email+"&address="+address+"&phone="+phone, true);
xhttp.send();
}
</script>
</head>
<body>
<form action="">
<table>
<tr>
<td>Email:</td>
<td><input type="email" id="email"></td>
</tr>
<tr>
<td>Address:</td>
<td><input type="text" id="address"></td>
</tr>
<tr>
<td>Phone:</td>
<td><input type="number" id="phone"></td>
</tr>
<tr>
<td colspan="2"><input type="button" id="bt1" Value="Update">
<input type="reset" id="bt1" Value="Reset"></td>
</tr>
</table>
</form>
</body>
</html>
I have written about the ajax script to update the data but i didnt write any url to update the feature. Please check the code and let me know any issues. Thank you. All the best.