I am trying to run a simple scenario in which: a form is submitted -> jquery ajax request for JSON data -> PHP script reads from the database and encodes to JSON -> data is shown on my page.
the fields on the MySQL are: Name
and Password
step 1 - my form - Search.php
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="Query.js"></script>
<title></title>
</head>
<body>
<form method="post" id="formoid" action="">
<input type="text" name="enterpass" placeholder="Enter Password">
<input type="submit" name="subbpass">
</form>
<input type="text" id="showname"><br/>
<input type="text" id="showpassword">
step 2 - my jquery file- Query.js
$(document).ready(function(){
$("#formoid").submit(function(){
alert("form submitted") // this alert goes through
var passid = $("#enterpass").val();
$.ajax({
url: "ModelQuery.php",
method: "POST",
dataType: "JSON",
data: {args: passid},
success: function(data)
{
console.log('ajax successfully sent'); // this alert isn't working
$("#showname").text(data.Name); // data isn't showing here
$("#showpassword").text(data.Password);
console.log(data); // or here ...
}
});
});
});
and lastly, my php -- ModelQuery.php -- I omitted some code lines but that script is the normal script for reading from the database and has worked for me in the past.
<?php
if(isset($_POST['args'])) {
$arg = $_POST['args']
$CON = mysqli_connect('127.0.0.1','root','','testdb');
// ....
$QUERY = "SELECT * FROM testtable where Password = '$arg'";
// ...
while($row = mysqli_fetch_array($RESULT))
{
$jsonresults["Name"] = $row['Name'];
$jsonresults["Password"] = $row['Password'];
}
echo json_encode($jsonresults);
}
the alert in the Jquery script right after the form is submitted does go through, but the ajax itself doesn't show anything, neither on the console nor on my two textboxs.
What am I doing wrong here?
Thank you very much!