I have validated all of the JSON objects & they have been successfully added to the VoteCtrl's $scope (see right). From what I can tell my expressions should select the desired data out of my JSON model. So my question is, why isn't this working & what am I missing here?
<!-- National -->
<li ng-repeat="nationalHeader in votingTopics" class="nav-header">
{{nationalHeader[0].name}}
</li>
<li ng-repeat="nationalTopic in votingTopics" class="active">
<a href="{{nationalTopic.National.topicLink}}">
{{nationalTopic.National.topicTitle}}
</a>
</li>
<!-- State -->
<li ng-repeat="stateHeader in votingTopics" class="nav-header">
{{stateHeader[0]}}
</li>
<li ng-repeat="stateTopic in votingTopics">
<a href="{{stateTopic.State.California.topicLink}}">
{{stateTopic.State.California.topicTitle}}
</a>
</li>
<!-- City -->
<li ng-repeat="cityHeader in votingTopics" class="nav-header">
{{cityHeader[0]}}
</li>
<li ng-repeat="cityTopic in votingTopics">
<a href="{{cityTopic.State.California.Sacramento.City.topicLink}}">
{{cityTopic.State.California.Sacramento.City.topicTitle}}
</a>
</li>
<!-- County -->
<li ng-repeat="countyHeader in votingTopics" class="nav-header">
{{countyHeader[0]}}
</li>
<li ng-repeat="countyTopic in votingTopics">
<a href="{{countyTopic.County.topicLink}}">
{{countyTopic.County.topicTitle}}
</a>
</li>`
You are not calling getting the property of your object correctly. Try the following in your National section:
<!-- National -->
<li ng-repeat="nationalHeader in votingTopics" class="nav-header">
{{ nationalHeader.National[0].name }}
</li>
<li ng-repeat="nationalTopic in votingTopics">
<a href="{{nationalTopic.National.topicLink}}">
{{nationalTopic.National[0].topicTitle}}
</a>
</li>
Related
I want to call controller method by using #Url.Action in href,
how can we do the same?
<ul id="dvMenuInner" class="nav navbar-nav dropdown">
<li ng-repeat="parent in menu">
<a href="#")}" class="dropdown-toggle" data-toggle="dropdown">
<span class="fa fa-tachometer header-icon" aria-hidden="true">
</span>{{parent.menuname}}
</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu" ng-repeat="child in parent.children">
{{child.menuname}}
<ul class="dropdown-menu">
<li ng-repeat="children in child.childrencc"><a ng-repeat="child in parent.children" href="#Url.Action({{children.actionname}},{{children.url}})">{{children.menuname}}</a></li>
</ul>
</li>
</ul>
</li>
</ul>
Since URL.Action is Razor code and it will execute at server so you can not pass your client side data to it.
either you can do it as follows
<a href="#Url.Content("{{parent.menuname}}"+"/"+"{{parent.actionname}}")">
which will construct the URL controller and action name or you can do it via plain Html way
<a href="{{parent.menuname}}/{{parent.actionname}}">
by any of the above way you can redirect your link to the desired controller+action
Somebody please suggest me how can i click on menu in selenium web driver. I am trying to find out by css selector and directly by id,link text but its not work:
driver.findElement(By.cssSelector("nav > ul a#user")).click();
Help is highly appreciated. Below is the code:
<nav>
<ul style="">
<li class="">
<a id="dashboard" title="Dashboard" href="ajax/dashboard.html">
</li>
<li>
<a id="controlpanel" href="ajax/controlpanel.html">
</li>
<li class="active">
<a id="user" href="ajax/user.html">
</li>
<li class="open">
<a id="audcon" title="client" href="#">
<b class="collapse-sign">
</a>
<ul style="display: block;">
<li>
<a id="client" href="ajax/client.html">
</li>
<li>
<a id="stores" href="ajax/location.html">
</li>
<li>
<a id="sub_category" href="ajax/auditgroup.html">
</li>
<li>
<li>
</ul>
</li>
<li>
<a id="quescon" href="#">
<ul>
</li>
<li>
<li>
<a id="help" href="guidelines.html">
</li>
</ul>
</nav>
Try Following
driver.findElement(By.id("user")).click();
OR
driver.findElement(By.xpath("//li[#class='active']")).click();
I have a HTML code as mentioned below with UL tag, and I wanted to click the UL tag Manage -> Channel using Selenium Webdriver. To do that I have written the below code in java but it is not working, infact no error is throwing but page is getting opened. Please help.
HTML
<ul class="adb-primary_nav--items adb-layout-default">
<li class="adb-primary_nav--item">
<a class="adb-primary_nav--link en" href="../">
<img class="adb-primary_nav--image" src="https://d33na3ni6eqf5j.cloudfront.net/marketplace_logo/img1474715110198223685.png?7ef040694410736c21450bea763bb661" alt="Vodafone Group">
</a>
</li>
<li class="adb-primary_nav--item">
<a class="adb-primary_nav--link" id="myapps" href="../myapps">
MyApps
</a>
</li>
<li class="adb-primary_nav--item">
<a class="adb-primary_nav--link" id="shop" href="../home">
Marketplace
</a>
</li>
<li class="adb-primary_nav--item"><a class="adb-primary_nav--link" id="developer" href="../cms/home">Developer</a></li>
<li class="adb-primary_nav--item js-drainable-menu">
<div class="adb-context_menu adb-js-context_menu">
<a id="manage" class="adb-context_menu--trigger adb-js-context_menu--trigger adb-primary_nav--link admin-item selected" role="button" tabindex="0">Manage</a>
<div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu">
<ul class="adb-stack">
<li class="adb-stack--item"><a class="adb-link__option adb-stack--item_content" href="../corporate/home">Corporate</a></li>
<li class="adb-stack--item"><a class="adb-link__option adb-stack--item_content selected" href="./marketplace">Channel</a></li>
<li class="adb-stack--item"><a class="adb-link__option adb-stack--item_content" id="account" href="../account/home">Account</a></li>
</ul>
</div>
</div>
</li>
<li class="adb-primary_nav--item adb-primary_nav--item__right">
<div class="adb-context_menu adb-js-context_menu" data-placement="right">
<a class="adb-context_menu--trigger adb-js-context_menu--trigger adb-primary_nav--link" role="button" tabindex="0">testchannel user</a>
<div class="adb-container adb-context_menu--menu adb-js-context_menu--menu" role="menu">
<ul class="adb-stack">
<li class="adb-stack--item">
<a class="adb-link__option adb-stack--item_content" id="myProfile" href="../profiles/5944276">My Profile</a>
</li>
<li class="adb-stack--item">
<a class="adb-link__option adb-stack--item_content" id="myCompany" href="../companies/219288">My Company</a>
</li>
<li class="adb-stack--item">
<a class="adb-link__option adb-stack--item_content" id="mySettings" href="../settings">My Settings</a>
</li>
<li class="adb-stack--item">
<a class="adb-link__option adb-stack--item_content" id="logout" href="../logout">Logout</a>
</li>
</ul>
</div>
</div>
</li>
</ul>
Java Code
Configuration_file var = new Configuration_file();
System.setProperty("webdriver.chrome.driver", "C:\\Users\\gur29175\\workspace\\SAAS\\jars\\chromedriver.exe");
WebDriver firefox_dri = new ChromeDriver();
firefox_dri.get(var.env_URL + "/home");
firefox_dri.manage().timeouts().implicitlyWait(30,TimeUnit.SECONDS);
firefox_dri.findElement(By.cssSelector("a:(*'Manage'*)")).click();
firefox_dri.findElement(By.cssSelector("a:(*'Channel'*)")).click();
driver.findElement(By.xpath("//a[#id='manage']")).click()
driver.findElement(By.xpath("//ul[#class='adb-stack']/li[2]")).click()
In case of a listbox, you need to get the list of elements and iterate over it to choose the required element.
Please share the screenshot of the page with dropdowns. Will be able to guide you with the code.
You can replace
firefox_dri.findElement(By.cssSelector("a:(*'Manage'*)")).click();
firefox_dri.findElement(By.cssSelector("a:(*'Channel'*)")).click();
with
firefox_dri.findElement(By.linkText("Channel")).click();
Try it
//ul[#class='adb-stack']/li[#class='adb-stack--item']/a[contains(text(),'Corporate')].click();
I want to loop li with different condition and apply different html depending on that condition.
If i code this way
<ul ng-repeat="item in items">
<li ng-if="item == '1'">
<div><span> <span>My test 123</span>
{{item }}
</span></div>
</li>
<li ng-if="item == '2'">
<div><span class="xyz"> <span class="abc">My new test XXX</span>
{{item }}
</span>
<span>123</span>
</div>
</li>
</ul>
It repeat as
<ul ng-repeat="item in items">
<li>My test 123
1</li>
</ul>
<ul ng-repeat="item in items">
<li>
My new test XXX
2 123</li>
</ul>
But i want
<ul ng-repeat="item in items">
<li>My test 123
1</li>
<li>
My new test XXX
2 123</li>
</ul>
Any solution?
Thanks.
Repeat on the DOM element you want repeated?
<ul>
<li ng-repeat="item in items">{{item }}</li>
</ul>
<ul >
<li ng-repeat="item in items">{{item }}</li>
</ul>
I have this html code for student records and its working good
<li ng:repeat="student in students">
<a href='#/student/{{ student.id }}'>{{ student.number }}</a>
</li>
But i have few few more nested levels of details which i want to show like this
<ul>
<li ng:repeat="student in students">
<a href='#/student/{{ student.id }}'>{{ student.number }}</a>
if {{ student.subjects}} > 0
//some indenting
<ul>
<li ng:repeat="subject in subjects">
<a href='#/student/subject/{{ subject.id }}'>{{ subject.name }}</a>
if {{ subjects.assignments}} > 0
<ul>
<li ng:repeat="subject in subjects">
<a href='#/student/subject/assignment/{{ assignment.id }}'>{{ assignment.name }}</a>
<li>
</ul>
<li>
</ul>
</li>
</ul>
But i don't know the angular syntax , how can i do that
You can use ng-show on child UL elements, and iterate each level in its own ng-repeat. Note: You don't need things like if {{ student.subjects}} > 0 (That's not a valid JS code btw). ngRepeat won't iterate if collection is empty:
<ul>
<li ng-repeat="student in students">
<a href='#/student/{{ student.id }}'>{{ student.number }}</a>
<ul ng-show="student.subjects && student.subjects.length">
<li ng-repeat="subject in student.subjects">
<a href='#/student/subject/{{ subject.id }}'>{{ subject.name }}</a>
<ul ng-show="subject.assignments && subject.assignments.length">
<li ng-repeat="assignment in subject.assignments">
<a href='#/student/subject/assignment/{{ assignment.id }}'>{{ assignment.name }}</a>
<li>
</ul>
<li>
</ul>
</li>
</ul>