Hello everybody i sent some value to php from Jquery $.post method and i want give some data from database
when load data from database is not completed show loading text and when load completed show data(It's contain some tables, div, text and image)
var val = "";
$.post("showData.php",{val: "loadMyTable"},
function(response) {
// if data loaded do something
// if not show loading text
});
Show your loading text in beforeSend and show your data in complete callback:
$.ajax({
type: 'POST',
url: "showData.php",
data: {val: "loadMyTable"},
beforeSend : function() {
$('#loadingText').show();
},
success : function(data) {
$('#loadingText').hide();
$('#myNewContent').html(data);
}
});
Related
i need help because i'm stuck and don't know what's wrong ,i try to send user clicked button "id" to php to get related data from database in the same page
$(".button_class").on("click", function() {
ToEditId = $(this).attr('id');
console.log(ToEditId ); //to check clicked id is Ok
$.ajax({
type: "POST",
url: same/php/page/path,
data: {
ToEditId: ToEditId
},
success: function(res, data) {
console.log(res, data);
},
error: function(err) {
alert(err);
}
});
});
the ajax print success in console log ,here is php code to get the value if clicked id
<?php
if(isset($_POST['ToEditId'])){
$to_edit_id=$_POST['ToEditId'];
var_dump($to_edit_id);
}
but nothing happen in php file !!
Which is the expected behaviour.
PHP is not dynamic. It doesn't "update".
PHP only runs once. This means that once your page is rendered, you cannot use PHP to change it again. You actually would have to use javascript to change the page, like so;
PHP side:
<?php
if(isset($_POST['ToEditId'])){
echo $_POST['ToEditId'];
$to_edit_id=$_POST['ToEditId'];
var_dump($to_edit_id);
die(); // prevent entire page from re-rendering again.
}
JS side:
$(".button_class").on("click", function() {
ToEditId = $(this).attr('id');
console.log(ToEditId ); //to check clicked id is Ok
$.ajax({
type: "POST",
url: same/php/page/path,
data: {
ToEditId: ToEditId
},
success: function(res, data) {
//Add your PHP file's response to the body through javascript.
$('body').append(res);
},
error: function(err) {
alert(err);
}
});
});
As #IncredibleHat mentioned, you should make sure your page doesn't render any of its usual HTML, so it won't return the entire page back to your ajax call. So put the PHP all the way above your html!
Please help me to solve my problem.
$("#kategori_laporan").change(function() {
$("#loaderIcon").show();
$("#imgLoader").show();
var id = $(this).val();
$.ajax({
type: "POST",
dataType: "html",
url: "_views/getAjaxSubKategori.php",
data: "id="+id,
success: function(data) {
$(".select-skategori").select2({
ajax: {
url: "_views/getAjaxSubKategori.php",
dataType: 'json',
data: function(term, page) {
search = term.toUpperCase();
},
results: function(datas, page) {
return {
results: data
};
}
},
formatResult: function(option) {
return "<div>" +option._sub_kategori_laporan+ "</div>";
},
formatSelection: function(option) {
return option._sub_kategori_laporan;
}
});
}
});
});
Data not showing to subcategory select. Thanks before.!
Screenshot >> http://i.imgur.com/FlCeGpo.jpg
Why are you firing an ajax request before you initialize the select2 box?
I ask this, because your select2 box is requesting the search results via ajax as well. But maybe there is a reason. Please explain.
Then I can see in your screenshot, that your data returned from the json ajax request has not defined values id and text. If you are using other values ('_sub_kategori_id' and '_sub_kategori_laporan') in your json result, you have to tell the select2 box, what is your id and text field. I think you can do this with the processResults method as described here:
How to load JSON data to use it with select2 plugin
how to load user's data from db to php to ajax and then manipulate the DOM?
here's what is in my mind :
user logged in -> fetch user data from db with php -> ajax request all the data using post -> do something on DOM
how the ajax look like? I only know how to use this to do from ajax to php to db :
$.ajax({
type: "POST",
url: "send.php",
data: { item : text }
})
You can do your backend operation in send.php, then you can return the html data from the backend
Eg. In send.php
echo "<h2>" . $your_db_thing . "</h2>";
In ajax, add success settings,refer Jquery Ajax
$.ajax({
type: "POST",
url: "send.php",
data: { item : text },
success:function(data) { // data will be <h2>your_db_thing</h2>
$('#successDiv').html(data); // the success element in which your html to be placed
}
})
I have two files. One PHP-file, which contains a SQL-Select statement and returns the output as html. The second file is my index file which contains a div with the class "loadMembers" and some jquery code:
$(document).ready(function () {
function startInterval() {
var refreshId = setInterval(function () {
$.ajax({
url: 'sidebars/members.php',
type: 'html',
success: function (resp) {
$("div.loadMembers").html(resp);
}
});
}, 5000);
}
startInterval();
});
I want to refresh the div with database data in a 5 seconds interval. I tried it also with .load()...
The request contains some data but nothing from my database...
Where's the problem?
Thanks for any help :)
your request type can be get or post, not html, it should be dataType
url : 'sidebars/members.php',
type: 'POST', // or GET
dataType : 'html',
this is an ajax method that inserts the data into a db and should supposedly display the new content.
<script type = "text/javascript">
$(document).ready(function() {
$('#submit').live('click', function(eve) {
eve.preventDefault() ;
var form_data = {
title: $('#title').val()
};
$.ajax({
url: "http://localhost/ci/index.php/chat/comment",
type: 'POST',
data: form_data,
success: function(msg) {
alert(msg);
}
});
});
});
</script>
However in my /chat/comment, i am loading the view again, i.e, user submits a comment, load the view again and the comment should be there. My response from server is the view's HTML. However the view comes with all the divs and there are many of them. I need to retrieve only part of the div, say, #commentspace from the ajax on success.
Look at the jQuery $.load() function?
Example
Inside "firstpage.html"
$('#content').load('secondpage.html #content');