I was running Angular 5 and Phoenix framework and I’m trying to send a POST request to Phoenix. i got 422 Unprocessable error
I have the following code:
enrollment.component.ts
saveEnrollment()
{
this.enrservice.saveEnrollment(this.enrollment)
.then(
(enrollment: Enrollment) => {
// Show the success message
this.snackBar.open('Enrollment success', 'OK', {
verticalPosition: 'top',
duration : 6000
});
});
}
enrollment.component.ts
saveEnrollment(enrollment: Enrollment)
{
return new Promise((resolve, reject) => {
this.http.post(API_URL, enrollment)
.subscribe((response: any) => {
resolve(response);
}, reject);
});
}
enrollment.model.ts
export class Enrollment {
id: number;
firstName: string;
lastName: string;
address: string;
city: string;
state: string;
postalCode: string;
constructor(enrollment?)
{
enrollment = enrollment || {};
/* this.id = enrollment.id || FuseUtils.generateGUID(); */
this.id = enrollment.id || '';
this.firstName = enrollment.firstName || '';
this.lastName = enrollment.lastName || '';
this.address = enrollment.address || '';
this.city = enrollment.city || '';
this.state = enrollment.state || '';
this.postalCode = enrollment.postalCode || '';
}}
and when i try to submit the form…i got that result:
[info] POST /api/enrollments
[debug] Processing with UmappWeb.EnrollmentController.create/2
Parameters: %{"address" => "", "city" => "", "firstName" => "", "id" => "",
"lastName" => "", "postalCode" => "", "state" => ""}
Pipelines: [:api]
[info] Sent 422 in 0┬Ás
Not sure what I’m doing wrong. please i need advise or help! thank you
idi527
March 1, 2018, 7:35pm
2
this.enrollment seems to be {} for some reason.
422 is probably returned because of errors in ecto changeset? Didn’t know phoenix does this automatically. Do you have any action_fallbacks for UmappWeb.EnrollmentController?
I don’t have fallback actions, but for this case as phoenix is serving as an API, i used “Cors_plug” .enrollment.controller.ex
def create(conn, enrollment_params) do
with {:ok, %Enrollment{} = enrollment} <- UME.create_enrollment(enrollment_params) do
conn
|> put_status(:created)
|> put_resp_header("location", enrollment_path(conn, :show, enrollment))
|> put_resp_content_type("application/json")
|> render("show.json", enrollment: enrollment)
end
end
router.ex.
scope "/api", UmappWeb do
pipe_through :api
resources "/enrollments", EnrollmentController, except: [:new, :edit]
options "/enrollments", EnrollmentController, :options
options "/enrollments/:id", EnrollmentController, :options
end
Harrrrr, it seems the problem is the angular’s part…when i investigated the request payload par t shown blank data for each input sent to the server(phoenix framework) but i don’t know where i’m wrong /////
idi527
March 2, 2018, 3:50pm
6
You would need to provide more information, probably. Or try to trace this enrollment object up to its creation, and see why it is empty.
As you said @idi527 i traced it and i fixed the code responsible of that …it was “client-side”. But the other error i got is 400 Bad request and it seems some parameters are missing in my code, but which i don’t know.
outlog
March 6, 2018, 11:47am
8
the error message looks pretty good - "could not find matching App.Controller.create clause…
how does your create function look like in the controller?
@outlog
def create(conn, %{"enrollment" => enrollment_params}) do
with {:ok, %Enrollment{} = enrollment} <- UME.create_enrollment(enrollment_params) do
conn
|> put_status(:created)
|> put_resp_header("location", enrollment_path(conn, :show, enrollment))
|> render("show.json", enrollment: enrollment)
end
end
Just copy the line from the error page, below “The request parameters are:”
Paste that into a text editor, now take your create function head parameters and paste it below that, %{"enrollment" => enrollment_params}. Can they match?
@amnu3387 like that…?
outlog
March 6, 2018, 1:06pm
12
yes, look at:https://elixir-lang.org/getting-started/pattern-matching.html#pattern-matching-1
iex(3)> %{"enrollment" => enrollment_params} = %{"address" => "s", "city" => "s", "firstName" => "f", "lastName" => "s", "postalCode" => "s", "state" => "s"}
** (MatchError) no match of right hand side value:
so the clause in your create function doesn’t pattern match your params…
most likely you’ll want
def create(conn, enrollment_params) do
@outlog yes you right and i know that the create function mismatched the params… but the fact is that i’m pretty sure that correctly matched on my client-side code until proof to the contrary.def create(conn, enrollment_params) do will throw a 422 (unprocessable entity).
everything works now… it was due to a mismatched TYPO… on server side Repo migration in the database. that’s why i got 422 (unprocessable entity)
Thank you @all of you.
