I am trying to get a form to submit. I am using HTML, JS, PHP, and AJAX here. Since it will not submit, I assume something is wrong with my insert function, however I cannot figure out what the problem is. Whenever I click "submit" nothing changes. Nothing moves. The information doesnt get added.
<!doctype html>
<html>
<head>
<script src="./js/jquery-3.6.0.min.js">.
</head>
<body>
<form onsubmit="return(insertPeople())">
First name: <input type=text id=firstname><br>
Last name: <input type=text id=lastname><br>
Phone number: <input type=text id=telephonenumber><br>
<input type=submit value=submit>
</form>
<div id=showpeople></div>
<script>
function insertPeople(){
val = $("#showpeople").val();
$.get("./week7ajax.php",{"cmd":"create", "firstname,lastname,telephonenumber" : val}, function(data){
$("#showpeople").html(data);
});
return(false);
}
function showpeople(){
$.get("./week7ajax.php",{"cmd":""}, function(data){
$("#showpeople").html(data);
});
return(false);
}
showpeople();
</script>
</body>
</html>
Give this a shot. I fixed some missing quotations, indented a few lines, and removed some unnecessary code.
<form onsubmit="insertPeople(); return false;">
First name: <input type="text" id="firstname"><br>
Last name: <input type="text" id="lastname"><br>
Phone number: <input type="text" id="telephonenumber"><br>
<input type="submit" value="submit">
</form>
<div id="showpeople"></div>
<script>
function insertPeople() {
val = $("#showpeople").val();
$.get("./week7ajax.php",{"cmd":"create", "firstname,lastname,telephonenumber" : val}, function(data){
$("#showpeople").html(data);
});
}
function showpeople() {
$.get("./week7ajax.php",{"cmd":""}, function(data){
$("#showpeople").html(data);
});
}
showpeople();
</script>