Unable to click action selection box using webdriver - webdriver

I am unable to click on the action selection box given below.
I need to click on the "include" action selection box.
Here is my code
WebElement divElement1 = driver.findElement(By.id("gwt-debug-pagingListBox itemContainer0"));
divElement1.findElement(By.id("gwt-debug-nodeListBoxItemWidget-actionSelectionBox")).click();
HTML code:-
<div class="PagingListBox-itemContainer" id="gwt-debug-pagingListBox-itemContainer1" style="height: 23px;">
<div id="gwt-debug-pagingListBox-item-1" class="C1TWYC-nf-e C1TWYC-nf-a PagingListBox-item">
<div id="gwt-debug-nodeListBoxItemWidget-actionSelectionBox" class="C1TWYC-Ie-a" style="">
<div id="gwt-debug-actionSelectionBox-status" class="statusPanel goog-inline-block" aria-hidden="true" style="display: none;">
<div class="gwt-Label"></div>
</div>
<div id="gwt-debug-actionSelectionBox-menu" class="menuPanel goog-inline-block">
<div class="C1TWYC-Ie-e">include</div>
</div>

Have you tried just
driver.findElement(By.cssSelector("#gwt-debug-actionSelectionBox-status")).click();
?

Your HTML code contains id as gwt-debug-pagingListBox-itemContainer1 while you are using gwt-debug-pagingListBox-itemContainer0 in your code.
Another thing, if your require id gwt-debug-nodeListBoxItemWidget-actionSelectionBox is unique on page then you can click it directly by using
driver.findElement(By.id("gwt-debug-nodeListBoxItemWidget-actionSelectionBox")).click();
Once you confirm that your locator is fine then you can also use JavascriptExecutor. replace locator according to your convenience
WebElement element= driver.findElement(By.xpath("YOUR XPATH"));
JavascriptExecutor executor = (JavascriptExecutor) driver;
executor.executeScript("arguments[0].click();", element);

Related

How to get selected row with custom action column using syncfusion in blazor?

I am using syncfusion grid in blazor.
Here is my Razor :
<div class="card-outer p-0">
<div class="grid-table">
<EjsGrid DataSource="#ManufacturedCoupons" AllowPaging="true">
<GridPageSettings PageCount="5" PageSize="5"></GridPageSettings>
<GridColumns>
<GridColumn Field=#nameof(Coupon.MaterialIdType) HeaderText="#CommonResource.MaterialID" Width="130" TextAlign="TextAlign.Center"></GridColumn>
<GridColumn Field=#nameof(Coupon.MaterialId) HeaderText="#CommonResource.MaterialID" Width="130" TextAlign="TextAlign.Center"></GridColumn>
<GridColumn Field=#nameof(Coupon.LotNo) HeaderText="#CommonResource.LotNo" Width="100" TextAlign="TextAlign.Center"></GridColumn>
<GridColumn Field=#nameof(Coupon.ArrivalDate) HeaderText="#CommonResource.DeliveryDate" TextAlign="TextAlign.Center" Width="150"></GridColumn>
<GridColumn HeaderText="#CommonResource.Action" TextAlign="TextAlign.Center" Width="120">
<Template>
#{
<div class="actions">
<img src="images/export.svg" alt="#CommonResource.SendToStock" #onclick="SendToStockClicked()">
</div>
}
</Template>
</GridColumn>
</GridColumns>
</EjsGrid>
</div>
</div>
this is my method in code behind file :
protected void SendToStockClicked(Coupon coupon)
{
}
I want to pass selected row data in this method on action button clicked.
How can I achive that ?
I'm not acquainted with syncfusion... I only know blazor. What I know from Blazor is that if you want to call a method and pass it a value you should use a lambda expression. Let's say that you have in your grid an object named MyCoupon of type Coupon, and you want to pass it to a local method called SendToStockClicked...This is how you call SendToStockClicked:
#onclick="#(() => SendToStockClicked(MyCoupon))"
Incidentally, this "javascript:void(0);" is JavaScript, and you shouldn't use JavaScript in Blazor...
Hope this helps...
EDIT
You are half right. It indeed help me so I am marking it true but still I have to do some fixes which I am putting it here.
<Template>
#{
var couponData = (context as Coupon);
<div class="actions">
<a href="javascript:void(0);"
title="#CommonResource.SendToStock"
#onclick="(()=> SendToStockClicked(couponData))">
<img src="images/export.svg"
alt="#CommonResource.SendToStock">
</a>
</div>
}
</Template>
Here I have to take couponData to send my custom method object.

How do I pass data up from the child page to the page calling #Body?

So I have a MainLayout with a title bar, and I want to have a parameter that allows the page to set the title bar to whatever it wants. So mainlayout calls the page through #Body, I'm confused how I would pass data up through body to the mainlayout to update the title bar.
Any help would be greatly appreciated!
<div class="sidebar">
<NavMenu />
</div>
<div class="main">
<div class="top-row px-4">
<h3 bind="#TitleValue">#(TitleValue)</h3>
<a class="ml-md-auto">#ADService.LoggedUser().DisplayName (#*#(ADService.LoggedUser().IsMemberOf())*#Admin)</a>
</div>
<CascadingValue Value="#TitleValue" Name="TitleValue">
<div class="content px-4">
#Body
</div>
</CascadingValue>
</div>
<Footer />
#functions {
string TitleValue = "Inventory";
}
So what I want to do is pass the TitleValue down, have the page update it depending what is happening and have the title bar update with the new value.
If this isn't the way to do it, or I'm missing something, any help would be great :)
I guess the following, which is not mine, can help you:
Create a class which holds your data. Register it as singleton
service. Inject it into layout and into page. You should probably add
a notification mechanism to inform all your components that something
was changed in your data class.
You can look here...
Source and more...

