Traverse C# collection from CSHTML in JQUERY - c#

My View(cshtml) has around 10 div tags at root level.
Each div has nested multiple div inside it.
The HTML code is below. As there is foreach loop, i have multiple such DIV
foreach(var result in results)
{
<div class="itemRow" id= value data-List=#invoiceDetail>
<div class="itemStatus paid"><span>Paid</span></div>
<div class="itemDetails" style="display: none;">
<div class="itemContainer">
<div class="left"> <table class="stripes"> </div>
</div>
<div class="itemContainer" id="_orderId"> <h4>Order details</h4> </div>
<div class="itemContainer">
<div class="left"> <strong>Download PDF</strong></a> </div>
<div class="right"> You can download paper invoice </div>
</div>
<div class="border hundra"><div></div></div>
</div>
</div>
}
Each div at root has an attribute data-List from server side. This attribute has a c# Collection as value. I need to read the value from data-List attribute of that particular div and traverse through it.
I tried to use the .attr method but what i received the data type of the collection.
Please suggest a way forward.
Thanks in advance.

Related

How to get an element where the attribute by which I select it can change in Selenium Webdriver C#?

I want to get the src attribute of some elements like this:
<div class="product-tile restored" data-v-27bc931c=""><a href="/p/apple-iphone-11-pro/R1NFM0000000T7"
class="product-tile__link">
<div class="product-tile__image product-img-front">
<img alt="Apple iPhone 11 Pro"
data-src="/img?width=300&height=300&action=resize&url=/catalog/product/6/f/6f7466aef1ae14ee4fe9764531ef69a1.jpg"
src="/img?width=300&height=300&action=resize&url=/catalog/product/6/f/6f7466aef1ae14ee4fe9764531ef69a1.jpg"
lazy="loaded">
<div class="image-loading"></div>
<!---->
</div>
<div class="product-tile__description">
<div title=" iPhone 11 Pro" class="product-tile__name"><span class="product-tile__brand">Apple</span> iPhone
11 Pro
</div>
<!---->
</div>
<div class="product-tile__footer">
<div class="product-tile__condition">
<div>Various conditions<span class="colors"><span class="dot">•</span>4 Colors</span></div>
</div>
<div class="product-tile__price">
<div class="price" data-v-678b2a80="">
<div class="current-price" data-v-678b2a80="">
<div class="from" data-v-678b2a80="">from</div>
<div data-testid="productPrice" class="amount" data-v-678b2a80="">
$647.00
</div>
</div>
<div data-v-678b2a80=""><span class="amount amount--del" data-v-678b2a80="">$1049.00</span> <span
class="amount amount--save" data-v-678b2a80="">Save
$402.00</span></div>
</div>
</div>
</div>
<div class="product-tile__loading"></div>
</a>
<!---->
</div>
I'm using driver.FindElement(By.CssSelector("img[lazy='loaded")) but the problem is that this attribute can also be loading. When I try driver.FindElement(By.TagName("img")) that doesn't work.
I don't want to use Try and Catch. How to can I get the src? Here is the website that i want to scrape
To consider both the cases, when value of lazy attribute is loaded and loading, you can use comma seperated values for the css-selectors and use the following locator strategy:
driver.FindElement(By.CssSelector("img[lazy='loaded'], img[lazy='loading']"))
References
You can find a couple of relevant detailed discussions in:
Any built-in way for branching waits with OR conditions?
WebDriverWait for multiple conditions (OR logical evaluation)
selenium two xpath tests in one

How do I check checkboxes on a page using IWebDriver in selenium C#?

I need to select multiple checkbox to Submit the form and the following code response in HTML format.
Here i have 4 check box. when i have launch the browser then first 3 checkbox is always checked and last one always Unchecked. Now i want first 3 checkbox should be uncheck and last one will be checked .how do i this with selenium c#
<div class="formSubSection">
<h4>
Details:</h4>
<div class="formField">
<div class="formFieldCheckBox">
<span title="Imported selector"><input id="aul00_ContentPlaceHolder1_aul02_chkVan" type="checkbox" name=aul00$ContentPlaceHolder1$ctl02$chkVan" checked="checked"><label for="aul00_ContentPlaceHolder1_ctl02_chkVan"> Is the Helpdesk?</label></span>
</div>
</div>
<div class="formField">
<div class="formFieldCheckBox">
<span title="home selector"><input id="aul00_ContentPlaceHolder1_ctl02_chkHome" type="checkbox" name="aul00$ContentPlaceHolder1$ctl02$chkHome" checked="checked"><label for="ctl00_ContentPlaceHolder1_aul02_chkMotorHome"> home?</label></span>
</div>
</div>
<div class="formField">
<div class="formFieldCheckBox">
<span title="Imported selector"><input id="aul00_ContentPlaceHolder1_ctl02_chkHorseBox" type="checkbox" name="aul00$ContentPlaceHolder1$aul02$chkHorseBox" checked="checked"><label for="aul00_ContentPlaceHolder1_aul02_chkHorseBox"> Is the vehicle?</label></span>
</div>
</div>
<div class="formField">
<div class="formFieldCheckBox">
<span title="car selector"><input id="aul00_ContentPlaceHolder1_aul02_chkCar" type="checkbox" name="aul00$ContentPlaceHolder1$ctl02$chkCar" checked="checked"><label for="ctl00_ContentPlaceHolder1_aul02_chkCar"> Is the Driver?</label></span>
</div>
</div>
</div>
It depends are you web elements have dynamical id and names.
I wold suggest solution to get all 4 elements (according to your post, I do not know rest of the DOM) and just to iterate trought the for loop. Something like
for(int i=0;i<driver.findElements(By.Class("formFieldCheckBox"));i++)
{
if(i>=5)
{
if(!driver.findElements(By.Class("formFieldCheckBox")).get(i).isSelected())
driver.findElements(By.Class("formFieldCheckBox")).get(i).click();
}
else
{
if(driver.findElements(By.Class("formFieldCheckBox")).get(i).isSelected())
driver.findElements(By.Class("formFieldCheckBox")).get(i).click();
}
}
This is the Java solution, but almost same code is for C#. Try it and let me know did it help.

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

