<script type="text/javascript">
function login(id){
var dataString = 'Id='+ id;
$("#infos").show();
$("#infos").fadeIn(900).html('Please wait... <img src="dashboard/images/loading.gif" />');
alert(id);
$.ajax({
type: "POST",
url: "ajax-login.php",
data: dataString,
cache: false,
success: function(data){
$("#infos").hide();
alert(data);
$('#info').html(data);
$("#info").show();
}
});
}
</script>
<p class="help-block redtext" id="infos" ></p>
<div id="info"></div>
Above is my code and apparently when i attach the results to the div with id='info', they stay there for like 2 seconds then they disappear, the php script that loads data loads very well and it actually shows but it doesnt stay, it gets lost after 1 or 2 seconds, please help
Related
I currently have my HTML site set up where I pass a div id as data into my Ajax.
<div id="1" class="stats">
DATA GOES IN HERE
</div>
<div id="2" class="stats">
DATA GOES IN HERE
</div>
I have it so that when the page first loads, an Ajax call is loaded that finds the div id and makes use of it back-end to bring the DATA forward.
$(document).ready(function(){
var fId = $(".stats").attr("id");
$.ajax({
url: 'get_stats',
type: 'GET',
data: {fId : fId},
success: function(data) {
$("#"+fId).html(data);
},
error: function(data){
alert("ERROR: " + data);
}
});
});
The data can be brought. However, I have about 26 of these divs and I need to do this call 26 times. The problem is, the call is only made once and the data is only loaded for the very first div.
How can I make it so that I pass the data from all 26 divs into the Ajax call and bring it into the HTML when the page is first loaded?
Please try this
$(document).ready(function(){
$(".stats").each((i,e)=>{
let fId=$(e).attr("id");
$.ajax({
url: 'get_stats',
type: 'GET',
data: {fId : fId},
success: function(data) {
$("#"+fId).html(data);
},
error: function(data){
alert("ERROR: " + data);
}
});
})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="1" class="stats">
DATA GOES IN HERE
</div>
<div id="2" class="stats">
DATA GOES IN HERE
</div>
You can just do that with a loop like:
let divs = $(".stats");
$.each(divs, function (div) {
//..do your ajax request here
});
I have a web service
http://itmamhosting-001-site16.itempurl.com/lsc/GenerateCertificate.asmx/GenerateCertificate?Name=saif
It has a Url inside it :
How to call it using jQuery and take the picture url from it and save it inside a variable
I tried this code to call it but doesn't work
$(document).ready(function () {
$.ajax({
type: "GET",
url: "http://services.faa.gov/airport/status/IAD?format=application/xml",
dataType: "xml"
});
});
I got this error
no access control , Allow origin header is present on the requested resource
Im new to jquery and js ,Im stuck i tried many codes if some one can give or show
$(document).ready(function () {
$.ajax({
type: "GET",
url: "https://services.faa.gov/airport/status/IAD?format=application/xml",
dataType: "xml",
success: function(data){
var xmlString = data.documentElement.innerHTML;
$("#result").html(xmlString);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea name="" id="result" cols="50" rows="50"></textarea>
I have a parent div with two child.When button clicks it shows only one div based on condition.
<div id="table">
<div id="result_table" >
</div>
<div id="new">
</div>
</div>
Am assigning the data to table depends on the data retrieved from the page.So i want to hide the result _table while the new table is visible.
$('#BUTTON').click(function(){
$.ajax({
url: PAGE.PHP,
type:'POST',
dataType: 'json',
success: function(data){
$("#result_table").html(data.table);
$("#new").html(data);
}
});
});
You can check data results
$('#BUTTON').click(function(){
$.ajax({
url: PAGE.PHP,
type:'POST',
dataType: 'json',
success: function(data)
{
if(data.table)
{
$("#result_table").show().html(data.table);
$("#new").hide();
}
else
{
$("#new").show().html(data);
$("#result_table").hide();
}
}
});
});
I want to send information to the screen id that information sent to it by the echo. I get this interaction takes place via ajax would like to receive information from the entire screen again displays. Please help
$(document).ready(function(){
$('#button').click(function(){
var id = $(this).attr('id_1');
$.ajax({
url:'get.php',
type: 'get',
data:{id:id},
success: function(data){
//alert(data);
$('#result').html(data);
}
});
});
});
<body>
<?php if(isset($_GET['id'])){echo $_GET['id'];}?>
test
<div id="result"></div>
after result
20
<a>test</a>****------------------------------>Is repeated
<a>test</a>
but i want just this result
20
Change you type as GET in AJAX
$('#result').empty();
$.ajax({
url:'get.php?id='+ id,
type: "GET",
//data:{id:id},
success: function(data){
//alert(data);
$('#result').html(data);
}
});
});
Try this. It will displays the output as you said.
<script type="text/javascript">
$(document).ready(function(){
$('#button').click(function(){
var id = $(this).attr('id_1');
$.ajax({
url:'get.php',
type: "get",
data:{id:id},
success: function(data){
$('#result').html(data);
}
});
});
});
</script>
<div id="result">
test</div>
This is get.php
<?php if(isset($_GET['id'])){echo 'hi';}
?>
if you want exit:20 as output, then change get.php as
<?php if(isset($_GET['id'])){echo 'exit : '.$_GET['id'];}
?>
Firstly, there have some tag links in my main page. click each one, post value to b.php with jquery.ajax and turn back value in div#result.
b.php have a search box. when search something in it. the result data will still show in the div#result.
my problem is: I know if I will do jQuery ajax in the b.php, I shall write the jQuery code in the first success part. but this only can control one time, when I continue search in the search box, the jQuery not work. I think I met a loop problem. How to solve it?
a.php
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.click').click(function(){
var value1 = $(this).text();
$.ajax({
url: "b.php",
dataType: "html",
type: 'POST',
data: "data=" + value1,
success: function(data){
$("#result").html(data);
$('#search').click(function(){
var value = $('#search1').val();
$.ajax({
url: "b.php",
dataType: "html",
type: 'POST',
data: "data=" + value,
success: function(data){
$("#result").html(data);
}
});
});
}
});
});
});
</script>
<a rel="aa" class="click">aa</a>
<a rel="aa" class="click">bb</a>
<div id="result"></div>
b.php
<?php
echo $_POST['data'];
?>
<form name="form">
<input type="text" value="" id="search1">
<a name="nfSearch" id="search">search</a>
</form>
When a new element is introduced to the page the jQuery .click() method becomes useless because it can only see elements that were part of the original DOM. What you need to use instead is the jQuery .live() method which allows you to bind events to elements that were created after the DOM was loaded. You can read more about how to use it at the below link.
.live() – jQuery API
$('#search').live('click', function(e) {
// Prevent the default action
e.preventDefault();
// Your code here....
});
First of all i think you should attach the ajax call to the click on the link: the way you are doing right now just execute an ajax call as soon as the page is loaded.
$(document).ready(function(){
//when you click a link call b.php
$('a.yourclass').click(function(){
$.ajax({
url: "b.php",
dataType: "html",
type: 'POST',
data: "data = something",
success: function(data){
$("#result").html(data);
var value = $('#search').val();
$.ajax({
url: "b.php",
dataType: "html",
type: 'POST',
data: "data =" + value,
success: function(data){
$("#result").html(data);
}
});
}
});
});
});
In this way, each time a link with the class of "yourclass" is clicked an ajax call to b.php is sent and if it succed, another call is made (always to b.php). I don't understand if this is what you are looking fo, if you post your html my answer can be better.
In b.php of course you need to echo some html that can be used in the callback
It's strange how your attempting to do two ajax requests like that, surely one is enough. If you need to support multiple text boxes then you just adjust your selectors.
Your whole code can be shortended down to something like this:
$(document).ready(function() {
$('#result').load('b.php', { data: $('#search').val() });
});
So if you wanted to search for the value when clicking on a link (for links within #container):
$('#container').delegate('a', 'click', function() {
// .text() will get what's inside the <a> tag
$('#result').load('b.php', { data: $(this).text() });
});