last day (14 days later) » 

12:50 PM
0
A: Fetch from MySQL with AJAX

Alex TartanFirst of all, to pass that extra parameter, update data: "", to data: { paramName: $("#idOfField").val() }, Secondly, as Jay Blanchard mentioned, switch to PDO $db = new PDO('mysql:host=localhost;dbname=testdb;charset=utf8', 'username', 'password'); $stmt = $db->prepare("SELECT * FROM p...

 
Ok, I've changed to PDO.
 
@9focuspoints Do you need anymore help?
 
I'm sorry but I can't get it to work. I updated the code in the original post to what I've got now.
 
Is $rows empty? Is there any error? Can you paste a print_r($rows)?
 
It says that it can't find the variable.
 
12:50 PM
right below $rows = $stmt->fetchAll(PDO::FERTCH_ASSOC); add a print_r($rows);
 
Done
 
ok
what is the output?
 
It also says that it can't find the variable post
I don't see any output.
Maybe it's better if you try it yourself, here's the url: axelboberg.se/olika_filer/wapp/app_AJAX/index.php
 
change to
method: "POST", in your ajax call
 
Ok, done
 
12:53 PM
$('.login_bttn').click(function() {
myApp.closeModal(loginScreen);
} is missing a closing )
$('.login_bttn').click(function() {
myApp.closeModal(loginScreen);
});
 
I don't know why, but when clicking the button the whole page reloads. I can't find any function that triggers it on the page.
You can use avslutningsfest15 as party id
 
url: 'api.php' ? are you sure? it should also point to the function
 
api.php is the file that connects to the db and it's in the same directory as index.php. The url is correct
 
can you add an alert("whatever") after $('#partyTitle').append(""+pNAME+"");
it will at least stop the redirect and give some time to see the page (just for debuging reasons)
 
Ok, done
 
1:00 PM
the api.php is giving a 500 internal server error
can you access the logs?
 
Which logs?
I'm very new to this.
 
how are you hosting the app?
 
I'm using a web hotel, one.co
com*
 
can you paste the api.php?
hopefully we can see the error without any logs :)
 
<?php

$db = new PDO('mysql:host=xxx.mysql;dbname=xxx;charset=utf8', 'xxx', 'xxx');

$partyInput = mysql_real_input_escape_string($_POST['paramName']);

$stmt = $db->prepare("SELECT * FROM playr_partyID_db WHERE partyID = $partyInput");

$stmt->execute(array($_POST['paramName']));

$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
print_r($rows);

?>
I removed the connection info.. Just in case.
 
1:03 PM
if you're doing partyID = $partyInput" there's no point in $stmt->execute(array($_POST['paramName']));
change it to $stmt->execute();
 
Ok
Maybe I should just stick with the working but not very good php solution..
 
ok.... give it a try...
 
I changed it
(to $stmt->execute();)
 
your ajax call is also not tied to the click on the button
give your button an id="something"
 
Ok, it's now got the id "patron"
 
