Getting error 422 (Unprocessable Entity) while doing AJAX in Laravel - php

Question

I am trying to insert data of a user in the database using ajax. I have done it without it and it worked fine. Now it is giving me error 422. The code is given below:
UserController.php
public function store(Request $request)
{
$request->validate([
'name' => ['required', 'string', 'max:255'],
'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
'password' => ['required', 'string', 'min:8', 'confirmed'],
]);
$inputArray = array(
'name' => $request['name'],
'email' => $request['email'],
'password' => Hash::make($request['password']),
);
$value = User::create($inputArray);
!is_null($value) ? $message = "User Added Successfully" : $message = "User not Added";
return json_encode(array($message));
}
Index.blade.php
<form method="post" {{-- action="{{ route('users.store') }}" --}} id="createform">
<input type="hidden" name="_token" id="csrf" value="{{Session::token()}}">
<div class="input-group mb-3">
<input type="text"
name="name"
class="form-control #error('name') is-invalid #enderror"
value="{{ old('name') }}"
placeholder="Full name"
id="name">
<div class="input-group-append">
<div class="input-group-text">#icon('user')</div>
</div>
#error('name')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
<div class="input-group mb-3">
<input type="email"
name="email"
value="{{ old('email') }}"
class="form-control #error('email') is-invalid #enderror"
placeholder="Email"
id="email">
<div class="input-group-append">
<div class="input-group-text">#icon('envelope')</div>
</div>
#error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
<div class="input-group mb-3">
<input type="password"
name="password"
class="form-control #error('password') is-invalid #enderror"
placeholder="Password"
id="password">
<div class="input-group-append">
<div class="input-group-text">#icon('lock')</div>
</div>
#error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
#enderror
</div>
<div class="input-group mb-3">
<input type="password"
name="password_confirmation"
class="form-control"
placeholder="Retype password"
id="password_confirmation">
<div class="input-group-append">
<div class="input-group-text">#icon('lock')</div>
</div>
</div>
<div id="msg"></div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary" id="btnadd">Add User</button>
</div>
</form>
jqajax.js
jQuery(function ($) {
jQuery("#btnadd").on('click', addInfo);
function addInfo(e) {
e.preventDefault();
var name = jQuery('#name').val();
var email = $("#email").val();
var password = $("#password").val();
var password_confirmation = $("#password_confirmation").val();
$.ajax({
url: "/users",
method: "POST",
data: {
_token: $("#csrf").val(),
name: name,
email: email,
password: password,
password_confirmation: password_confirmation
},
success: function (dataResult) {
var dataResult = JSON.parse(dataResult);
msg = "<div class='alert alert-dark mt-3'>dataResult.message</div>";
$("#msg").html(msg);
$("#createform")[0].reset();
showdata();
},
});
}
});
The Error I am getting is app.js:14653 POST http://127.0.0.1:8000/users 422 (Unprocessable Entity)

Answer 1

function store(Request $request)
{
$validator = Validator::make($request->all(), [
'name' => ['required', 'string', 'max:255']
]);
if ($validator->fails()) {
$errors = $validator->errors();
$returnError['name'] = $errors->first('name');
return json_encode($returnError);
} else {
$inputArray = array(
'name' => $request['name']
);
$value = User::create($inputArray);
!is_null($value) ? $message = "User Added Successfully" : $message = "User not Added";
return json_encode(array($message));
}
}