Develop Reference

simplehtmldom trigger click on element

I am trying to trigger a click on the following element, and then get the innertext of it.
<a class="btn btn-sm btn-default" href="javascript:;" onClick="score(238953,this)">Show result</a>
After "onClick" has been triggered, it should look like this:
<a class="btn btn-sm btn-default" href="javascript:;" onClick="score(238953,this)">1 : 2</a>
This is the code I've tried:
$winner = $this->data->find('.btn-sm', 0)->onclick->innertext;
I am trying to get the 1 : 2 from "innertext".
It is not working, and I don't know if it even does. But any help is appreciated.

You can try it using textContent() and jQuery on event handler:
<?php
//php code
?>
<script>
$('.btn-sm').on('click', function() {
var txt = $(this).textContent();
})
</script>

Jquery click function for a second time do not works

when user click for a second time click do not work, user need to reload the page again to it works
<script>
$(document).ready(function() {
$("#like_post").click(function(e) {
// $("#like_post").on("click", "#like_post", function (e) {
e.preventDefault();
var post_info = $("#post_info :input").serialize();
$.post("backend/ajax/like_post.php", post_info).done(function(data) {
$("#like_post").html(data);
$("#like").load(location.href+" #like>*","");
}).fail(function() {
//alert("Error submitting forms!");
})
})
})
</script>
this is the backend return from db
if user liked it will show
<div id="like_post><a href="" id="l"><input type="hidden" value="unlike" name="like_button" /><i style="color:red" class="fa fa-heart fa-2x" aria-hidden="true" data-toggle="tooltip" data-placement="top" title="'.$lang['you_liked_it'].'"></i>
</a></div>
else it will show
<div id="like_post"> <a href="" id="l"><input type="hidden" value="like" name="like_button" /><i class="fa fa-heart-o fa-2x" aria-hidden="true" data-toggle="tooltip" data-placement="top" title="'.$lang['like_it'].'"></i>
</a></div>
the same validation is on frontend where is will change the hidden input to like, or unlike , my backend check is fine and returning all ok when I check the html response, but the problem is that jquery do not work when user like and unlike without reload the page, it just get the first click and after that user need to reload the page to it works.
I had a similar issue before and it was something with event delegation.

Use the comment line in your code without "#like_post":
$("#like_post").on("click", function (e) {
});

Stop angular from javascript in button using confirm

I have a button:
<button ng-click="deleteCompany(company.id)"
class="btn btn-danger"
onClick="return window.confirm('This will permernently delete the entity\n
Are you sure you want to delete this post?'); ">
<span class="glyphicon glyphicon-trash"></span>
</button>
I also have an angular function:
$scope.deleteCompany = function(id){
console.log(id);
}
When i click cancel in the confirm the console outputs:
1
When i click ok in the confirm the console outputs:
1
I want the angular code to execute when the "Ok" is pressed but not when the "Cancel" is pressed.
JSFiddle example: http://jsfiddle.net/4304ewu5/

Throw your confirm inside the $scope.deleteCompany() function:
function MyCtrl($scope) {
$scope.deleteCompany = function(id) {
if (confirm('This will permernently delete the entity\nAre you sure you want to delete this post?')) {
$scope.name = id;
// delete the stuff.
}
}
}
And remove it from the inline HTML:
<div ng-controller="MyCtrl">
<button ng-click="deleteCompany('1')" class="btn btn-danger">
<span class="glyphicon glyphicon-trash"></span>
</button>
<button ng-click="deleteCompany('2')" class="btn btn-danger">
<span class="glyphicon glyphicon-trash"></span>
</button>
Hello, {{name}}!
</div>
Fiddle: http://jsfiddle.net/0Laztrfk/

Why don't you put the confirm within your deleteCompany method?
$scope.deleteCompany = function(id) {
if (!confirm("Delete company?"))
return;
console.log(id);
}

Audio wont play after loading contents with AJAX

