Webdriver Inline Editing : How to handle mouse over and double click - hyperlink

I need to double-click for inline editing. I am facing issue if the object is already populated and is a hyperlink. The moment i use double-click, the link opens, instead of field in edit mode.
Here is the HTML code
<td class="dataCol ">
<span id="cust_contact">
<span ondblclick="if (window.sfPage && window.sfPage.hasRun)
sfPage.dblClickField(event,this);" onmouseout="if (window.sfPage && window.sfPage.hasRun) sfPage.mouseOutField(event, this);" onclick="if (window.sfPage && window.sfPage.hasRun) sfPage.clickField(event, this);" onmouseover="if (window.sfPage && window.sfPage.hasRun) sfPage.mouseOverField(event, this);" class="inlineEditWrite" style="display:block" id="cust_contact_ilecell">
<span id="cust_contact_ileinner">
<a href="https://XXXXXXXX" id="lookup003" onblur="LookupHoverDetail.getHover('lookup003').hide();" onfocus="LookupHoverDetail.getHover('lookup003', '/003/m?retURL=%2Fapr%2FForceOrderInLineEditPage%3Fid%3Da1bWzo%26sf.override%3D1&isAjaxRequest=1&nocache=1344333834626').show();" onmouseout="LookupHoverDetail.getHover('lookup003').hide();" onmouseover="LookupHoverDetail.getHover('lookup003', '/003/m?retURL=%2Fapr%2FForceOrderInLineEditPage%3Fid%3Da1bWzo%26sf.override%3D1&isAjaxRequest=1&nocache=1344333834626').show();">
Joey Tribbiani</a>
</span></span></span></td>
On mouseover it display an image which can be used to click. But I am unable to find locator for the same, as it is tied to the 'class'.
Thanks

Related

Trying to Add A Link to A Carousel

SOLVED
I Simply did not have the closing a tag at the end. Sheesh....
I need help. I'm still a student so still learning. Any help would be appreciated. I'm lost.
I'm using bootstrap5, adding a carousel ("With captions" https://getbootstrap.com/docs/5.1/components/carousel/ for the full code.) to a page and a link in that slide on the h5.
After adding the link, the text went from white to blue and gives me this
"Cannot GET /WilliamVest/%E2%80%9CKeyWestPhotoGallery.html"
I've checked this address NUMEROUS times. Even said it out loud to myself. The link IS in the same folder as the rest of the project.
So why won't it work?
I tried to google and found "data-bs-target" does that have anything to do with it? Like I said, still new so still learning.
****Someone pointed out I missed the quotes in the link. Did not fix it.
I added that quote. It was discolored so I don't know where that came from but I think it's because you were right about the quotation style.
I commented that whole line out and started over. I just wanted to see the difference.
So now, the blue is gone in the lettering but now it won't even open another page to show an error. It does nothing.
First slide label
Key West Photo Gallery -->
This is my code snippet ---- KeyWestPhotoGallery.html is the link I'm trying to get to.
<!-- Carousel of Projects -->
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Images/palmLighthouse1.jpg" class="d-block w-100" alt="Key West Lighthouse">
<div class="carousel-caption d-none d-md-block">
<h5 class="display-2"><a href=“KeyWestPhotoGallery.html>Key West Photo Gallery</a></h5>
<!-- <p>Some representative placeholder content for the first slide.</p> -->
</div>
You have:
<a href=“KeyWestPhotoGallery.html>
That is not a quote " as used in HTML, that is a Unicode Left Double Quotation Mark a.k.a. opening typographer's quote (a display character with no special meaning). So it thinks that is part of the URL that is why it is urlencoded into that address as %E2%80%9C
let path = "/WilliamVest/%E2%80%9CKeyWestPhotoGallery.html"
console.log(decodeURI(path))
Solutions include the following:
Remove it: <a href=KeyWestPhotoGallery.html> (Unquoted attribute-value syntax)
Or, replace it adding the missing closing quote: <a href="KeyWestPhotoGallery.html"> (Double-quoted attribute-value syntax)
Or, use single quotes: <a href='KeyWestPhotoGallery.html'> (Single-quoted attribute-value syntax)

Editing a bootstrap template, adding dynamically jarvisWidget and regenerate the widgets after the page allready been loaded

I'm using smart admin panel from https://wrapbootstrap.com/
They using the jarvisWidget / smart widget which are quite easy to use.
The problem what i heading into , after the page has been loaded i'm using jquery function to add dynamically some widgets :
$(".items-container").append('<article class="col-xs-12 col-sm-6 col-md-4 col-lg-3 sortable-grid ui-sortable">\
<div class="jarviswidget" id=wid-id-"'+itemId+'"> \
<header>\
<span class="widget-icon"> <i class="glyphicon glyphicon-search"></i> </span>\
<h2>'+ data.title +'</h2> \
</header> \
<div>\
<div class="jarviswidget-editbox"> \
<!-- This area used as dropdown edit box --> \
<input class="form-control" type="text"> \
</div>\
<div class="widget-body">\
Here is an item\
</div>\
</div>\
</div>\
</article>');
The widgets are added but as a plain HTML and not regenerate as a predefined widget on the html page.
how i can re initialize all the current widget on the current page / only the ones that has not been initialized?
For a temporary solution that i found now is to create my own pageSetUp(); method , and call the setup_widgets_desktop() only when i finished to load all the widget dynamically to the page.
But I'm looking for something more solid.
I had kind of same issue. I was calling a ajax method to add widgets as html. Calling pageSetUp(); and setup_widgets_destop(); will reinitialize all the elements so its better to reinitialize only widgets inside your container. My solution is as follows:
I was inserting widgets inside
$("#div-id").html(widgetsHTML);
I destroyed the existing widget first using
$("#div-id").jarvisWidgets('destroy');
then reinitialize all widgets inside div using
$("#div-id").jarvisWidgets();
you can also pass defaults as:
$("#form-data").jarvisWidgets({
"fullscreenClass": "fa fa-expand | fa fa-compress",
"toggleClass": "fa fa-minus | fa fa-plus"
});
I hope this will help.

