Ajax with JSON GET request undefined - javascript

I am trying to get the front end to display the contents of my dynamo db table although it displays the information as undefined.
$(document).ready(function(){
$.ajax({
type: 'GET',
url:someURL,
success: function(data){
$('#incidentid').html('');
data.forEach(function(IncidentNotesItem){
$('#incidentid').append ('<p>'+ IncidentNotesItem.incidentid + '</p>');
})
}
});
});

I solved it! The issue was that I wasn't calling the column name properly. I did console.log(IncidentNotesItem) to see what is stored inside the IncidentNotesItem Function and saw on the console that it is called id instead of incidentid.
$(document).ready(function(){
$.ajax({
type: 'GET',
url:someURL,
success: function(data){
$('#incidentid').html('');
data.forEach(function(IncidentNotesItem){
$('#incidentid').append ('<p>'+ IncidentNotesItem.id + '</p>');
})
}
});
});

Related

Reading data from JSON reply with JQuery

I've been having trouble accessing this piece of content in a json object. Here is my code for fetching data:
function getEntries(key){
$.ajax({
url: "https://openlibrary.org/api/books?bibkeys=ISBN:" + key + "&jscmd=details&callback=mycallback",
dataType: "jsonp",
success: function(data){
console.log(data);
}
});
}
The reply I get looks like this:
How do I access the pointed object if the key is different for every search?
Try using
data["ISBN:"+key]
Where key is the key you are passing to the function
I think I found it after all...
function getEntries(key){
$.ajax({
url: "https://openlibrary.org/api/books?bibkeys=ISBN:" + key + "&jscmd=details&callback=mycallback",
dataType: "jsonp",
success: function(data){
console.log(data["ISBN:"+key]);
}
});
}
did the trick.

javascript:post data to same page

$(document).ready(function(){
$('#list li').click(function(){
var ID= $(this).attr('id');
$.post("index.php", ID,
function(){
$("#category").html(ID);
}
);
});
});
This code shows my selected list ID in html <div id="category">.
Question
Is there any way to post that data directly to PHP code and echo it? I need data in php, because I want to use it in my query.
$.ajax({
type: "POST",
url: 'index.php',
data: { id: ID }, // name of the post variable ($_POST['id'])
success: function(data) {
console.log('successfully posted data! response body: ' + data);
}
});
Maybe you can use ajax:
$('#list li').click(function(){
var ID = $(this).attr('id');
$.ajax(
url:"index.php", //Page with data
data:{id: ID},
type: "POST", //You can use any method POST, GET, DELETE, PUT...
success:function(result){
$("#category").html(result);
});
});
You aren't sending a key/value pair ... only a value.
You also have not added the argument for the response in the completion callback
Change
$.post("index.php", ID, function(){
$("#category").html(ID);
});
To
$.post("index.php", {id: ID}, function(response){ //object used for key/value pairs
$("#category").html(response.data);
},'json')
.fail(function(error){
alert("Ooops ..something went wrong");
});
Then for simple php test
echo json_encode(array('data'=>'The ID sent was '. $_POST['id']));

pass data($post) to php file using javascript without callback

I need to pass data from HTML page to PHP page But without data callback ....
i'm used two method but One of them did not succeed
1)
$.ajax({
type: "POST",
url: 'phpexample.php',
data: {voteid: x },
success: function(data)
{
alert("success! X:" + data);
}
});
2)
$.post("getClassStudent.php",
{
},
function(data){
$("#div_id.php").html(data);
}
);
as i can understand, you just want to send info to a php script and don't need the response, is that right?
try this
$.post("phpexample.php", {voteid:x});
or simply remove the "succes" function from the equation if you feel more confortable using $.ajax instead of $.post
$.ajax({
type: "POST",
url: 'phpexample.php',
data: {voteid: x }
});
your fisrt example is correct, the second is not well formed.
more info:
http://api.jquery.com/jquery.post/
EDIT: to help you some more :)
<button type="button" id="element-id">click</button>
<button type="button" class="class-name">Click</button>
$(document).ready(function(){
//if you are marking ans element by class use '.class-name'
$(".class-name").click(function(){
$.post("getClassStudent.php");
});
//if marking by id element use '#id-name'
$("#element-id").click(function(){
$.post("getClassStudent.php");
});
});
be carefful with the markings, for debuggin try to use "console.log()" or "alert()" so you can see where is the problem and where the code crushes.
var formData = {
'voteid' : 'x',
};
$.ajax({
type : 'POST',
url : 'phpexample.php',
data : formData, // our data object
dataType : 'json',
encode : true
}).done(function(data) {
console.log(data);
});

Ajax GET request, why does success function not print?

I have this function that performs a GET request for a given id:
var findById= function(id) {
console.log('findById: ' + id);
$.ajax({
type: 'GET',
url: rootURL + '/' + id,
dataType: "json",
success: function(data){
console.log('findById success: ' + data.name);
currentRaceEntry = data;
renderList(currentRaceEntry);
}
});
};
When I enter sitename/rest/entries/8 it returns a page with the xml for the object requested(as expected). (I can show this code but I dont think the problem is there). When I preform this request the console shows:
findById 8
My question is why doesn't it show console.log('findById success: ' + data.name);? The xml displays in the browser which looks to me like it was successful. So why doesn't the success function appear to be called? Thanks!
EDIT
this is what it looks like:
The console in the browser is blank
If you ajax request returns XML data, you need to set dataType as "xml".
At that point, the data object in the success function is an XML fragment, not a javascript objet, and you need to process it as such. The data.name property doesn't exist.

pass data to lable in same page using jquery

i have this working code with this code i can pass data to div within same page
but insted of passing data to div i want to pass this to label or textbox so that i can post it to the server. i am new in ajax,jquery . please suggest me best answer
<script type="text/javascript">
//send clicker data to div
$(function() {
$(".clicker").mouseover(function(){
var data = $(this).attr('id');
$.ajax({
type: "POST",
data: "db_data=" + data,
success: function(){
//alert(data);
$('.responseDiv').text(data);
}
});
});
});
</script>
<script type="text/javascript">
i think i need to change this line only
$('.responseDiv').text(data);
but dont know how to do that. didnt find any solution on net also
take any name like propertyId
Let's say the text field has id="propertyID"
Use the val() method to assign this new value to your text field.
$('#proertyID').val(data);
Like:
$(function() {
$(".clicker").mouseover(function(){
var data = $(this).attr('id');
$.ajax({
type: "POST",
data: "db_data=" + data,
success: function(){
//alert(data);
// $('.responseDiv').text(data);
$('#proertyID').val(data);
}
});
});
});
In the below line change selector .responseDiv with id/name or class of input/label $('.responseDiv').val(data);
<script type="text/javascript"> //send clicker data to div
$(function() {
$(".clicker").mouseover(function(){
var data = $(this).attr('id');
$.ajax({
type: "POST",
data: "db_data=" + data,
success: function(data2){
//alert(data);
$('.responseDiv').text(data2);
}
});
});
});
success return in data2 and use this..

Categories

Resources