This is the error message found on google chrome:
POST http://localhost/display/register/registerUser 500 (Internal Server Error)
My project file name is "display".
One controller file named "register" ,it has a function called "registerUser". All it does is getting user's input, and compare it with database to see if the name is used or not, if valid store it into database and give them a success message, if not valid give a error message.
$username=$this->input->post('name');
$password=$this->input->post('password');
$result=$this->user->checkExistUser($username);
if(!$result){
$data=array(
'username'=>$username,
'password'=>md5($password)
);
$this->user->register($data);
echo "<script>alert('You have success registered');</script>";
$this->load->view('home_view');
}
else{
echo "<script>alert('Sorry, this email address has been used!');</script>";
$this->load->view('registerView');
}
This is my view file named registerView
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Welcome to Stock game</title>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">
</script>
</head>
<body>
<div id="container">
<h1>Welcome to Stock game!</h1>
<div id="body">
<p>This is the register page</p>
</div>
<div>
<form name="userform" id="userform" >
<input type="text" name="name" placeholder="Name"/>
<input type="text" name="password" placeholder="Password"/>
<button name="submit" value="submit">Register</button>
</form>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('form#userform').on('submit',function(e){
e.preventDefault();
var name=$("#name").val();
var password=$("#password").val();
$.ajax({
type:'POST',
url:'register/registerUser',
data:
{'name':JSON.stringify(name),'password':JSON.stringify(password)},
dataType:'JSON',
success: function(response){
if(response=="success"){
alert("Yes login");
}
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(xhr.responseText);
alert(thrownError);
}
});
});
});
</script>
</div>
<br/>
</body>
</html>
I have tested the controller and model class with a simple form post(form action=xxx, method=post) and it is no error. I searched almost every stackoverflow questions about this, but i still cannot fix it, I hope someone can help me.
Append the base url in your ajax
url:<?php echo base_url(); ?>'register/registerUser',
Spent around 5hrs on this question, I did a simple step and found the bug. What i do is modified name and password value by myself, so don't care what is the input, just to test if the data i modified will be sent to controller or not, the result is yes, it is stored in my database. So the bug should be the way how i read the input, after i put (id="name" before name="name") in the tag for name, and did the same thing for password tag, the server not give me 500 anymore.
You cannot load a view in ajax call
$this->load->view('home_view');
the above is wrong in the controller
change the controller to this code
$username=$this->input->post('name');
$password=$this->input->post('password');
$result=$this->user->checkExistUser($username);
if(!$result){
$data=array(
'username'=>$username,
'password'=>md5($password)
);
$this->user->register($data);
echo "1";
}
else{
echo "0";
}
in view file change your code to the below code
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Welcome to Stock game</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
</head>
<body>
<div id="container">
<h1>Welcome to Stock game!</h1>
<div id="body">
<p>This is the register page</p>
</div>
<div>
<form name="userform" id="userform" >
<input type="text" name="name" placeholder="Name"/>
<input type="text" name="password" placeholder="Password"/>
<button name="submit" value="submit">Register</button>
</form>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('form#userform').on('submit',function(e){
e.preventDefault();
var name=$("#name").val();
var password=$("#password").val();
$.ajax({
type:'POST',
url:'<?php echo base_url()."register/registerUser"; ?>',
data: {'name':name,'password':password},
success: function(response){
if(response=='0'){
alert("Failed");
// with the result you can redirect to the view that is in controller
window.href.location = '<?php echo base_url()."yoursuccesscontroller/yoursuccessfunction"; ?>';
}
else {
alert('Success');
//with failure
window.href.location = '<?php echo base_url()."yourfailurecontroller/yourfailurefunction"; ?>';
}
}
});
});
});
</script>
</div>
<br/>
</body>
</html>
with the result you can redirect to the view that is in controller