AddThisEvent and jquery mobile

I am trying to implement addthisevent into my jqm application (1.4), but I have two issues.
The Link/Button doesn't appear. Looking with Firebug shows that the css class isn't loaded as hidden.
After manually activating the visibility using firebug, the link doesn't do anything.
Does anyone have experience with integrating addthisevent into a jqm app? Is there anything I have to be particularly careful of?
Many thanks in advance.
It appears that the jQM CSS interferes with AddThisEvent CSS. One solution is to add data-role="none" to the link which tells jQM to leave the link alone and not to enhance it.
<a href="#" data-role="none" title="Add to Calendar" class="addthisevent" rel="external">
Add to Calendar
<span class="_start">10-05-2014 11:38:46</span>
<span class="_end">11-05-2014 11:38:46</span>
<span class="_zonecode">38</span>
<span class="_summary">Summary of the event</span>
<span class="_description">Description of the event</span>
<span class="_location">Location of the event</span>
<span class="_organizer">Organizer</span>
<span class="_organizer_email">Organizer e-mail</span>
<span class="_facebook_event">http://www.facebook.com/events/160427380695693</span>
<span class="_all_day_event">true</span>
<span class="_date_format">DD/MM/YYYY</span>
</a>
Here is a DEMO

FontAwesome with Grails <g:actionSubmit

I've been trying to add icons to my save, delete, etc. buttons. I have about five buttons using the <g:actionSubmit> tag to call an action in a controller to perform the corresponding functions. My problem is that FontAwesome and bootstrap's glyphicons require the <i class="icon-***"> tag to be used like so:
<a href="http://google.com">
<i class="icon-ok"></i> Google
</a>
In grails this format of the tag in between the initial tag is not possible (at least with actionSubmit). The value attribute is the string that is displayed. Is there any work around for this? Keep in mind I still need to map the buttons action back to a controller which is why I've had issue using a straight <button> tag like what is recommended for bootstrap.
UPDATE:
I'm having a lot of problems using the current 2 answers. They both work for adding the icons, but I'm getting some nuisances that I'm having to hack a lot of things up to fix. I thought about another solution but am having some problems implementing it. I'd like to write my own tag lib using the base of the taglib as the actionSubmit tag lib below:
def actionSubmit = {attrs ->
attrs.tagName = "actionSubmit"
if (!attrs.value) {
throwTagError("Tag [$attrs.tagName] is missing required attribute [value]")
}
// add action and value
def value = attrs.remove('value')
def action = attrs.action ? attrs.remove('action') : value
out << "<input type=\"submit\" name=\"_action_${action}\" value=\"${value}\" "
// process remaining attributes
outputAttributes(attrs)
// close tag
out << '/>'
}
The only change I need to make is to give it the ability to take the
<i class="icon-ok"></i>
tag in between a:
<g:actionSubmit ...> </g:actionSubmit>
Does anyone have suggestions or for this implementation?
Don't use actionSubmit, just use a <button> and provide the link/action properties like so:
<button type="submit" class="btn">
<i class="..."></i> Update
</button>
here's a more detailed example
<button type="submit" class="btn btn-danger" name="_action_delete" value="Delete">
<i class="..."></i> ${message(code: 'default.button.delete.label', default: 'Delete')}
</button>
Note: actionSubmit passes the following input name/values for update, save and delete
name="_action_update" //update
name="_action_update" //save
name="_action_delete" //delete
so you would just need to do the same if you're app is dependent on them
Try passing the class name to remoteLink, which creates a link that uses Ajax to call a remote function and you can add your fontAwesome classes to it.
<g:remoteLink class="btn icon-ok" action="index" >
click (without i tag)
</g:remoteLink>
or
<g:remoteLink action="index" >
<i class="btn icon-ok">click (with i tag) </i>
</g:remoteLink>
Both approaches should work.

get value form simpledialog2 blank mode

I have used JQM SimpleDialog2 in my app. I am having one textbox and button in that dialog. i can't able to get the value from input while click on button in dialog. i have used blank mode.. Here is my code.. I am getting empty value from this code. please correct me.
<div id="myDialog" style="display:none"
data-options='{"mode":"blank","top":"10%","headerClose":false,"blankContent":true}'
<Center>please enter Your Amount here</center>
<input id="txtAmt" name="amy" value="" type="text" placeholder="Amount">
<div data-role="navbar" data-grid="a">
<ul>
<li>Submit</li>
<li>Cancel</li>
</ul>
</div>
function getAmount()
{
alert("amount: "+$("#txtAmt").val());
}
i didnt try this using SimpleDialog but this works just fine for me:
function getAmount(){
alert (document.getElementById('txtAmt').value);
}
By the way i would recommend using the built-in Popup-Dialog function instead of SimpleDialog. See here: http://jquerymobile.com/demos/1.2.0/docs/pages/dialog/index.html

Resources