PhoneGap récupérer données BD Wamp

**maxusn** · 07/11/2012, 10h27

Bonjour,

je développe une application Andoid à l'aide de Phonegap.
Je cherche un moyen d'acceder aux infos stockées dans ma base , créee avec wamp. Avant Phonegap, j'y arrivais avec du PHP mais il semblerais que ce ne sois pas possible avec phonegap.

Je souhaiterais afficher tout ce que contient ma base dans une liste, mais sans utiliser de php je ne vois pas comment faire.

j'ai reussis a ajouter des elements a ma base en faisant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div data-role="content">		
                <form action="http://srv/phonegap/traitForm.php" method="post">
                    <fieldset data-role="fieldcontain">
						<p>
                            <label for="titre" >Titre :</label>
                            <input type="text" name="titre" id="titre" required/>
                        </p>
						<p>
							<label for="avec" >Avec :</label>
							<input type="text" name="avec" id="avec" required/> 
                        </p>
                        <p>
							<input type="submit" id="valide" value="Valider" data-theme="b" data-inline="true" />
							<input type="reset" value="Reinitialiser" data-theme="b" data-inline="true"/>
                        </p>
                    </fieldset>
                </form>				
			</div>

et avec coté serveur un php :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
	try
		{
			$bdd = new PDO('mysql:host=localhost;dbname=rendezvous', 'root', '');							
		}
		catch (Exception $e)
		{
			die('Erreur : ' . $e->getMessage());
		}
 
 
		$req = $bdd->prepare('INSERT INTO reunion(titre,avec) VALUES (:titre,:avec)');
		$req->execute(array(
			'titre' => $_POST['titre'],
			'avec' => $_POST['avec']
		));

mais je ne vois pas trop comment récupérer toutes ces données pour les afficher dans mon appli.

Une idée ?

Merci.

**grunk** · 07/11/2012, 15h47

Tu as d'un coté ton appli avec phonegap.
De l'autre ton serveur mysql avec ton script php.

Dans ton appli phonegap tu dois appeler ce script, par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#moncontainer').load('http://serveur.com/script.php');

Que ce soit via phonegap ou dans une appli native tu ne peux pas te connecter à une base distante directement. Tu dois forcément passer par un script qui fait office de proxy.

**maxusn** · 07/11/2012, 18h35

Ok merci. Je vais donc pouvoir appeler mon script pour parcourir ma BD.
Par contre comment je peux envoyer les résultats de mes requêtes a mon ampli phonegap ?

**maxusn** · 08/11/2012, 09h57

Bonjour,
j'ai donc réussis a afficher ma liste de données, mais ma liste n'a pas le style jQuery mobile que j'utilise pourtant dans mon application.
j'ai pourtant ajouter a mon script php le code permettant d'inclure jQuery mobile.

Est ce normale ?

mon code html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<head>
    <title>PhoneGap</title>
    	script type="text/javascript" charset="utf-8" src="cordova-2.2.0.js"></script>	
		 link rel="stylesheet" href="css/jquery.mobile-1.2.0.min.css" />
		script src="jquery.js"></script>
		script src="jquery.mobile-1.2.0.min.js"></script>
 
		script type="text/javascript">
			$('#employeeListPage').load('http://serv/phonegap/getList.php');
		</script>
  </head>
 
  <body>
		<div data-role="page">
 
			<div data-role="header" data-theme="c">
				<h1>Liste</h1>
			</div>
 
			<div data-role="content">
 
				<div id="employeeListPage">
				</div>
 
			</div>
 
			<div data-role="footer" data-theme="c">
				<div data-role="navbar">
 
					<ul>
						<li><a href="" class="ui-btn-active" data-icon = "grid" >Liste des rendez-vous</a></li>
						<li><a href="index.html"  data-icon = "Add" > Ajout d'un rendez-vous</a></li>
					</ul>
 
				</div>				
			</div>
 
		</div>
 
	</body>

et mon code php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
	<head>
		meta charset="utf-8">
		meta name="viewport" content="width=device-width, initial-scale=1">
		link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
		script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
		script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
 
	</head>
 
 
		<?php
			$bdd = new PDO('mysql:host=localhost;dbname=rendezvous', 'root', '');	
			$reponse = $bdd->query("SELECT * FROM reunion ORDER BY `reunion`.`titre` ASC");
 
			echo "<ul data-role='listview' data-filter='true' data-filter-placeholder='Rechercher...' data-inset='true' id='mylist'>";	
 
			while ($donnees = $reponse->fetch())
			{
				echo "<li><a href='#' >".$donnees['titre']."</a> </li>";
			}
 
			$reponse->closeCursor();							
 
			echo "</ul>";							
		?>

ps : je n'ai pas oublier les "<" qu'il manque mais si je les laisse j'ai une erreur :

Request denied by WatchGuard Firewall

**grunk** · 08/11/2012, 10h47

Ton script php n'a pas besoin de jquerymobile. Même pas besoin d'entête HTML.

Ton script php pourrais se limiter à :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$bdd = new PDO('mysql:host=localhost;dbname=rendezvous', 'root', '');	
			$reponse = $bdd->query("SELECT * FROM reunion ORDER BY `reunion`.`titre` ASC");
echo json_encode($reponse->fetchAll());

L'idée est d'envoyer les données brute de la bdd via JSON et de les traiter ensuite dans ton appli.

Sinon en gardant ton fonctionnement actuel , ton script php à juste besoin d'être :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
			$bdd = new PDO('mysql:host=localhost;dbname=rendezvous', 'root', '');	
			$reponse = $bdd->query("SELECT * FROM reunion ORDER BY `reunion`.`titre` ASC");
 
			echo "<ul data-role='listview' data-filter='true' data-filter-placeholder='Rechercher...' data-inset='true' id='mylist'>";	
 
			while ($donnees = $reponse->fetch())
			{
				echo "<li><a href='#' >".$donnees['titre']."</a> </li>";
			}
 
			$reponse->closeCursor();							
 
			echo "</ul>";							
		?>

Rien de plus.

Pour faire simple ton script à juste besoin de renvoyer le balisage que ton appli interprétera avec les styles qu'elle embarque.

**maxusn** · 08/11/2012, 10h49

Merci, je vais regarder ca.

edit : je suis désolé j'ai vraiment beaucoup de mal :

en utilisant le Json voila a quoi ressemble les données que je récupère.

{"titre":"","0":"","avec":"","1":"","email":"","2":"","telephone":"","3":"","date":"","4":"","lieu":"ert","5":"ert","commentaire":"","6":""}

Quand mon javascript s’exécute, j’obtiens une erreur dans la console :

Uncaught SynthaxError : Unexpected token > at http://serv/phonegap/getList.php

et mon appli passe dans la fonction error du javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<script type="text/javascript">
				var output = $('#employeeListPage');
					$.ajax({
								/* URL vers le fichier JSON */
								url: 'serv/phonegap/getList.php',
								dataType: 'jsonp',
								jsonp: 'jsoncallback',
								timeout: 5000,
								success: function(data, status){
 
									$.each(data, function(i,item){
									var person = 
									'<li>' +
									'<h4>' + item.titre + '</h4>' 
									'</li>';
 
										output.append(person);
									});
 
								},
								error: function(){
								   output.text('There was an error loading the data.');
								}
							});
				</script>

PhoneGap récupérer données BD Wamp

Android

Discussions similaires

Partager

Partager