First of all im new to jquery i have tried googling my problem , spent hours to fix this and i couldn't find any , so here i am .
In the below code i have fetched some information ( Songs details ) from database and loaded them to div via ajax .. Up to this point everything works just fine .
script using to load content via AJAX
$(document).ready(function() {
$("#results" ).load( "ajax/profile_ajax.php"); //load initial records
//executes code below when user click on pagination links
$("#results").on( "click", ".pagination a", function (e){
e.preventDefault();
$(".loading-div").show(); //show loading element
var page = $(this).attr("data-page"); //get page number from link
$("#results").load("ajax/profile_ajax.php",{"page":page}, function(){ //get content from PHP page
$(".loading-div").hide(); //once done, hide loading element
});
});
});
<div class="loading-div"><img src="../pagination/ajax-loader.gif" ></div>
<div id="results"></div><!-- content will be loaded here -->
Script im using to play audio
$(function () {
var curAudio;
$(".playback").click(function (e) {
e.preventDefault();
var song = $(this).next('audio')[0];
if (curAudio && song != curAudio && !curAudio.paused) {
curAudio.pause();
$(curAudio).prev().html('<i class="fa fa-play"></i> Play');
}
if (song.paused) {
song.play();
curAudio = song;
$(this).html('<i class="fa fa-pause"></i> Stop');
} else {
song.pause();
curAudio = undefined;
$(this).html('<i class="fa fa-play"></i> Play');
}
curPlaying = $(this).parent()[0].id;
});
});
I have above code to played the fetched music . Now the problem is None of the Buttons are functional even though my code worked fine before i use AJAX .
My Fecthed HTML is like this
<div id="4">
Track Name :- <b>Heros</b>
<br />By :- <a target="_blank" href="../members/profile.php?id=1">USER NAME</a>
<br />
<button class="playback btn btn-primary btn-sm hdnbtn"><i class="fa fa-play"></i> Play</button>
<audio src="../members/memberfiles/1/Heros.mp3">
Your browser does not support HTML5 audio.
</audio>
<a class="btn btn-sm btn-success hdnbtn" href="../members/downloader.php?fld=1&name=Heros.mp3" name="dwn"><i class="fa fa-download"></i> Download MP3</a>
<button class="sharer btn btn-sm btn-danger hdnbtn" type="button"><span class="fa fa-share-alt"></span> Share</button>
<a target="_blank" href="#" class="hide btn btn-sm btn-social btn-facebook socialhdn"><i class="fa fa-facebook"></i> Share on Facebook</a>
<a target="_blank" href="#" class="hide btn btn-sm btn-social btn-twitter socialhdn"><i class="fa fa-twitter"></i> Tweet this </a>
<a target="_blank" href="#" class="hide btn btn-sm btn-social btn-google-plus socialhdn"><i class="fa fa-google-plus"></i> Share on goole</a>
<br />
<i class="fa fa-minus"> Show Less</i>
<input type="hidden" value="Heros.mp3" name="file_name">
<input type="hidden" value="bWVtYmVyZmlsZXMvMS9IZXJvcy5tcDM=" name="link">
What i really need is to play the fetched content using the 2nd script (audio) i posted . i have no idea how to fix this . Tried hours of googling and various suggested methods. None of them worked for me . Please Point out what went wrong . i really appreciate it !

use below code to play audio . you also check Event delegation to attach event to dynamically created element. Event delegation allows us to attach a single event listener, to a parent element, that will fire for all descendants matching a selector, whether those descendants exist now or are added in the future.
$(function () {
var curAudio;
$(document).on('click',".playback",function (e) {
e.preventDefault();
var song = $(this).next('audio')[0];
if (curAudio && song != curAudio && !curAudio.paused) {
curAudio.pause();
$(curAudio).prev().html('<i class="fa fa-play"></i> Play');
}
if (song.paused) {
song.play();
curAudio = song;
$(this).html('<i class="fa fa-pause"></i> Stop');
} else {
song.pause();
curAudio = undefined;
$(this).html('<i class="fa fa-play"></i> Play');
}
curPlaying = $(this).parent()[0].id;
});
});

Jquery updating link with href value

I have the following code
jQuery(document).ready(function($)
{
$("#deleteorderb").click(function()
{
$("#deleteorder").attr('href','/deleteorder.php?id=' + $('#deleteorderb').val());
})
});
<a onclick="jQuery('#modal-2').modal('show');" id="deleteorderb" name="deleteorderb"
value="<?php echo $r['id']; ?>" class="btn btn-danger btn-sm btn-icon icon-left">
Cancel
</a>
When I click the link, it opens a popup modal, which has a but of text saying are you sure you want to delete, and then there's a link, herf, I want to update that herf to equal the the other href's value which will be a database query to get the id. the ink updates with the above but not the id. I have checked the source code and the a hrefs value IS set.

You want to grab element attribute value, so instead of
$('#deleteorderb').val()
try
$('#deleteorderb').attr('value')

Try something like this, *note the use of .attr("value") not .val():
<a onclick="dialog();" id="deleteorderb" name="deleteorderb" value="<?php echo $r['id']; ?>" class="btn btn-danger btn-sm btn-icon icon-left"> Cancel</a>
<script>
$(document).ready(function() {
$("#deleteorderb").click(function() {
var a = $('#deleteorderb').attr("value");
var link = "/deleteorder.php?id=" + a;
$("#deleteorder").attr("href", link);
});
function dialog() {
$('#modal-2').modal('show');
};
});
</script>

The value attribute is normally used on form fields. So in your case it would make sense to use a data attribute as follows:
<a id="deleteorderb" name="deleteorderb" data-value="<?php echo $r['id']; ?>" .....
And in your JavaScript you could access it like so:
$('#deleteorderb').data('value');
BONUS
I would not recommend using inline JS. Instead just use jQuery to setup a click event listener in your DM ready callback:
$('#deleteorderb').on('click', function( e ) {
e.preventDefault();
$('#modal-2').modal('show');
});
Updated html:
<a
id="deleteorderb"
name="deleteorderb"
data-value="<?php echo $r['id']; ?>"
class="btn btn-danger btn-sm btn-icon icon-left">
Cancel
</a>