0

My shared page layout,_CustomerLayout.cshtml has:

 <div class="navbar-collapse collapse">
      @Html.Partial("_LoginPartial")
 </div>

The _LoginPartial.cshtml has:

<ul class="nav navbar-nav navbar-right">
        <li>@Html.ActionLink("Hello, " + User.Identity.Name + "!", "UserProfile", "Home")</li>
        <li>
            <a href="~/ShoppingCart/Index" id="ShoppingCartSpace"><i class="fa fa-shopping-cart" aria-hidden="true" id="ShoppingCartIcon"></i></a>
            <span class="badge" id="BadgeIcon"></span>
        </li>
        <li>
            <a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
        </li>
    </ul>

The BadgeIcon is what I want to display in every View, so I made a script that would take the current user's shopping cart from database, calculate the total cart quantity on the fly, and then .ajax the return in the #BadgeIcon div

The script located at the end of _LoginPartial.cshtml is:

@section scripts
{
<script>     //never gets triggered

    $(document).ready(function () {
        $.ajax({
            type: "POST",
            url: '@Url.Action("getCartCount", "ShoppingCart")',
            success: function (data) {
                $('#BadgeIcon').html(data);
            }
        })
    });

</script>
}

Also posting this snippet from the ShoppingCartController:

[HttpPost]
    public ActionResult getCartCount()
    {
            var user = db.Users.FirstOrDefault(x => x.UserName == HttpContext.User.Identity.Name);
            var cartCount = user.ShoppingCarts.FirstOrDefault().ShoppingCartProducts.Sum(x => x.Quantity);

            return Json(cartCount);
    }

As you may tell, I am far from an expert on MVC, so any help on this would be greatly appreciated.

1
  • Are there any script errors in the debug console?
    – Jasen
    Jul 29, 2016 at 18:22

2 Answers 2

3

Posting the answer which was found by Pravin Tukadiya and Jasen:

Added

<script src="~/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script> <script src="~/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>

to _LoginPartial.cshtml and removed

@section scripts{
}
2

partial view has no layout so section will not work. so,try to remove section element and write code of javascript directly in partial view.

@section scripts //remove this
{
}
7
  • Didn't mention this when I asked the question,but I have already tried this to no avail
    – bankey
    Jul 29, 2016 at 17:57
  • 1
    did you check console of browser ? Jul 29, 2016 at 18:03
  • what will be return if shopping cart is empty ? I think your error is in your code side.. Jul 29, 2016 at 18:09
  • user.ShoppingCarts.FirstOrDefault()==null?0:user.ShoppingCarts.FirstOrDefault().ShoppingCartProducts.Sum(x => x.Quantity); write like this.. Jul 29, 2016 at 18:12
  • 1
    $ is not defined means jquery.js was not loaded before your partial view script executed.
    – Jasen
    Jul 29, 2016 at 20:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.