What i want to do is that, there is a div containing icon sets but i want make a row with 5 icons per row. So i wrote something like this.
<div id="icons-list1" class="icons-list">
#{ int catCount = 0; }
#foreach (var catItem in Model.Categories)
{
if (catCount == 0)
{
<div class="icons-list-row">
}
<label title="#catItem.Name" data-selected-color="##catItem.ColorCode" data-position="n" class="icon static big tooltip" original-title="Tooltip Title">
<img alt="#catItem.Name" src="#Url.Content(#BonubonUrlHelper.CategoryImages + "dark/music.png")">
<input name="categories" value="#catItem.Id" type="checkbox" />
</label>
catCount++;
#if (catCount == 5)
{
</div>
catCount = 0;
}
}
</div>
But i got an error, saying foreach statement has no ending block. I tried everything, but i couldn't manage to make it work. What i make wrong? I'm new to razor syntax.
Thanks
Make sure you escape html statements when this sort of problems appears.
In your case, however, the actual problem is with the # escape character before the second if statement, which is not needed:
<div id="icons-list1" class="icons-list">
#{ int catCount = 0; }
#foreach (var catItem in Model.Categories)
{
if (catCount == 0)
{
#:<div class="icons-list-row">
}
<label title="#catItem.Name" data-selected-color="##catItem.ColorCode" data-position="n" class="icon static big tooltip" original-title="Tooltip Title">
<img alt="#catItem.Name" src="#Url.Content(#BonubonUrlHelper.CategoryImages + "dark/music.png")">
<input name="categories" value="#catItem.Id" type="checkbox" />
</label>
catCount++;
if (catCount == 5)
{
#:</div>
catCount = 0;
}
}
</div>
The problem is, that you have escaped the if in the line
#if (catCount == 5)
You start a code block when you write a line with something like #foreach { where you don't have to escape C# code anymore.
Just remove the # in front of the if and the error disappears.
Related
I am iterating through elements to get their values.
If a certain tag with class "a-btn" is found, the loop should stop.
Unfortunately it continues as the text "Irrelevant" still shows up, could someone pls have a look what I do wrong ?
My goal is to stop the loop once it reaches:
tag a class="a-btn"
HTML:
<p class="a-footnote">Higher numbers indicates higher damage potential for that element.</p>
<div class='ad-wrapper'><div id='div-gpt-ad-1555484300289-0'></div>
<h2 class="a-header--2" id="hl_3">Some text 1</h2>
<h3 class="a-header--3" id="hm_2">Some text 2</h3>
<p class="a-paragraph"><img src="data:image/gif;base64,R0lAAABAAEAAAIBRAA7"></p>
<p class="a-paragraph">This is an <a class="a-link" href="/xxx/xxx/archives/xx">Example</a>, which is <b class="a-bold">usefull</b>!</p>
<p class="a-paragraph"><a class="a-btn" href="/xxx/xxx/archives/xx"><span>Irrelevant</span></a></p>
My code:
for (Element item : doc.select("p[class=a-footnote]")) {
Elements siblings = item.nextElementSiblings();
if (siblings.select("h2[id=hl_3]").size() > 0) {
Log.w("PAR-rewTitleTEST", siblings.text());
}
if (siblings.select("h3[id=hm_2]").size() > 0) {
Log.w("PAR-rewardsDescr", siblings.text());
}
if (!siblings.select("a").attr("class", "a-btn").isEmpty()) {
Log.w("PAR-STOP", "STOPPED!");
break;
}
}
I want to add Recaptcha, the second version, not another version, and I want it to be in ASP.NET Core, not MVC, and I searched a lot and did not find the solution.. I hope for help
I have a login controller :
public IActionResult Login([Bind("Username , Password")] User userLogin)
{
const string id = "id";
var auth = _context.Users.Where(x => x.Username == userLogin.Username &&
x.Password == userLogin.Password).SingleOrDefault();
var x = _context.Users.Where(x => x.Username == userLogin.Username && x.Password
== userLogin.Password).Select(i => i.UserId).FirstOrDefault();
if (auth != null)
{
// 1 > admin
// 2 > Accountant
// 3 > customer
switch (auth.RoleId)
{
case 1: // admin
HttpContext.Session.SetInt32(id, (int)x);
return RedirectToAction("Index", "Home");
case 2:
HttpContext.Session.SetInt32(id, (int)x);
return RedirectToAction("AccountantDashboard", "Home");
case 3:
HttpContext.Session.SetInt32(id, (int)x);
return RedirectToAction("Home", "Home");
}
}
return View();
}
and another for view (head and body)
<form asp-action="Login" enctype="multipart/form-data">
<div class="input-group">
<label asp-for="Username" class="input--style-2" placeholder="username"></label>
<input asp-for="Username" class="input--style-2" />
<span asp-validation-for="Username" class="text-danger"></span>
</div>
<div class="input-group">
<label asp-for="Password" class="input--style-2" placeholder="Password"></label>
<input asp-for="Password" type="password" class="input--style-2" />
<span asp-validation-for="Password" class="text-danger"></span>
</div>
<div class="p-t-30">
<button class="btn btn--radius btn--green" type="submit" value="Create">Login</button>
</div>
<div style="position: relative ; left: 350px ; bottom: -50px">
<a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Home">Or back to home page</a>
</div>
</form>
As far as I know, the reCaptcha "v2" is build based on js and we could directly use it inside the html page.
We could use it like this, firstly put below codes inside your view and it is used to put the g-recaptcha and it contains a callback method, if this method is called that means the user has passed the validation and you could show the button by using JQuery or javascript.
<div class="g-recaptcha" data-callback="recaptcha_callback" data-sitekey="xxxxx"></div>
Like this:
<script type="text/javascript">
function recaptcha_callback(){
$('#login).show();
}
</script>
More details, you could refer to this article.
I am creating a RazorComponent in my asp.net core mvc application.
The component has a html list in it which is dynamically generated according to the number of item fetched from the model.
<ul>
#{
foreach (var prod in newProductList)
{
if (prod.Brand.Equals("1") && prod.Class.Equals("2"))
{
<li #onclick="(() => AddToSaleList(prod.Product, prod.ProductId, prod.SellRate))">
<div class="posSelected-item">
<span class="posFoodname inline-block"> #prod.Product </span>
<span class="inline-block posSeletedPrice">#prod.SellRate</span>
<span class="posFoodtotal-item inline-block">
<i class="inline-block fas fa-minus" #onclick="() => Quantity(2)"></i>
<span class="posincrementItem">#changeQuaitity</span>
<i class="inline-block fas fa-plus" #onclick="() => Quantity(1)"></i>
</span>
</div>
</li>
}
}
}
</ul>
The UI looks like this (as expected)
The Problem
The Plus and Minus buttons on the UI are supposed to increment or decrement the quantity of each item on the list.
The function I have written is
int changeQuaitity = 0;
public void Quantity(int e)
{
if (e == 1)
{
changeQuaitity++;
}
else if (e == 2)
{
changeQuaitity--;
}
}
However, as you can see since the increment is bound with the parameter changeQuantity so clicking on any of the Plus or Minus button changes the quantity of each list item simultaneously.
How do I modify the code to identify one list item and change quantity of only that item when the button on the list is clicked.
You need a separate counter for each entry, so I recommend making what I call a "carrier class" to carry quantity info along with each item:
class countableProducts {
Product prod {get; set;}
int quantity;
}
In your initialization:
foreach (var item in newProductList)
countableProductsList.Add( new countableProduct() { prod = item });
Then in your loop
foreach (var item in countableProductsList){
// everything looks like item.prod.(property)
<i class="inline-block fas fa-minus" #onclick="() => item.quantity--;"></i>
<span class="posincrementItem">#item.quantity</span>
<i class="inline-block fas fa-plus" #onclick="() => item.quantity++;"></i>
}
I don't have enough of your code to make a working example without basically writing the whole program, but hopefully you can see my idea.
I have a very basic hide/show div function set up for when people click a certain radio button. In one of the hidden divs I need to create a form however when I add input fields to the hidden div my function stops working.
<div id="tabs">
<div id="nav">
<input type="radio" name="primary_contact_director" value="Yes" class="div1">Yes</input>
<input type="radio" name="primary_contact_director" value="No" class="div2">No</input>
</div>
<div id="div1" class="tab">
<p>this is div 1</p>
</div>
<div id="div2" class="tab">
<p>this is div 2</p>
</div>
</div>
<script type="text/javascript" charset="utf-8">
(function(){
var tabs =document.getElementById('tabs');
var nav = tabs.getElementsByTagName('input');
/*
* Hide all tabs
*/
function hideTabs(){
var tab = tabs.getElementsByTagName('div');
for(var i=0;i<=nav.length;i++){
if(tab[i].className == 'tab'){
tab[i].className = tab[i].className + ' hide';
}
}
}
/*
* Show the clicked tab
*/
function showTab(tab){
document.getElementById(tab).className = 'tab'
}
hideTabs(); /* hide tabs on load */
/*
* Add click events
*/
for(var i=0;i<nav.length;i++){
nav[i].onclick = function(){
hideTabs();
showTab(this.className);
}
}
})();
This code works however when I add
<label class="title">First Name:</label>
<input type="text" name="first_name" class="form">
<label class="title">Last Name:</label>
<input type="text" name="last_name" class="form">
<label class="title">Business Address:</label>
<span class="instructions">Please enter a physical address. P.O. Boxes are not acceptable for filing.<br>
If your business is run out of your home, please list that address.</span><br>
<input type="text" name="business_address" class="form">
<label class="title">City:</label>
<input type="text" name="business_city" class="form">
<label class="title">State</label>
<select name="business_state">
<option value="California">California</option>
</select>
<label class="title">Zip Code:</label>
<input type="text" name="business_zip" class="form">
<label class="title">Business Phone Number:</label>
<input type="text" name="business_phone" class="form"><br>
to my div2 it stops working.
Hopefully this is a clear explanation. Any help is always appreciated!
In your hideTabs() function, you've got two typos.
First, you're iterating through the tab[] array, but you're checking it against the length of the nav[] array. This works because you have the same number of elements in your first example, but that's just a coincidence. If you evaluate it against the tab[] array's length, it will work better. The other problem you have is that your for loop ends at greater-than-or-equal-to length. THe problem is that arrays start counting at zero, so if the length is 3, the items on the list are tab[0], tab[1], and tab[2]. your code was trying to set something for tab[3], which didn't exist.
Here's the working code:
/*
* Hide all tabs
*/
function hideTabs(){
var tab = tabs.getElementsByTagName('div');
for(var i=0;i<tab.length;i++){
if(tab[i].className == 'tab'){
tab[i].className = tab[i].className + ' hide';
}
}
}
In the future, you should look into using the javascript console in Chrome (or any other browser) to check for errors if your scripts stop working—usually there's an error that that will give you hints as to what's happening.
having some trouble with my razor syntax
gives a Parsor error saying that
The foreach block is missing a closing "}" character
<ul>
#{var client = "null";}
#foreach (var instance in Model)
{
if (instance.tbl_Policy.tbl_Client.txt_clientName != client)
{
client = instance.tbl_Policy.tbl_Client.txt_clientName;
</ul><h1>#client</h1>
<ul>
}
<li>
#instance.tbl_Policy.txt_policyNumber -
Assigned to : #instance.aspnet_Membership.aspnet_User.UserName
#instance.ATLCheckType.Question
<button type="button" rel="<%:instance.ATLCheckInstanceId.ToString()%>">DelFiled</button>
<button type="button" rel="<%:instance.ATLCheckInstanceId.ToString()%>">DelLineItem</button>
</li>
}
</ul>
Razor cannot handle imbalanced HTML tags in code blocks.
Change your if block to treat the imbalanced tags as plain text:
if (instance.tbl_Policy.tbl_Client.txt_clientName != client)
{
client = instance.tbl_Policy.tbl_Client.txt_clientName;
#:</ul><h1>#client</h1>
#:<ul>
}
The code should be refactored to correctly support balanced tags
#foreach (var groupedClient in Model.GroupBy(i => i.tbl_Policy.tbl_Client.txt_clientName))
{
<ul>
<h1>#groupedClient.Key</h1>
foreach(var instance in groupedClient)
{
<li>
#instance.tbl_Policy.txt_policyNumber -
Assigned to : #instance.aspnet_Membership.aspnet_User.UserName
#instance.ATLCheckType.Question
<button type="button" rel="#instance.ATLCheckInstanceId.ToString()">DelFiled</button>
<button type="button" rel="#instance.ATLCheckInstanceId.ToString()">DelLineItem</button>
</li>
}
</ul>
}
What's with all of the <%: %> stuff in there? You need to use the # syntax.
<ul>
#{var client = "null";}
#foreach (var instance in Model)
{
if (instance.tbl_Policy.tbl_Client.txt_clientName != client)
{
client = instance.tbl_Policy.tbl_Client.txt_clientName;
</ul><h1>#client</h1>
<ul>
}
<li>
#instance.tbl_Policy.txt_policyNumber -
Assigned to : #instance.aspnet_Membership.aspnet_User.UserName
#instance.ATLCheckType.Question
<button type="button" rel="#instance.ATLCheckInstanceId.ToString()">DelFiled</button>
<button type="button" rel="#instance.ATLCheckInstanceId.ToString()">DelLineItem</button>
</li>
}
</ul>