Regexp to extract inner content of a html tag

I'm looking for a regex that extracts the content of a html tag. In this case, I need to extract and parse the content of a div element. The HTML code inside the div element can be anything and I need to extract all.
I'm using the next regexp, but doesn't work in all cases.
<div\s+id="body"[^>]*>(?<PARAM1>(?:(?:(?!<div[^>]*>|</div>).)+|<div[^>]*>[\s\S]*?</div>)*)</div>
It doesn't works because extracted group PARAM1, stops in a closing div tag element before the desired one, and I can't found why.
The HTML looks like this:
(...any HTML...)<div id="body">
<div class="container">
<ul class="breadcrumb">...SOME <li><p>....
</ul>
<h1>...</h1>
<div class="row">
<div class="span8">
<dl class="dl-horizontal">
<dt>...</dt>
<dd>..</dd>
<dt>..</dt>
<dd>..</dd>
</dl>
<hr/>
<dl class="dl-horizontal">
<dt>..</dt>
<dd>..</dd>
</dl>
</div>
<div class="span4">
<p class="text-center">
<img ...>
</p>
</div> **(STOPS HERE)**
</div>
<div> .... ANY HTML </div>
</div> (...more HTML...)
Thanks in advance,

Linq to xml - access deep element

In C# i need to access element that is nested in many other elements. I could write a query by naming all of elements but that would be very time consuming. Is there any easy way to do this or maybe some generator?
for example i have a xml:
<div id="list_offers">
<div class="container">
<div id="header">
<div class="row">
<div class="space-on-sides">
<div class="sixteen columns relative">
<div class="logo">
<a href="/">
<img src="/images/design_resp/design/logo_profesia.png" width="113" height="76" alt="PROFESIA.SK - práca, zamestnanie, ponuky práce, brigáda, voľné pracovné miesto" title="PROFESIA.SK - práca, zamestnanie, ponuky práce, brigáda, voľné pracovné miesto" />
</a>
</div>
<div class="right-panel">
<a class="login-company small red button nice radius right hide-on-phones margin-on-left" title="Vstup pre firmy" href="/login_person.php?action=company_login">Vstup pre firmy</a>
<a class="login-company small red button nice radius right show-on-phones margin-on-left" href="/login_person.php?action=company_login">Firmy</a>
<a rel="nofollow" id="login_modal" class="small gray button nice radius right" title="Prihláste sa do konta" href="/login_person.php?action=login">Prihlásiť</a>
<div class="search">
<div class="relative hide-on-phones">
<form name="fulltextsearch" id="fulltextsearch" action="/search.php" method="get" onsubmit="if(document.getElementById('search').value=='HÄľadanie') return false; return true;" class="nice" />
<input name="which_form" type="hidden" value="simple" />
<input name="tab_name" type="hidden" />
<input name="search_anywhere" type="text" id="search" placeholder="HÄľadanie" tabindex="1" class="input-text expand" />
<input name="submit_search_simple" type="image" src="/images/design_resp/design/blank.png" alt="HÄľadaĹĄ" class="ico search-nosprite" /></form>
</div>
<div class="show-on-phones">
<a title="HÄľadajte ponuky práce podÄľa rĂ´znych kritĂ©riĂ">
</a>
</div>
</div>
<div class="row-header-favorite">
<div class="header-favorite">
<a title="Moje vybrané pracovné ponuky" class="ico-shopping-cart-toppanel" rel="nofollow" href="/user_details.php?action=show_my_offers&ref_top_panel=157">0</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
and i need access:
input name="tab_name" type="hidden"
You can use Linq to xml
var xDoc = XDocument.Load(pathToXmlFile); //XDocument.Parse(xmlstring);
var input = xDoc.Descendants("input")
.First(i=>(string)i.Attribute("name")=="tab_name");
XPath can be used too
var input = xDoc.XPathSelectElement("//input[#name='tab_name']");
If you need to access that element on server side, you'll need to add a runat attribute there (like this: runat="server"), to make it a server side control. I would strongly suggest making it a control of your page, then, so you can access it like any other variable. You would have to give it an ID, so at the very least you could fetch it through that property.
But! your problem seems to be more client side related, so I strongly, really strongly suggest you use jQuery instead. Get jQuery in your site, and it becomes as easy as:
$("input[name='tab_name']");
Or better yet, if you give it an ID:
$("#idYouGaveTotheField");

Categories

Resources