First of all, I know several people have encountered a bug with a similar error message and I have gone through a lot of them but didn't find one that could solve my own problem.
Using the developer tools, I could see the error messages returned. The two messages are:
Failed to load resource: the server responded with a status of 500 (Internal Server Error)
and
Uncaught TypeError: Cannot read property 'name' of undefined
I am submitting student data from this form:
<form method="post" id="school_registration_form">
<input type="hidden" name="_token" value="">
<input type="text" id="name" name="name">
<div id="name_error"></div>
<input type="email" id="school_email" name="school_email">
<div id="school_email_error"></div>
<input type="email" id="your_email" name="your_email">
<div id="your_email_error"></div>
<input type="text" id="phone" name="phone" >
<div id="phone_error"></div>
<input type="password" id="password" name="password">
<div id="password_error"></div>
<input type="password" id="password_confirmation" name="password_confirmation" >
<div id="password_confirmation_error"></div>
<div class="col-sm-offset-3 col-sm-10">
<button type="submit" class="btn btn-success">Create Account</button>
</div>
through this route:
Route::post('store', ['as' => 'school/store', 'uses' => 'SchoolController@store']);
to this function:
public function store(SchoolCreateUserRequest $request){
$user = User::create([
'name' => $request->input('name'),
'inst_email' => $request->input('school_email'),
'alt_email' => $request->input('your_email'),
'phone' => $request->input('phone'),
'password' => bcrypt($request->input('password')),
]);
Auth::login($user);
}
Here are the validation rules for the form request:
public function rules(){
return [
'name' => 'required|unique:users|min:8',
'school_email' => 'required|email',
'your_email' => 'required|email|unique:users',
'phone' => 'required',
'password' => 'required|confirmed|min:4',
'password_confirmation' => 'required'
];
}
and finally the most important part. Here is the JQuery/Ajax code that submits values to the server:
$(function(){
$.ajaxSetup({
headers: {
'X-CSRF-Token': $('meta[name="_token"]').attr('content')
}
});
// when form submit button is clicked
$('#ub_registration_form').submit(function (e) {
e.preventDefault();
var name = $('#name').val();
var school_email = $('#school_email').val();
var your_email = $('#your_email').val();
var phone = $('#phone').val();
var password = $('#password').val();
var password_confirmation = $('#password_confirmation').val();
var token = $("input[name=token]").val();
var route = "school/store";
$.ajax({
url: route,
type: 'post',
datatype: 'json',
data: {
'name' : name,
'school_email' : school_email,
'your_email' : your_email,
'phone' : phone,
'password' : password,
'password_confirmation' : password_confirmation,
'_token': $('meta[name="_token"]').attr('content')
},
success: function(msg){
notify('Your account was successfully created.', 'success', "ub");
logged_in_user();
},
error: function(data){
var name = data.responseJSON.name;
var school_email = data.responseJSON.school_email;
var your_email = data.responseJSON.your_email;
var phone = data.responseJSON.phone;
var password = data.responseJSON.password;
var password_confirmation = data.responseJSON.password_confirmation;
$('#name_error').html(data.responseJSON.name);
if (name != null && name != "") {
$('#name').css("border", "1px solid red");
}
$('#school_email_error').html(data.responseJSON.school_email);
if (school_email != null && school_email != "") {
$('#school_email').css("border", "1px solid red");
}
$('#your_email_error').html(data.responseJSON.your_email);
if (your_email != null && your_email != "") {
$('#your_email').css("border", "1px solid red");
}
$('#phone_error').html(data.responseJSON.phone);
if (phone != null && phone != "") {
$('#phone').css("border", "1px solid red");
}
$('#password_error').html(data.responseJSON.password);
if (password != null && password != "") {
$('#password').css("border", "1px solid red");
}
$('#password_confirmation_error').html(data.responseJSON.password_confirmation);
if (password_confirmation != null && password_confirmation != "") {
$('#password_confirmation').css("border", "1px solid red");
}
}
});
});
});
Sorry for the lengthy code. Tried to reduce it as much as i could. Thanks for any help.
via
Chebli Mohamed
