How to Load PHP File into Div by Jquery

How to load PHP file into DIV by jQuery?

add home.php page url instead of file name.

$(document).ready(function(){
$("#contact").click(function(){
$("#contents").load('url to home.php');
});
});

How to load a PHP page into a div with jQuery and AJAX?

You can do it with jQuery for example.

var id = 1;
$('#digital_download').html('Downloading...'); // Show "Downloading..."
// Do an ajax request
$.ajax({
url: "getproduct.php?id="+id
}).done(function(data) { // data what is sent back by the php page
$('#digital_download').html(data); // display data
});

Can't Load a php file result into a div

Simple solution to get contents of a file after it's execution on server is a load() function.

Example

php-file script.php

<?php
echo 'Hello, world!';
?>

js-handler:

$("#button").click(function(){
$("#div").load('/script.php');
});

So, after clicking #button contents of a #div will be "Hello, world!".

Path provided to load must be path form site root (DOCUMENT_ROOT). For example

  • /script.php - path from site root
  • /blog/index.php - index.php file in a blog folder of a site

load php file on load with jQuery

code now working thanks for all the help:

<script>
$(document).ready(function(){
$('#time').load('http://www.my-website.co.uk/my-php-file.php');
});</script>
<div id="time"></div>

How to include php file using jquery

First, make sure you include the jQuery library.

Second, don't use include as it isn't necessary. You will just load the file via jQuery:

<script type="text/javascript">
$(document).ready(function(){
var about_me = "del.php";
$('#content').click(function(){
$('#content').load(about_me);
});
});
</script>

NOTE: You have a typo in your selector $content should be #content to make it clickable. I have also included a document ready function in the event your script is at the top of the page, instead of the bottom.

load .php file in div with ajax (wordpress)

You need to echo the full path of the theme:

$('#ajax').load('<?php echo get_template_directory_uri(); ?>/test.php');

Additionally, make sure jQuery is loaded first before running:

document.addEventListener("DOMContentLoaded", function(event) { 
// your code here
});

Ajax load php file into div

I suppose you're trying to add a hidden field to store the user's id in the dom.

// Wrong
<input type="text" id="friendid" value="1" hidden>

// Good
<input type="hidden" name="friendid" value="1">

You can also save your user's ID in the dom using data attribute.

Another way is to store the user's id as the ID of your div in order to have a unique ID then a class called user for styling and javascript.

<div class="user" id="user-1">
<img src='webimgs/nopf.jpg'>
<span class="name"><h4> fullname</h4></span>
<input type="text" name="friendid" value="1" hidden>
<br>
</div>
<div class="user" id="user-2">
<img src='webimgs/nopf.jpg'>
<span class="name"><h4> fullname</h4></span>
<input type="text" name="friendid" value="2" hidden>
<br>
</div>
<div class="user" id="user-3">
<img src='webimgs/nopf.jpg'>
<span class="name"><h4> fullname</h4></span>
<input type="text" name="friendid" value="3" hidden>
<br>
</div>

Then in javascript we will bind the event to every occurence of user class.

$(function(){

$('.user').click(function(){

// Retrieve the id from the hidden field.
var id_value = $(this).find('input[name="friendid"]').val();

// Retreive the user's ID from the ID attribute
// var id_value = this.id.substring(5); // let's get rid of the prefix

// if you're using a data attribute
// may be data-user
// then we'll use this instead
// var id_value = $(this).data('user');

$.get('showfriend.php', {id: id_value}, function(data) {
$('#middelfeedbody').html(data);
});

})

})

How to load php file into div using jQuery Load with passing parameter

In your JS:

// ...
dataType: "json",

// pass key/value pairs
data: {keyword: "foobar"},
type: "post",
// ...

In your PHP:

if(isset($_POST['keyword']) && !empty($_POST['keyword'])) {
echo $_POST['keyword']; // echoes "foobar"
}

Loading external php file in a div with jquery ajax

You have to add jquery js in your html code. you can use online jquery.

   <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>


Related Topics



Leave a reply



Submit