Develop Reference

Bootstrap classes(card) don't work in asp.net view

I'm trying to display a grid of cards with information retrieved by the backend, but it seems that the bootstrap classes are not working as intended. The layout.cshtml view appears to display bootstrap properly, and other views I have do too. Don't know if its just something with the .card and row/col classes or is a larger issue.
<div class="row">
#foreach (var product in Model)
{
<div class="col-4">
<div class="card" style="width: 18rem;">
<img class="card-img-top" style="width: 18rem;" src="#product.Url" alt="Card image cap">
<div class="card-body">
<h5 class="card-title">#product.Title</h5>
<p class="card-text">#product.Price</p>
</div>
</div>
</div>
}
</div>
What the page looks like:
https://imgur.com/a/8yEDxee

How to fix 'AspNetCore.Views_Home_Index.ExecuteAsync()' NullReference error in MVC

I'm setting up a simple ASP.NET Core MVC project that includes some partial views that I want to be rendered asynchronously. But it seems that, regardless whether they are rendered asynchronously or not I keep getting the same ExecuteAsync() NullReferenceException error.
I have checked all the models and the HTML code but it doesn't seem to work either way, always returning:
An unhandled exception occurred while processing the request.
NullReferenceException: Object reference not set to an instance of an
object. AspNetCore.Views_Home_Index.ExecuteAsync() in Index.cshtml,
line 4.
Index.cshtml:
#using BestDeal.ViewModels
#model HomeViewModel
#await Html.PartialAsync("ArtikalCarouselPocetna")
<h2>Istaknuti artikli</h2>
<div class="row">
#foreach (var artikal in Model.odabraniArtikli)
{
#Html.Partial("ArtikalPregled", artikal)
}
</div>
ArtikalCarouselPocetna partial view:
<div class="row carousel-holder marginTop1">
<div class="col-md-12">
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img class="slide-image" src="https://images-na.ssl-images-amazon.com/images/I/71t-J3VJtEL._SX425_.jpg" alt="">
</div>
<div class="item">
<img class="slide-image" src="https://zdnet1.cbsistatic.com/hub/i/r/2019/04/17/1f68c3a6-495e-4325-bc16-cc531812f0ec/thumbnail/770x433/84ff4194826e8303efb771cd377a854f/chuwi-herobook-header.jpg" alt="">
</div>
<div class="item">
<img class="slide-image" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKRl7BqXfZupIBH4N8i-tD45gVPctFV5jKTeTmOIADFhZ8J_DAYQ" alt="">
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>

Your error in, I think you model is null. So you can check it like this
if(model != null) then
#foreach (var artikal in Model.odabraniArtikli)
{
#Html.Partial("ArtikalPregled", artikal)
}
So, I see you view located in different folder, it's mean you need point full path
#await Html.PartialAsync("~/Views/Shered/ArtikalCarouselPocetna.cshtml")
but I suggest you better use
#{
await Html.RenderPartialAsync("~/Views/Shered/ArtikalCarouselPocetna.cshtml");
}
Alternatively, you can render a partial view with RenderPartialAsync. This method doesn't return an IHtmlContent. It streams the rendered output directly to the response. Because the method doesn't return a result, it must be called within a Razor code block:
#{
await Html.RenderPartialAsync("_AuthorPartial");
}
Since RenderPartialAsync streams rendered content, it provides better performance in some scenarios. In performance-critical situations, benchmark the page using both approaches and use the approach that generates a faster response.
https://learn.microsoft.com/en-us/aspnet/core/mvc/views/partial?view=aspnetcore-2.2
Also
I advise you use partial view with _ https://stackoverflow.com/a/10321458/8006943

C# Selenium webdriver button click

I am trying to click this button through Selenium web driver but it whatever I try, it says cannot find element.
<a class="button" href="#" id="enrollForm">ENROLL NOW</a>
I tried
driver.FindElement(By.XPath("//*[#id='enrollForm']")).Click();
Update:
This is the whole snippet. I want to click on the button "Enroll Now":
<div class="buttonContainerLanding">
<div class="buttonDiv">
<a class="button" href="#" id="enrollForm">ENROLL NOW</a>
</div>
<div class="buttonDiv">
<!-- <b class="buttonTitle">Need to Activate Your Card?</b> -->
<a class="button" href="#" id="activate">ACTIVATE CARD</a>
</div>
<div class="buttonDiv">
<!-- <b class="buttonTitle">Need to Activate Your Card?</b> -->
<a class="button" href="#" id="replace">REPLACE CARD</a>
</div>
</div>

To click on the element with text as ENROLL NOW you can use either of the following solutions:
Using LinkText:
driver.FindElement(By.LinkText("ENROLL NOW"));
Using CssSelector:
driver.FindElement(By.CssSelector("div.buttonContainerLanding div.buttonDiv>a.button#enrollForm"));
Using XPath:
driver.FindElement(By.XPath("//div[#class='buttonContainerLanding']//div[#class='buttonDiv']/a[#id='enrollForm' and text()='ENROLL NOW']"));

