Develop Reference

How to get the Id of parent ancher tag of custom action?

using Jquery am trying to get the id of parent ancher tag of custom Action(Ribbon) in sharepoint but am unable to get it.
My HTML is as like
<a unselectable="on" href="javascript:;" onclick="return false;" class="ms-cui-ctl-large " mscui:controltype="Button" role="button" id="{E549A47E-BA3E-4D2B-A496-5B9C077A875F}-Large">
<span unselectable="on" class="ms-cui-ctl-largeIconContainer">
<span unselectable="on" class=" ms-cui-img-32by32 ms-cui-img-cont-float"></span>
</span>
<span unselectable="on" class="ms-cui-ctl-largelabel">Custom Action<br></span>
</a>
and this is the script am aplying to get the Id
<script type="text/javascript">
$(document).ready(function(){
var ttle=$("input[title='custom Action']")[0].parent().attr('id');
alert(ttle);
});
</script>
here is snap of screen
but it is not working.
is there any solution for that?

this "$("input[title='custom Action']")[0]" is a dom object!
cover it with another $ sign and it would work!
var ttle=$($("input[title='custom Action']")[0]).parent().attr('id');
alert(ttle);

elevateZoom on BSCarousel bug

I have developed a bootstrap carousel with a elevateZoom lens inside it. The issue is that when the mouse leaves the image, the lens does not disappear until the mouse leaves the lens too. In the example shown in official elevateZoom web this does not happen(the lens disappear as soon as the mouse leaves the image).
Here is my code:
<div id="planos" class="carousel slide" style="border-top:1px solid #FCF3E8; top:-1px" data-interval="false">
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox" ng-app="planos-module" ng-controller="planos-controller">
<div ng-repeat="i in getNumber(number) track by $index" class="item" id="plano{{$index+1}}">
<img ng-src="img/planos/{{$index+1}}.jpg" alt="Plano {{$index+1}}" data-zoom-image="img/planos/{{$index+1}}.jpg" />
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control carousel-control-2" href="#planos" role="button" data-slide="prev">
<span class="fa fa-angle-left fa-3x" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control carousel-control-2" href="#planos" role="button" data-slide="next">
<span class="fa fa-angle-right fa-3x" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
And the relevant javascript:
$(document).ready(function(){
//some code
$('#plano1').addClass('active');
$('#planos .item img').each(function(){
$(this).elevateZoom({
zoomType : "lens",
lensShape : "round",
lensSize : 350
});
});
//some more code
});
What am I doing wrong?
Thank you very much
EDIT: Here is the JSFiddle. I wasn't able to replicate it exactly as my web, but the same issue is going on. Also, I couldn't import the elevateZoom js file, so I just copy-pasted its content in the js fiddle (if you scroll down in the JS section you can see my code)
EDIT2: SOLVED! The answer is below.

Solved!
Here is the answer, in case anyone else experiences the same issue.
I just had to add containLensZoom: true option to my elevateZoom initialization.
$(document).ready(function(){
//some code
$('#plano1').addClass('active');
$('#planos .item img').each(function(){
$(this).elevateZoom({
zoomType : "lens",
lensShape : "round",
lensSize : 350,
containLensZoom : true
});
});
//some more code
});

Bootstrap Popover Inside Popover not working

I am using twitter bootstrap to share my post on social media, i have made a link whose popover with some buttons content, but further when i click on buttons in popover, their popover function does not work.
<div class="well text-center">
<button id="but1" title='Popover' class="btn btn-success" rel='popover' data-placement="bottom" data-toggle='popover2'>Share</button>
</div>
<div class='container hide' id='cont'>
<a onclick="Facebook()"
class="btn btn-default">
Facebook
</a>
<a onclick="twitter()"
class="btn btn-default">
Twitter
</a>
<a class="btn btn-default"
data-placement="bottom" data-toggle="popover" data-title="Login" data-container="body"
type="button" data-html="true" href="#" id="login">
Email
</a>
</div>
<div id="popover-content" class="hide">
<form class="form-inline" role="form">
<div class="form-group">
<input type="text" placeholder="Name" class="form-control" maxlength="5">
<button type="submit" class="btn btn-primary" onclick="EmailToSomeOne();">Send</button>
</div>
</form>
</div>
and the js
$('#but1').popover({
html: true,
content: $('#cont').html()
});
$("[data-toggle=popover]").popover({
html: true,
content: function() {
return $('#popover-content').html();
}
});
function Facebook(){
alert('share on facebook');
}
function twitter(){
alert('share on twitter');
}
function EmailToSomeOne(){
alert('Email to send');
}
for more clearing i have created a fiddle also.

Your code works fine. Its just a jsFiddle setting issue.
In your fiddle select no wrap (head) in the dropdown on the left, click Run and it will work.
See example
When onLoad is selected your functions are defined within the closure of the $(document).ready(function() {}); only. Thats the reason it shows the error Uncaught ReferenceError: Facebook is not defined (see the console)
BTW, here's an equivalent example on plunkrenter link description here

You can simply bind the buttons with an id like
<a id="Facebook"class="btn btn-default">Facebook </a>
and access it using
$("#Facebook").on('click',function(){
alert('share on facebook');
})
EDIT:
You cannot have nested popover in bootstrap.However you can use the below two approaches
1)You can change the html inside the popover and display your email form
$('.popover-content').html($('#emailform').html())
Please refer to the fiddle attached for this appproach
https://jsfiddle.net/mohit181191/mxstLfnf/
2)You can open a modal on popover button click.
<a data-toggle="modal" data-target="#facebook"
class="btn btn-default">
Please refer to the below fiddle for this approach
http://jsfiddle.net/mohit181191/o35zqy7w/

Bootstrap not support the Nested popover
http://getbootstrap.com/javascript/#modals

Use this :
$('body').on('click',".btn-default", function(){
alert('share on facebook');
});
.btn-default change this to your button default id

jQuery Selector - <i class>

I'm trying to inject jQuery into a HTML page to create a popup window when I click a link on the page. I'm having trouble with the Selector and/or Syntax.
HTML
<a href="/leads/19365876/edit" class="hoverable edit">
<i class="icon-pencil">
</i>
</a>
Attempted Solution
jQuery(document).ready(function($) {
jQuery('a.hoverable.edit').live('click', function(){
newwindow=window.open($(this).attr('href'),'','height=200,width=150');
if (window.focus) {newwindow.focus()}
return false;
});
});

you forgot to give '_blank' name to your window:
window.open($(this).attr('href'),'_blank','height=200,width=150');

Share javascript sdk not poping up on IE7 and IE8

Inserting the following code does not work on IE7 and IE8. When clicking the link the share dialog should pop up but it does not in these browsers.
'<div class="facebookshare-box-wrapper">
<a href="#"
onclick="
window.open(
\'https://www.facebook.com/sharer/sharer.php?u=\'+encodeURIComponent(location.href),
\'facebook-share-dialog\',
\'width=626,height=436\');
return false;">
<span>Share on Facebook</span>
</a>
</div>'
On fiddle:
http://jsfiddle.net/Am4ND/

I fixed the problem, look at the [result on JsFiddle]http://jsfiddle.net/Am4ND/5/).
<a href="#" onclick="javascript:share();">
<span>Share on Facebook</span>
</a>
<script>
function share() {
window.open(
"https://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(location.href),
"facebooksharedialog",
"width=626,height=436");
return false;
}
</script>
I cleaned and refactored your code, be careful about parameter delimiters.