Angular $http post not returning Json response

Question

Recipes/CreateRecipe was successful but return Json is not returning anything and goes to the next function which is the alert Error CreateRecipe null

script

$scope.createRecipe = function (recipe) {

$http({
    method: 'POST',
    url: '/Recipes/CreateRecipe',
    data: JSON.stringify(recipe)
}).then(function (response) {
    if (response!=null) {
        $scope.recipeID = response.data;
        alert($scope.recipeID)
    }
    else {
        alert("get response failed! " + response.data)
    }
}, function (response) { alert('Error CreateRecipe '+response.data); });

};

controller

[HttpPost]
    public JsonResult CreateRecipe([Bind(Include = "Id,Name")] Recipe vm)
    {
            Recipe recipe = new Recipe();
            recipe.Name = vm.Name;
            db.Recipes.Add(recipe);
            db.SaveChanges();
            return Json(recipe.Id, JsonRequestBehavior.AllowGet);
    }

I tried a lot of things like adding ModelState.IsValid and checking if recipe.Id is null but it wasn't. I also tried changing JsonResult to ActionResult. Sometimes the alert says get response failed! sometimes it's Error CreateRecipe null.

Even if I put recipe.Id in an int before returning it, it still doesn't work.

can you post what you see inside console.log(response.data); — Sajeetharan
– Sajeetharan, Commented Jan 10, 2018 at 3:59
@Sajeetharan Create Recipe http post doesn't return a response and just goes to the next function which is the error alert and the response there is null — Len
– Len, Commented Jan 10, 2018 at 4:43
When you return Json(recipe.Id, ..), does recipe.Id have a value? — Sajal
– Sajal, Commented Jan 10, 2018 at 7:38
You should consider making the json result async too, when you open the db layer, the thread probably doesn't wait for recipe.Id and returns a null/undefined value back to angularjs. — Sajal
– Sajal, Commented Jan 10, 2018 at 7:53

Sajal · Accepted Answer · 2018-01-10 08:10:35Z

1

Consider making the JsonResult asynchronous too using the async task and save changes to database using await db.SaveChangesAsync();.

public async Task<JsonResult> CreateRecipe([Bind(Include = "Id,Name")] Recipe vm)
{
    int recipeId = -1;

    if(vm != null) {
        Recipe recipe = new Recipe();
        recipe.Name = vm.Name;
        db.Recipes.Add(recipe);
        await db.SaveChangesAsync();
        recipeId = recipe.Id;

        if(recipeId > 0) {
            return Json(recipeId, JsonRequestBehavior.AllowGet);
        }
    }

    return Json(false, JsonRequestBehavior.AllowGet);
}

answered Jan 10, 2018 at 8:10

Sajal

4,4111 gold badge22 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular $http post not returning Json response

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related