How to associate a heading/document title with an accordion button

Obligatory 'I have googled but am stuck'. I have a number of documents on a page with associated collapsible 'More Info' accordions. I want to be able to report on when people click to open one of these accordions and what the corresponding document name is.
Implementing tracking in GTM to show opens on the accordions are not a problem, but how do I associate the document name (h4) with the click event?
Div containing document, document heading and associated 'More Info':
enter image description here
Div that the document heading and the more info button are in:
<div class="employee-comms-results-documents">
<div class="row">
<div class="col-md-9 col-sm-8 col-xs-12 no-padding-right no-padding-left">
<div>
<div class="primary-document-meta"><div class="doc-type-pill" id="doc-type-pill-Flyers">Flyers
</div>
</div>
<h4>Helping you save for retirement</h4>
<div class="secondary-document-meta">More info <span class="caret"></span>
</div>
</div>
</div>
Thanks in anticipation!
I think I would need to see the whole site structure to be sure, but for your example I created a JavaScript variable in GTM that returns the corresponding h4-text on click.
This code has worked for me:
function(){
var clickElement = jQuery({{Click Element}}).parent(".secondary-document-meta").parent("div").find("h4").text();
return clickElement;
}

Umbraco 7 MVC Razor - Rendering Image (Multinode Tree Picker Script)

I've created a multinode tree picker datatype and i'm trying to list the thumbnails of a vehicle as part of the foreach loop, however i keep getting ID rendering in the src of the image, i'm having trouble getting the URL of the image.
MVC Razor Code
#inherits Umbraco.Web.Macros.PartialViewMacroPage
#using Umbraco.Web
#*
Macro to list nodes from a Multinode tree picker, using the pickers default settings.
Content Values stored as xml.
To get it working with any site's data structure, simply set the selection equal to the property which has the
multinode treepicker (so: replace "PropertyWithPicker" with the alias of your property).
*#
#* Lists each selected value from the picker as a link *#
<div class="featuredVehicles">
#foreach (var id in CurrentPage.featuredVehicles.Split(','))
{
#*For each link, get the node, and display its name and url*#
var vehicleContent = Umbraco.Content(id);
<div class="col-xs-6 col-md-4 col-xs-height">
<a href="#vehicleContent.Url">
#if (vehicleContent.HasValue("vehicleThumbnail"))
{
var mediaItem = Umbraco.TypedMedia(vehicleContent.GetPropertyValue("vehicleThumbnail"));
<img class="featuredVehicleImg img-responsive" src="#vehicleContent.GetPropertyValue("vehicleThumbnail")" alt="#vehicleContent.Name"/>
}
else
{
<img class="comingSoon" src="http://placehold.it/650x408" alt="#vehicleContent.Name">
}
<strong>
<span class="name">#vehicleContent.Name</span>
</strong>
<span class="desc">#vehicleContent.GetPropertyValue("shortContent")</span>
<span class="prx">from, <strong>£#vehicleContent.vehiclePrice</strong> per day</span>
<span class="label label-primary moreinfo">More Info</span>
</a>
</div>
}
</div>
HTML
<img alt="Pharmaceutical Vehicle One" src="1092" class="featuredVehicleImg img-responsive">
Problem solved;
This is the bit where the problems were being caused;
if (vehicleContent.HasValue("vehicleThumbnail")){
var dynamicMediaItem = Umbraco.Media(vehicleContent.vehicleThumbnail);
<img src="#dynamicMediaItem.umbracoFile" alt="#dynamicMediaItem.Name"/>
}
else
{
<img class="comingSoon" src="http://placehold.it/650x408" alt="#vehicleContent.Name">
}
Hopefully it will help someone else out :-)

<a href or <asp:hyperlink.....tag does not render at runtime

i am trying to display a simple div with hyperlink that represents x
like this:
So, when my run my app i see the div but i dont see the x which is <a href tag
and here is my code:
<div class="success">×status message here...</div>
and when i looked at the source of the page this is what it renders:
<div id="ctl00_ctl00_ContentMain_ContentMain_employee_status" class="success" style="display:block;">status message here...</div>
and then i tried with <asp:hyperlink....
<div class="success" id="divStatus" visible="false" runat="server"><asp:HyperLink id="success" runat="server" CssClass="close" Text="×"></asp:HyperLink></div>
and i still dont see href tag, what is going on here and why i am not able to render the <a href or <asp:hyperlnk tag any clue?
i am writing InnerHtml divSuccess.InnerHtml ="status message here...
if thats the case that erasing its static contents then what is the
alternate?
If divStatus contains controls that you want to keep, then you can append HTML to it by using a Literal control and adding it to the controls collection, like:
var lit = new Literal();
lit.Text = "my text or <strong>html</strong>";
this.divStatus.Controls.Add(lit);
Alternatively, you could use another control inside divStatus and alter its inner HTML:
<div id="divStatus" runat="server">
<a id="lnk1">This is the link that we don't want to be removed.</a>
<asp:Literal runat="server" id="litStatusHtml" />
</div>
here is how i able to solved my question
divStatus.InnerHtml = "<a href='#' class='close'>×</a>" + "status message here...";

Resources