1:07 PM
and put $("$buttonId).click(function(){}}
 
No! Partyon
 
$.ajax({
url: 'api.php',
data: {
paramName: $("#partyIDInput").val()
},
method: "POST",
dataType: 'json', //data format
success: function(data) //on recieve of reply
{
var id = data[0]; //get id
var pID = data[1]; //get name
var pLOC = data[2]; //get name
var pNAME = data[3]; //get name
var pFORMID = data[5]; //get name
var pFORMSONG = data[6]; //get name
var pFORMARTIST = data[7]; //get name
var pFORMNAME = data[8]; //get name
sorry... typo..
$("$buttonId).click(function(){
add that ajax call here
}); // close the function
 
Like this? $("#partyon").click(function(){
$.ajax({
url: 'api.php',
data: {
paramName: $("#partyIDInput").val()
},
method: "POST",
dataType: 'json', //data format
success: function(data) //on recieve of reply
{
var id = data[0]; //get id
var pID = data[1]; //get name
var pLOC = data[2]; //get name
var pNAME = data[3]; //get name
var pFORMID = data[5]; //get name
var pFORMSONG = data[6]; //get name
var pFORMARTIST = data[7]; //get name
 
yeah...
or even simpler: change $(function () to $("#partyon").click(function(){
 
still 500 internal error..
That's what I did
 
What?
That's outside my knowledge.
 
in your ajax call, there is a url: 'api',
 
replace it with url: 'http://www.axelboberg.se/olika_filer/wapp/app_AJAX/api.php',
 
Ok, done
 
1:14 PM
now change type="submit" from the button to type="button"
it will look the same only it won't reload the page
 
done
 
this is what was causing the page reload
 
Ah, I see! I should have known that.
 
and /> instead of ></input>
 
Done
 
1:17 PM
hold on... now it's not clickable :(
 
Hmm.
It is, check the console while clicking
 
my bad... yeah... now for the api.php page...
 
The login modal should disappear when clicking the button..
I'm using framework7 btw, if that's any help.
 
where are you hiding the modal?
 
It's one of framework7's core functionalities. The button has got the class .close-login-screen
 
1:22 PM
add this in api.php
error_reporting(E_ALL);
ini_set("display_errors", 1);
at the top
 
Done
 
just take this out mysql_real_input_escape_string()
 
Ok, I thought I had already removed it, sorry
 
ok... so no more 500 error
but using avslutningsfest15 prints an empty array
 
Let me check the db again
 
1:26 PM
are you currently using this in api.php? $stmt = $db->prepare("SELECT * FROM playr_partyID_db WHERE partyID = $partyInput");
if so, put single quotes around $partyInput
=' $partyInput'
 
Done, and avslutningsfest15 is correct
 
working now...
instead of print_r, do this:
echo json_encode($rows[0]);
if you just need the first result
i'm guessing id's are unique...
 
No, I need the whole row where the partyID is the input
 
i know... but the whole row in not $rows, it's $rows[0]
as in, the first row fetched from mysql...
 
oh ok
I changed it
 
1:30 PM
ok... so now it appears to wotk
i saw the alert :)
now let's hide that modal..
 
Me too, but try to hide the modal manually, I still don't get the party name to appear right
 
what's the modal's id?
 
It has not got any id but it has got a class, login-screen
 
well, you can just add this instead of the alert:
$(".login-screen").hide()
since you don't need it anymoew
 
Then I don't get the fancy animations, but that's not necessary now. I can work on that later.
 
1:35 PM
instead of data[0]
try data.partyName
there's no data[0]
this is the output from api.php
 
data[3] is the name
 
so
data.id = 1
 
IT WORKS!
 
happy to help out
:D
 
But only for that party, try using party id hovdisco15 instead
 
1:38 PM
{"id":"2","partyID":"HOVDISCO15","partyLoc":"Hovsl\u00e4ttssskolan","partyName":‌​"Disco","partyURL":"","partyFormID":"19WfiPEqm2Ec5zukMUKmZrAQW_YxOQMJc1vWb_RyWikI‌​","partyFormSong":"508625382","partyFormArtist":"646926930","partyFormName":"1730‌​715497"}
it works...
what;s the issue?
 
But the name isn't displayed at the top..
 
is says Disco
 
Ah, now it does. Sorry! And Thank you so much!
 
no problem
happy to help
 
One more thing though, if you can help me..
 
1:40 PM
go ahead
 
If I want to take the partyFormSong result for example and put it into the entry and name properties of this: <input type="text" name="entry.HERE" value="" class="ss-q-short" id="entry_AND HERE" dir="auto" aria-label="Artist " title="" required>
 
give me an example of how that <input> should look
with values
 
<input type="text" name="entry.508625382" value="" class="ss-q-short" id="entry_508625382" dir="auto" aria-label="Artist " title="" required>
It's much easier with php..
 
well, first you need to select the element (just this one)
so... i'd suggest a unique class name for it...
 
Ok
like artistInput
 
1:46 PM
then do $(".className").attr('name', 'entry_' + data.partyFormSong);
yeah, that should work
same for id
$(".artistInput").attr('id', 'entry.' + data.partyFormSong);
 
I don't think the id is necessary
 
leave it out, then :)
 
The name property needs a dot right after name and the entry needs an underscore, this would work, right? $(".artistInput").attr('entry_' + data.partyFormSong);
$(".artistInput").attr('name.' + data.partyFormSong);
 
yup
but i don't see a entry_ attribute
are you sure about it?
 
Yes
Oh, it's the id!
 
1:50 PM
exactly
 
I really screwed the properties up now.
 
    $(".artistInput").attr('entry_' + data.partyFormSong);
    $(".artistInput").attr('name.' + data.partyFormSong);
should be
    $(".artistInput").attr('id','entry_' + data.partyFormSong);
    $(".artistInput").attr('name', 'entry.' + data.partyFormSong);
first the attribute, then the value :)
 
Oh, you've learned me many things today! :)
 
can you update your question on stackoverflow now?
 
I'll do that in a minute, I'm just going to duplicate the code for all inputs.
The input thing doesn't seem to work
 
2:01 PM
what input thing?
 
I want the form id to apply to the action attribute on the form just like this inputs:
    $(".songWish").attr('action', 'https://docs.google.com/forms/d/' + data.partyFormID + '/formResponse');
Oh, I got it to work. Sorry. And once again, thanks!
 
no problem :)
 

last day (14 days later) »