I have an MVC 3 site. I've created a navigation bar that looks like the following:
<div data-role="navbar">
<ul>
<li>
<a href="#ProfileView" class="ui-btn-active">
<img src='#Href("~/Content/img/Profile.png")' alt="Profile" />
</a>
</li>
.
.
</ul>
</div>
What gets rendered for one of the buttons is:
<a class="ui-btn-active ui-btn ui-btn-up-c" href="#ProfileView" data-theme="c">
<span aria-hidden="true" class="ui-btn-inner">
<span class="ui-btn-text">
<span aria-hidden="true" class="ui-btn-inner">
<span class="ui-btn-text">
<span aria-hidden="true" class="ui-btn-inner">
<span class="ui-btn-text">
<span aria-hidden="true" class="ui-btn-inner">
<span class="ui-btn-text">
<img alt="Profile" src="Content/img/profile.png">
</span>
</span>
</span>
</span>
</span>
</span>
</span>
</span>
</a>
I was trying to compare mine to JQuery Mobile's demo site. It looks the same to me, but it's not working... So did I miss something? What typically causes the repetitiveness shown in this example?
Thanks.
Add data-role="none" to elements you don't want to render as a button. Then compare your output and see if you are still getting the extra rendering. Most likely you have an open tag, or are refreshing the listview multiple times.
Related
I have following code where i want to select value for dropdown:
<div class="prod-value col-xs-6 col-sm-8">
<select class="selectpicker show-menu-arrow" data-style="btn-default btn-sm" data-width="98%" data-size="6" onchange="location=options[selectedIndex].value;" style="display: none;"><option value="/design-your-engagement-ring/choose-a-setting/10k-rose-gold-round-halo-engagement-ring/50277-E-10KR">10K Rose Gold</option>
<option value="aa">10K White Gold</option>
<option value="bb">10K Yellow Gold</option>
</select>
<div class="btn-group bootstrap-select show-menu-arrow" style="width: 98%;">
<button type="button" class="btn dropdown-toggle selectpicker btn-default btn-sm" data-toggle="dropdown" title="14K White Gold">
<span class="filter-option pull-left">14K White Gold</span> <span class="caret"></span></button>
<div class="dropdown-menu open">
<ul class="dropdown-menu inner selectpicker" role="menu">
<li data-original-index="0">
<a tabindex="0" class="" data-normalized-text="10K Rose Gold"><span class="text">10K Rose Gold</span><span class="glyphicon glyphicon-ok icon-ok check-mark"></span></a>
</li>
<li data-original-index="1">
<a tabindex="0" class="" data-normalized-text="10K White Gold"><span class="text">10K White Gold</span><span class="glyphicon glyphicon-ok icon-ok check-mark"></span></a>
</li>
</ul>
</div>
</div>
<input type="hidden" id="metal_type" name="metal_type" value="14KW">
</div>
How to do with selenium using c#. I have tried using xpath but it throws the error.
driver.FindElement(By.XPath("//*[#class='prod-value']/div/div/ul/li[0]/a")).Click();
Above code not able to find the exact path.
Try this:
//*[contains(#class,'prod-value')]/div/div/ul/li[1]/a
There were two issues with that xpath.
prod-value is not the only class present in first div
Element indexes are 1-based, so there's no li[0]
#derloopkat provided with correct explanation (+1)
Another simple way to solve the issue is to use link text (in case there are no more "10K Rose Gold" links):
driver.FindElement(By.LinkText("10K Rose Gold")).Click();
You need to click on the dropdown to expand its option before you can choose any option.
// expand dropdown options
driver
.FindElement(By.Css("div.prod-value button.dropdown-toggle.selectpicker"))
.click();
// choose option
driver.FindElement(By.LinkText("10K Rose Gold")).Click();
Firstly you need to expand the dropdown as Answered by Yong
Then you need to click element by using xpath as Answered by derloopkat
Here is final code for get final output:
driver.FindElement(By.CssSelector("div.prod-value button.dropdown-toggle.selectpicker")).Click();
driver.FindElement(By.XPath("//*[contains(#class,'prod-value')]/div/div/ul/li[1]/a")).Click();
I have an ASP.NET webforms project with a master page using adminlte UI.
I created a web site with default project in Visual Studio and then change the project to apply adminlte dashboard, copied all scripts and bootstrap then change master page and default form.
My problem: in menu sidebar when I tried to add from to root folder and do this
<li>
<a runat="server" href="Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
everything is ok and form loads without any problem.
But when I created a folder Track and created a new form inside it and try to do this
<li>
<a runat="server" href="~/Track/Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
I get this exception:
exception
What I tried
First attempt:
<li>
<a runat="server" href="../../Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
Second attempt:
<li>
<a runat="server" href="../Track/Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
Third attempt:
<li>
<a runat="server" href="~/../Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
Final attempt:
<li>
<a runat="server" href=~/Track/Shipment.aspx">
<i class="fa fa-th"></i><span>Shipment</span>
</a>
</li>
I've fixed some deprecated and superfluous markup - adjust any related CSS selectors.
Try this:
<li>
<a runat="server" href="~/Shipment.aspx">
<em class="fa fa-th">Shipment</em>
</a>
</li>
The "~/" should resolve anything from the main project root down, presuming there are no page name conflicts. Some of your attempts should have worked so I'm thinking maybe something else is causing a problem. Presuming your menu is in a User Control, maybe it's the path to this control in your Master Page(s) that is causing the problem?
So needed help again
Sorry a bit confusing but, I am trying to create a chat box which user can submit and then retrieve it again from the DB, I am following this script https://bootsnipp.com/snippets/EkQe7
As you can see, from the HTML code, there is two types, one is when you chat and another is when other people chat,
<div class="chat">
<div class="chat-history">
<ul class="chat-ul">
<li>
<div class="message-data">
<span class="message-data-name"><i class="fa fa-circle you"></i> You</span>
</div>
<div class="message you-message">
A new client?!?! I would love to help them, but where are we going to find the time?
</div>
</li>
<li class="clearfix">
<div class="message-data align-right">
<span class="message-data-name">Ada, your OperationsAlly</span> <i class="fa fa-circle me"></i>
</div>
<div class="message me-message float-right"> We should take a look at your onboarding and service delivery workflows, for most businesess there are many ways to save time and not compromise quality. </div>
</li>
</ul>
</div> <!-- end chat-history -->
</div> <!-- end chat -->
So now, what I am trying to do is from the retrieve the message from DB then code-behind submit the HTML code into the Repeater,
If it is "You", then will use this code
<div class="message-data">
<span class="message-data-name"><i class="fa fa-circle you"></i> You</span>
</div>
<div class="message you-message">
A new client?!?! I would love to help them, but where are we going to find the time?
</div>
If it is other people, then will use this code
<li class="clearfix">
<div class="message-data align-right">
<span class="message-data-name">Ada, your OperationsAlly</span> <i class="fa fa-circle me"></i>
</div>
<div class="message me-message float-right"> We should take a look at your onboarding and service delivery workflows, for most businesess there are many ways to save time and not compromise quality. </div>
</li>
My question is how to do that from Code-Behind PageLoad? How to add the code above into the Repeater from code-behind?
Thanks!
First, you'll have to retrieve the records in the database in the code behind. (See this msdn article for details)
messages.DataSource = myMessages;
messages.DataBind();
Now we can use Repeater, in which the html is separated by author, to iterate the data. Note that I am assuming how your database of messages is structured.
<asp:Repeater id="messages" runat="server">
<ItemTemplate>
<div runat="server" visible='<% (Container.DataItem("author") == "us") %>'>
<li>
<div class="message-data">
<span class="message-data-name"><i class="fa fa-circle you"></i> You</span>
</div>
<div class="message you-message">
<%# Eval("testMessage") %>
</div>
</li>
</div>
<div runat="server" visible='<% (Container.DataItem("author") != "them") %>'>
<li class="clearfix">
<div class="message-data align-right">
<span class="message-data-name"><%# Eval("authorName") %></span> <i class="fa fa-circle me"></i>
</div>
<div class="message me-message float-right">
<%# Eval("testMessage") %>
</div>
</li>
</div>
</ItemTemplate>
</asp:Repeater>
I haven't tested this code, but its a high level idea of what to do. You may also want to see some Examples on using Repeater.
thanks in advance for any help you can provide. I'm trying to scrape some HTML with HtmlAgilityPack and am having trouble with the XPATH syntax. The HTML I'm dealing with has multiple tags I'd like to access all within a < p >.
<p class="row" data-pid="5687754180">
<a href="/bod/5687754180.html" class="i gallery" data-ids="1:00c0c_fapkFsQg3Dx">
<span class="price">$5000</span>
</a>
<span class="txt">
<span class="pl">
<span class="icon icon-star" role="button">
<span class="screen-reader-text">
<? __("favorite this post") ?>
</span>
</span>
<time datetime="2016-07-17 19:36" title="Sun 17 Jul 07:36:03 PM">Jul 17</time> <a href="/bod/5687754180.html" data-id="5687754180" class="hdrlnk">
<span id="titletextonly">☇☇♔♔♔♔♔1998 Mastercraft Prostar㊣</span>
</a>
</span>
<span class="l2">
<span class="price">$5000</span>
<span class="pnr">
<span class="px">
<span class="p"> pic</span>
</span>
</span>
</span>
<span class="js-only banish-unbanish">
<span class="banish">
<span class="icon icon-trash" role="button"/>
<span class="screen-reader-text">hide this posting</span>
</span>
<span class="unbanish">
<span class="icon icon-trash red" role="button"/> restore this posting</span>
</span>
</span>
</p>
My thought was that I could iterate over all the < p > tags and get the tags within each that I needed, but it's not working out so well. Here's what I would like to get:
and then move on to the next < p > and get the same thing. I feel like I'm getting close, but am missing something crucial. For example, this snippet gets me the "data-pid" from each , but the "titletextonly" is same one over and over.
Thanks for any help you can provide!!
Whenever your XPath starts with /, it will always be treated as absolute XPath (in other words, relative to the root document) ignoring current context element, which in this case is referenced by variable title. That said, SelectSingleNode() will always return the first element in the entire document matched by the XPath parameter, regardless of the context element.
To make the XPath relative to context element, you need to add a . at the beginning :
var node = title.SelectSingleNode(".//span[#id='titletextonly']");
Could anyone give me an idee on how could I generate dynamically this piece od code:
<div class="btn-group">
<button type="button" class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown" runat="server">
<span class="caret"></span></button>
<ul class="dropdown-menu" id="testingPurposes">
<li>
<div>
<span class="text-left" onclick="fct1()"> Text nr 1</span>
<asp:Image ID="Image1" ImageUrl="myImg.png" runat="server" onclick="fct2()"/>
</div>
</li>
<li>
<div>
<span class="text-left" onclick="fct1()"> Text nr 2 </span>
<asp:Image ID="Image2" ImageUrl="myImg.png" runat="server" onclick="fct2()"/>
</div>
</li>
</ul>
</div>
The main idea of this code is to have some kind of dropdown list looking control that would have a span with text, and an image on each row.
This is basicly how my control shoud look when it's clicked:
Text1 img1
Text2 img2
If a user clicks TextN i get an event for that click, and i can update the page based on selected item.
If a user clicks imgN then TextN and imgN would disappear from the list.