Controller method for shared layout view in MVC?

Question background:
I have a MVC site that implements BootStrap. Currently each page is based on a MasterLayout view page. This master contains a dropdown list that will be populated with the cart items in the sites shopping cart along with the carts total monetary value. Please note currently the details in the dropdown are fixed values in the HTML:
What I'm after:
I've tried searching for this but cant seem to find exactly the answer. I want to be able to populate the dropdown in the navbar with the cart contents each time a page is loaded. To do this I need a method to extract the cart item objects which are stored in a SESSION object variable. Currently my MasterLayout view is just that, its a view that has no controller associated with it.
How do I go about assigning some sort of method to my MasterLayout so I can pass the cart items model to the view which in-turn will be set to the dropdown each time the page is loaded?.
Here's the HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
#Styles.Render("~/Content/bootstrap.css")
#Styles.Render("~/Content/Styles.css")
#Scripts.Render("~/bundles/modernizr")</script>
</head>
<body>
<div class="navbar navbar-fixed-top">
<nav class="navbar navbar-default" role="navigation" id="nav">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand logo">HS<b>WH</b></a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>Products</li>
<li>About Us</li>
<li>Contact</li>
</ul>
<form class="navbar-form pull-right">
<input type="text" class="form-control" placeholder="Search this site..." id="searchInput">
<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
</form>
<form class="navbar-form pull-right">
<div class="btn-group btn-group-cart">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<span class="pull-left"><i class="fa fa-shopping-cart icon-cart"></i></span>
<span class="pull-left">Shopping Cart: 2 item(s)</span>
<span class="pull-right"><i class="fa fa-caret-down"></i></span>
</button>
<ul class="dropdown-menu cart-content" role="menu">
<li>
<a href="detail.html">
<b>Penn State College T-Shirt</b>
<span>x1 $528.96</span>
</a>
</li>
<li>
<a href="detail.html">
<b>Live Nation ACDC Gray T-Shirt</b>
<span>x1 $428.96</span>
</a>
</li>
<li class="divider"></li>
<li>Total: $957.92</li>
</ul>
</div>
</form>
</div>
</div>
</nav>
</div>
#RenderBody()
<footer>
<div class="container">
<div class="row">
<div class="col-sm-12 textAlignCenter">
<h5>Copyright © 2014 - Test Site</h5>
</div>
</div>
</div>
</footer>
<script>
$(document).ready(function () {
$('.dropdown-toggle').dropdown('toggle')
});
</script>
</body>
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</html>

I would probably do this using a child action invoked from the master layout.
#Html.Action("Cart")

On server side create action returns PartialViewResult, which render your cart model.
At front-end render your partial via #Html.Action("YourPartialCart",'CartController') or ajax call.

All Views have a controller associated with them because the views are inherits. E.g. when you create a view you set it's Layout to be equal to the master.cshtml file.
Your view has a Model associated with it.
You can tackle this a couple of ways.
The simplest would be to use something like HttpContext.Current.Items, which is a request unique collection of shared data accessible from anywhere during an HttpRequest.
The next would be to use inheritance on your models. For example, Create Models like this
MasterModel
-> CartPageModel (inherits MasterModel)
-> AccountSettingsModel (inherits MasterModel)
etc.
Then on your master page set the model to MasterModel via the #Model MasterModel code, and on your view it would be #Model CartPageModel.
In your controller the code will populate values on the base model MasterModel and it's derrived type CartPageModel.

Cart Summary In Layout

I develop an ecommerce application. I using C#, MVC and Entity Framework and Bootstrap.
I've saved cart item in my database. My question is :
I want to show cart's summary in my layout's top. But what's your suggestion for this operation.
Should i use a partial view for the cart's summary or another way?
And in other hand how can i read my cart's data from database every request. i cannot it in from controllers of course. because i want to show cart's summary top of the screen at every page. should i read it from application start or ? Any suggest me pls for this operations.
//_Layout.cshtml
<body>
<div class="container">
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" href="#">E-Commerce</a>
</div>
<form class="navbar-form navbar-left" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="Arama">
<span class="input-group-addon">
<i class="fa fa-search"></i>
</span>
</div>
</form>
<p class="navbar-text pull-right">
/* I want to see shopping cart summary in this section*/
<i class="fa fa-shopping-cart"></i>
<span id="cartTotal">
</span>
(<span id="cartItemCount"></span>)
</p>
<p class="navbar-text pull-right">Log In</p>
<p class="navbar-text pull-right">Register</p>
</nav>
</div>
<div class="container">
#RenderBody()
</div>
</body>
</html>

you can use of this solution
in Controller
[ChildActionOnly]
public ActionResult CartSummary()
{
ViewData["CartCount"] = 3; // count Qty in your cart
return PartialView("CartSummary");
}
right click and Add view and select PartialView then in PartialView
#ViewData["CartCount"]
in layout, where you want to show cart's qty
#{Html.RenderAction("CartSummary", "controllerName");}