We Keep Coding

Jquery alert fire two times instead of once with php

I am working with jquery and php, Right now i have "Edit" button but whenever
i am clicking on button i am getting "alert" twice instead of one time,
Here is my html code(inside php tag)
<?php
$PostComment2='<div class="button1'.$CommentID.'">
<span name="MaxValue" value='.$CommentID.' data-val='.$CommentID.' id="MaxValue" class="edit_post_comment">
Edit2
</span></div>';
?>
Here is my script
<script>
$(document).ready(function(){
$(document).on('click','.edit_post_comment',function(e){
e.preventDefault();
alert('Hello world');
//further code...
});
});
</script>
How can i alert one time only instead of twice,Where i am wrong ?

may you are using the class twice in the body? Please check. You may try using id.

Loading content to the div using AJAX/jQuery

I am a beginner in playing with jQuery/AJAX, my goal is to load content to the div below:
<div id="blogcontentloaded">
</div>
I came up with .load and it worked, the page loads but it keeps refreshing and loads over and over.
$(function loadBlog(e) {
$('#blogcontentloaded').load('/blog/page1.html');
e.preventDefault();
return false;
});
I tried using e.preventDefault but it doesn't work for me.
Also my goal is to do this without any buttons. When main page loads portion of the page that I want to load along with main page is going to be for updating the content in loaded element.
Thanks for the help!

You can use the javascript load function. It may solve your problem. here you can get some information about windows load and jQuery ready functions.
$( window ).on( "load", function() {
$('#blogcontentloaded').load('/blog/page1.html');
});

You need to wrap the function in the 'ready' function and make sure that it is executed once:
$(document).ready(function(){
$('#blogcontentloaded').load('/blog/page1.html');
});

Have you used the jQuery file on the top of other js files?
Add the jQuery.js file
$(document).ready(function(){
$('#blogcontentloaded').load('/blog/page1.html');
e.preventDefault();
return false;
})

jQuery Load inside another Load not working

I have a document ready load when I click a button on view.php:
<script type="text/javascript">
$(document).ready(function () {
$("#admin_user_view").load('admin_modules/user_mgt/pending.php', function(){ //get content from PHP page
$(".loading-div").hide();
});
});
</script>
The pending.php page also contains another load:
$("#pending_view" ).load( "fetch_pages.php?query=admin_user_view&view_page=pending", function(){ //get content from PHP page
$(".loading-div").hide();
});
The problem is, the loading in pending.php is not working. I also tried:
$('#admin_user_view').load('admin_modules/user_mgt/pending.php',
function(){
$("#pending_view" ).load( "fetch_pages.php?query=admin_user_view&view_page=pending", function(){ //get content from PHP page
$(".loading-div").hide();
});
});
What did I miss? Or is this really not possible? If not possible, what alternative can I do?
Your help is highly appreciated.
Thanks!
Note: Both the first and the second load functions are wrapped in document ready function and the third one is being called by a function when a button is clicked.

Forgive me for not double checking everything. The jQuery functions are working perfectly. The problem lies within the PHP code I'm calling inside that load so nothing seems to happen. When I fixed the PHP code, everything worked fine. Thanks for your help!

Button Click from PHP is not responding

I echo a button from a php script as following: print'<button id="testingbtn">TEsting</button>';
I use the id listen to the button and alert a notification message as following:
$('#testingbtn').click(function(){
alert('working');
});
The thing is that i used the same method before and it worked for me on all browsers but not anymore. can someone try to help me out the problem.
thanks guys..

Try this, we assuming your 'testingbtn' is dynamically added to the screen.
$(document).ready(function(){
$( "body" ).on( "click", "#testingbtn", function() {
alert('working');
});
});

I never recommend to do it in this way. Always put this code outside php.
HTML
<button id="testingbtn">TEsting</button>;
jQuery
$('#testingbtn').click(function(){
alert('working');
});
Also make sure jQuery is included in your code.

Point 1: Check whether you have included the jquery library or not.
Point 2: [If point 1 is OK], Where have you put your script? If you put your script before button code, than use document ready function
$(document).ready(function(){
$('#testingbtn').click(function(){
alert('working');
});
});
Alternately, if you want to put your code unchanged, than place your script after your button code[best practice: put them at the bottom of the page].

I don't use print. I always use echo to show it in my html page.
<?php
echo '<button id="testingbtn">TEsting</button>';
?>
In jquery:
$('#testingbtn').click(function(){
alert('working!');
});
Try reading this

Twitter Bootstrap Popovers not working for Dynamically Generated Content

New to posting on stackoverflow here, so my apologies in advance if I messed anything up here.
I'm using Twitter Bootstrap's popovers. My popovers seem to be working for elements that I manually type into my HTML document - but NOT the elements that I dynamically generate via Javascript / Ajax.
For example, the popover seems to work if I manually add this directly to my HTML document:
<p rel=popover data-content='It is so simple to create a tooltop for my website!' data-original-title='Twitter Bootstrap Popover'>hover for popover</p>
But what I really need is for my dynamically generated elements to have popovers. I use an XMLHttpRequest to send a request to a PHP file, and then grab the responseText and display it. When I add this line of code to my aforementioned PHP file:
echo "<p rel=popover data-content='It is so simple to create a tooltop for my website!' data-original-title='Twitter Bootstrap Popover'>hover for popover</p>";
... surely enough, the words "hover for popover" appear - but the popover itself doesn't work!
This has been driving me nuts for some time and it would be incredible if someone could lend me a helping hand! I've also added the JQuery function I'm using to enable Bootstrap's popovers below, for what that's worth.
$(function (){
$("[rel=popover]").popover({placement:'left'});
});
I've done a thorough search of similar problems and the best I could find was this link. But that link doesn't seem to have any solutions either. Thanks in advance again!
UPDATE:
Fixed! Many thanks to everyone who helped out. My problem was that the function was being called BEFORE the elements were added into the Document Object Model. There are multiple possible fixes - I simply tested out the solution by shifting the popover function to the END of the Ajax function and it worked!

You need to call $("[rel=popover]").popover({placement:'left'}); AFTER the elements are in the DOM.
UPDATE
If you are using jQuery
$(element_selector)
// load results into HTML of element_selector
.load('your/php/file')
// when done, initialize popovers
.done(function(){
$("[rel=popover]").popover({placement:'left'});
});
OR a catch all for jQuery ajax requests
$.ajaxComplete(function(){
$("[rel=popover]").popover({placement:'left'});
});

In the success function of the ajax you need to call the popover. Something like this
success:function(){
$("[rel=popover]").popover({placement:'left'});
}

This Function will work properly in the selector you have to specify the location on the page where you have to search "rel=popover" like I put *
$(function ()
{
console.info($("*[rel=popover]"));
$("*[rel=popover]").popover();
});