Passing id in jquery functions - javascript

I need to pass "hitnr" to another function.
Here's how I "get" the number:
$("#HitList").click(function(event){
event.preventDefault();
generateHitID(18);
});
Here's the part where there's nothing wrong:
function generateHitID(hitnr)
{
$.ajax({
url: "http://api.q-music.be/1.2/lists/"+hitnr+"/editions",
dataType: "jsonp",
success: function(json){
console.log(json);
lastEditionID = json.editions.length - 1;
generateHitPage(json.editions[lastEditionID].id);
alert(hitnr);
}
});
}
The alert displays 18 here, which is correct.
But when I try to request it in another function (generateHitPage) something goes wrong..
function generateHitPage(hitnr, editionID)
{
urlString = "http://api.q-music.be/1.2/lists/"+hitnr+"/editions/" + editionID;
alert(urlString);
$.ajax({
url: urlString,
dataType: "jsonp",
success: function(json){
console.log(json);
ETC.......................
The alert becomes: http://api.q-music.be/1.2/lists/340/editions/undefined
-> The number has changed from 18 to 340 for no reason at all!

I think you forgot to pass in the hitnr parameter here:
generateHitPage(json.editions[lastEditionID].id);
This should be:
generateHitPage(hitnr, json.editions[lastEditionID].id);

Related

Can't get jQuery var to PHP

I am trying to get a jQuery var into PHP so I can use it with mysql. I have searched everywhere but nothing seemed to solve it.
I have the following jQuery code:
$('.eventRow').click(function(){
var eventID = this.id;
$.ajax(
{
url: "index.php",
type: "POST",
data: { phpEventId: eventID},
success: function (result) {
console.log('success');
}
});
$('#hiddenBox').html(eventID);
console.log(eventID);
});
If I run this, the ID is shown in both #hiddenBox and in the console.log. The console also says "Succes" from the Ajax.
I am trying to get it in the php file:
$value = $_POST['phpEventId'];
echo "<div class = 'showNumber'>"."Nummer: ".$value."</div>";
It just says: Nummer:
It also gives no error whatsoever.
Thanks for your help!
Try
var eventID = $(this).attr('id');
Where this id comes from in your code ?
Passing it as JSON often gets the results I'm looking for. The server will interpret the JSON object as POST variables:
$.ajax({
url: "index.php",
type: "POST",
data: JSON.stringify({phpEventId: eventID}),
contentType: "application/json; charset=utf-8",
success: function (result) {
console.log(result);
}
});

GET var from php to use in javascript function

i want to get a var from a php script and use it in a function .. so if i call the var simply with $.get (and document.write) i got an result but how can i integrate this into a function ?
$.get( 'http://www.domain.de/content/entwicklung/verdienst.php', function(verdienst_php) {
//document.write(verdienst_php);
});
function sendview () {
var datastring = {uid : uid_clear, verdienst : verdienst_php};
$.ajax({
type: 'POST',
url: 'http://www.domain.de/content/entwicklung/view_succeed.php',
data: datastring,
});
}
only put the function into the $.get part didnt work
if i didnt use $.get and write in datastring like
verdienst: 1000
it works
any suggestions ?
kind regards Dave
Assuming you are returning exactly what you want from the server, store it in a variable and reference the variable in the other Ajax call.
var verdienst_php;
$.get( 'http://www.domain.de/content/entwicklung/verdienst.php',
function(response) {
verdienst_php = response;
});
function sendview () {
var datastring = {uid : uid_clear, verdienst : verdienst_php};
$.ajax({
type: 'POST',
url: 'http://www.domain.de/content/entwicklung/view_succeed.php',
data: datastring,
});
}
If you want the GET call to happen when the click happens, than you just need to put the post code inside of the GET success callback.
You have to make an extra ajax call to get php variable, you can do it this way :-
function sendview () {
var datastring = {uid : uid_clear, verdienst : getPHPVar('verdienst_php')};
$.ajax({
type: 'POST',
url: 'http://www.domain.de/content/entwicklung/view_succeed.php',
data: datastring,
});
}
function getPHPVar(varname){
var returnValue = null;
$.ajax({
url: 'yourphpurl.php',
async: false,
type: 'post',
data:{
task:'getvar',
varname: varname
},
success: function(response){
returnValue = response;
}
});
return returnValue;
}
and in PHP it will look like:
<?php
if($_POST['task'] == 'getvar'){
echo $$_POST['varname'];
}
Also, I think it's actually not needed cause you are getting php variable using ajax, and again using it in another ajax call. so Why don't you just do it in php ?

Can AJAX update a button argument?

Using AJAX, I'm able to extract a data value from a button click, but is it possible to ensure this value is passed on to an argument within another button on the same page?
test.html:
Activate
Fader
test.js:
function image_check() {
var request = $.ajax({
url: "current_image.php",
type: "GET",
dataType: "html",
success: function(data) {
alert(data);
}
});
}
The php file connects to the database and extracts the most recent image number - it works fine and the alert box displays the correct value. So what would be the next step to ensure the "image_number" argument is updated with this 'data' value?
Cheers.
make a global variable like
windows.image_number = 0;
for AJAX function.
function image_check() {
var request = $.ajax({
url: "current_image.php",
type: "GET",
dataType: "html",
success: function(data) {
//update the global variable
windows.image_number = data;
}
});
}
Assuming that the image_number variable that you are passing to the function is a globally defined variable, you simply need to set the variable in your success callback:
function image_check() {
var request = $.ajax({
url: "current_image.php",
type: "GET",
dataType: "html",
success: function(data) {
alert(data);
// Assuming data holds the image number you want to use for next click
image_number = data;
}
});
}

Ajax post with on()

$('body').on('click','.removebet i',function(e){
var a = $(this).attr("id");
var data = "a="+a;
$.ajax({
type: "POST",
url: "yorumcikar.php",
data: data,
success: function(e){
});
I'll explain the problem. I can post AJAX form with this function and there's no problem except the .removebet i comes from the ajax.
If I append .removebet i with AJAX this function doesn't work because it doesn't call AJAX.
example:
$(".maindiv").html("<span class='removebet'><i>Yes</i></span>");
Then when I clicked to 'i' tag the function at top doesn't work.
I believe this should work.
$('.removebet > i').click(function(event){
var a = $(this).attr("id");
alert(a);
$.ajax({
type: "POST",
url: "yorumcikar.php",
data: data,
success: function(retval){
alert(retval);
}
});
});
EDIT
This will work, however each newly added item will not be bound as the binding has already happened. In order to get newly added items to be bound as well you will have to rebind them when they are added.
$.ajax({call to get your new item},
success: function(data){
// add to dom
bindElement(newElement);
}
});
function bindElement(element){
$(element).click(function(event){
var a = $(this).attr("id");
alert(a);
$.ajax({
type: "POST",
url: "yorumcikar.php",
data: data,
success: function(retval){
alert(retval);
}
});
});
}

how to load global variables from ajax get with promisses

I am getting data to global variables in the most dummy way. At the moment:
var tranlationJson =
$.ajax({
type: "GET",
url: "translation.xml",
contentType: "text/xml",
dataType: "xml",
success: function (dataSource) {
tranlationJson=ToJasonParser(dataSource);
}
});
And i want to modify it to use promisses. The issue is that the code which follows is using third party js files so my code is like
<script
<script
var tranlationJson = $.ajax({ ...
<script 111
<script 222
and script 111 and 222 contain custom libraties which will be using the translationJson in it. So how can i ensure that the translationJson will be filled before loading the scripts?
There is global variable that you can reach from any of your scripts: window. Instead of your var translationJson = $.ajax({... you can do window.translationJson = $.ajax({.... But there are two important things here:
First is you don't know what will come first: ajax request finished or some of your script already ask for your variable. The solution is to bind all depending of your variable scripts running to $.ajax({ success: callback. Like this:
$.ajax({
type: "GET",
url: "translation.xml",
contentType: "text/xml",
dataType: "xml",
success: function (dataSource) {
tranlationJson=ToJasonParser(dataSource);
someScriptRun(); /* here you run some depending on your variable script */
}
});
Another way is to check for variable in all of dependant scripts like this:
var periodicalAttemptToRunScriptDependant = setInterval( function(){
if( 'object' == typeof window.translationJson ){
someScriptRun(); /* here you run some depending on your variable script */
clearInterval( periodicalAttemptToRunScriptDependant );
}
}, 1000 );
Second: in your example any request for a variable will cause ajax request, because it is not a variable actually but function. Try to change your code to:
var tranlationJson;
$.ajax({
type: "GET",
url: "translation.xml",
contentType: "text/xml",
dataType: "xml",
success: function (dataSource) {
tranlationJson = ToJasonParser(dataSource);
}
});

Categories