Question de Noob, Sencha et Wamp (MYSQL, PHP)

**bil_home** · 09/12/2013, 00h36

Bonjour je suis entrain de réaliser une appli et j'ai besoin d'une aide.
voila au début j'ai travailler sur WAMP avec une base de données mysql et un du php-html pour le site.
mais voila maintenant je me suis mis sur sencha pour mon appli.

je voudrais savoir comment on peut faire communiquer l'appli sencha et la base mysql. auparavant je le faisais avec le php :
j'avis des champs libre, je les remplissais et après en appyant sur un bouton la valeur des champs me permettait de remplir une entrée dans ma base.

comment faire la même avec sencha ?

merci

**sekaijin** · 09/12/2013, 15h50

pareil

sencha ne change que la partie cliente

tu fais donc du php sur ton serveur pour l'accès à la base.

lis cette discu
suis les tutos et tu devrais arriver à mettre tes données en base
http://www.developpez.net/forums/d13...store-serveur/

A+JYT

**bil_home** · 10/12/2013, 20h46

voici mon code dans le main.js

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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
Ext.define('realife.view.Main', {
    extend: 'Ext.tab.Panel',
    xtype: 'main',
    requires: [
        'Ext.TitleBar',
        'Ext.Video',
		'Ext.Container',
        'Ext.Button',
        'Ext.Toolbar',
        'Ext.data.JsonP',
        'Ext.Ajax',
        'Ext.XTemplate',
		'Ext.form.Panel',
    ],
    config: {
        tabBarPosition: 'top',
 
        items: [
            {
                title: 'Welcome',
                iconCls: 'home',
 
 
                styleHtmlContent: true,
                scrollable: true,
 
                items: {
                    docked: 'top',
                    xtype: 'titlebar',
                    title: 'Welcome to Real Life'
                },
 
				items: [{
						xtype: 'textfield',
						name: 'name',
						fieldLabel: 'Name',
						id:'nam',
						allowBlank: false ,// requires a non-empty value
 
					}, {
						xtype: 'textfield',
						name: 'mdp',
						fieldLabel: 'Mot de passe',
						id: 'mdp',
						//vtype: 'email' // requires value to be a valid email address format
					},{
 
						xtype: 'button',
						name: 'submit',
						text: 'submit',
						handler: function () {
						 var nam = Ext.ComponentQuery.query('#nam')[0].getValue();
						 var mdp = Ext.ComponentQuery.query('#mdp')[0].getValue();
						 //Ext.Msg.alert('ah', 'name: ' + nam + ' mail: ' + mdp);
        // ici je n'arrive pas a mettre une fonction ext.ajax                
}	},],},	 ],}}
 
);

et le php

Code php :

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
<?php
include("connection.php");
 
$pseudo=$_POST['pseudo'];
$mdp=$_POST['mdp'];
 
$logvalid= "select Id_People, mdp from Compte where Id_People='$pseudo' AND mdp='$mdp' AND DATE(now()) ";
 
$req = mysql_query($logvalid) or die("erreur");
 
if($data = mysql_fetch_assoc($req)) 
    { 
 
	echo ($data['Id_People']);    
    } 
else {echo 'erreur';}
 
?>

je n'arrive pas a utiliser ext.ajax

**sekaijin** · 13/12/2013, 11h11

Lit bien la discussion que j'ai donnée.
et le tuto
le tuto explique comment ExtJS échange ses données avec le serveur

et la discus explique ce que doit faire le serveur pour être compris d'extjs
echo ($data['Id_People']);affiche un id dans le flux http ça n'a aucun sens pour quelque application que ce soit.
Il n'y a pas de magie dans l'informatique. aucune technologie ne peut comprend quoi faire d'une simple valeur si on ne le défini pas.

donc avant de bricoler, fais le tuto suis la discu et ensuite si tu as des pb reviens poser une question sur la mise en oeuvre.

ExtJS n'est pas in simple lib comme JQuery ou quelque autre c'est un frameWork

comme tout framework ExtJS te fournis un ensemble d'outil à utiliser d'une certaine façon. d'où son nom de CADRE de travail. en respectant ce cadre les framework t'apporte en contre partie en ensemble de service.
si tu prends les outils d'un framework comme une simple lib tu fais une crois sur ces services.
et tu prends le prends le risque de ne pas avoir quelque chose de fonctionnel.

je dirrais là que ton code ExtJS c'est comme si tu essayait de mettre un moteur de Ford T dans un airbus A300 tout en essayant de piloter la chose en utilisant les technique de borderie de la maison hermes.

bref tu es tellement loin de la façon dont il faut utiliser le framework que je ne peux que te redire
fais le tuto et lis la discu
A+JYT

**bil_home** · 15/12/2013, 21h03

Pas si sur, mon seul problème était juste que j'avais mis POST au lieu de GET !!

voili voilo

**sekaijin** · 16/12/2013, 20h15

ben non ça marche aussi avec POST.

tant mieux si ça marche mais tu est loin du principe d'utilisation de sencha.
je ne comprend pas du tout l'usage de.

Code :

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

Ext.ComponentQuery.query('#nam')[0].getValue();

dans sencha si on l'utilise correctement on ne fait jamais de recherche dans le DOM
normalement le button du formulaire défini une action
c'est le contrôleur qui défini un handler de traitement celui-ci reçoit en paramètre le form et ces donnes

Code :

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

1
2
3
4
5
6
7
8
9
10
11
this.buttons = [
            {
                text: 'Save',
                action: 'save'
            },
            {
                text: 'Cancel',
                scope: this,
                handler: this.close
            }
        ];

et le contrôleur

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
'useredit button[action=save]': {
                click: this.updateUser
            }
updateUser: function(button) {
    var win    = button.up('window'),
        form   = win.down('form'),
        record = form.getRecord(),
        values = form.getValues();
 
    record.set(values);
    win.close();
}

et c'est tout c'est le datastore qui gère l'echange avec le serveur

Je suis très étonné que ça fonctionne avec des echo simple dans le PHP
tu utilise Ext.data.JsonP est JsonP attends des réponse en json.

A+JYT

**bil_home** · 21/12/2013, 16h08

je sais pas trop je me suis lancer comme cela et ça marche donc tan mieux. je suis sur un projet donc tant que ça marche ça ne me pose pas de problème. après #nam me permet de récupérer la valeur d'un formulaire que j'ai fait moi même. j'envoie cette variable vers le php qui communiqua avec ma base.
je ne passe pas par le datastore mais directement via ext.ajax.request et du php qui me permet de faire de faire le lien entre sencha et php.
pas eu besoin de encode decode json...

**sekaijin** · 22/12/2013, 10h25

Ok
je comprends mieux

tu utilise les composant de ExtJS comme on utilise une lib JQuery UI sans utiliser le framework.

Je te conseille lorsque tu auras du temps de mettre en oeuvre le framework tel que le propose ExtJS

tu n'auras alors plus besoin de récupérer toit même les valeur du formulaire no à invoquer un ajax pour les envoyer au serveur
et pas non plus à développer de callback pour traiter la réponse.

la seule contrainte que le serveur réponde en JSON ou en XML

A+JYT

**bil_home** · 23/12/2013, 17h50

je crois que je comprend où tu veux en venir.
en ce moment je suis confronté à un problème pour créer une liste à partir du retour d'une requete dans php.
ma requete ajax me retourne : une donnée par ligne correspondant au pseudo.
je voudrais faire une liste à partir de cette données mais je vois pas comment faire

**sekaijin** · 23/12/2013, 18h15

si tu parle d'une combo ou un menu
effectivement le plus simple est de passer par un data store
tu charge ton datastore avec tes donnée et tu l'associe au menu ou au combo
tu as des examples ici
http://docs.sencha.com/extjs/4.2.2/e...rm/combos.html
l'example Multiple Selection est très simple
il utilise le fichier
http://docs.sencha.com/extjs/4.2.2/e...form/combos.js
dedans tu as une var datas qui contient les données.

il suffit de changer la datastore pour utiliser un proxy json
cet exemple te donne le format de donnée attendu en réponse de l'appel ajax

A+JYT

**bil_home** · 23/12/2013, 19h45

en faite c'est plutot une liste comme celle ci. dans le but de pouvoir faire une action lorsque je sélectionnerais une donnée.
http://try.sencha.com/touch/2.0.1/do...taview.List.1/

et tu as raison je pense qu'il faut que je passe par un store

**sekaijin** · 24/12/2013, 12h26

oui dans sencha touch ou ExtJS
le store est l'outil qui représente le contenu
les composants sont eux des conteneur. le fonctionnement du framework se base sur leur association.

A+JYT

**bil_home** · 25/12/2013, 15h52

je suis confronté à un problème avec Ext.grid.Panel.
j'ai fait un store et une grid panel pour afficher mais j'ai une erreur:
Uncaught TypeError: Cannot read property 'GridPanel' of undefined

je crois qu'il faut que j'ajoute dans "requires" quelque chose mais si j'ajoute dans "requires" 'Ext.grid.Panel' il me met une erreur.
je n'arrive pas trouver sur internet le nom que je dois ajouter dans la "requires".
voici mon code (pris sur internet) que j'ai ajouter dans le handler d'un bouton

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
var store = new Ext.data.JsonStore({
proxy: {
  type: 'ajax',
  url: 'search.php',
},
fields: [
	{name: 'id', type: 'int'},
	'Pseudo', 'Prenom', 'Nom'
										]
});
store.load();
 
var grid = new Ext.grid.GridPanel({
	store: store,
	columns: [	
{id:'id',header: 'ID', width: 30, sortable: true, dataIndex: 'id'},
{header: 'Pseudo', width: 100, sortable: true, dataIndex: 'Pseudo'},
{header: 'Prenom', width: 100, sortable: true, dataIndex: 'Prenom'},
{header: 'Nom', width: 250, sortable: true, dataIndex: 'Nom'}
],
stripeRows: true,
height:250,
width:500,
title:'dbgrid'
});
grid.render('dbgrid');

**bil_home** · 25/12/2013, 20h20

j'ai essayer quelque chose d'autre avec une liste mais rien ne se charge quand j'appuie sur le bouton search

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
41
42
43
{
                title: 'Search',
                iconCls: 'add',
				id: 'search',
				layout: 'fit',
 
 
				items :[
 
					{
 
					xtype: 'list',
						flex: 1,
						ui: 'round',
						docked :'top',
						store: 'mystore',
						itemTpl: '{Pseudo}',
						items: [{
						xtype: 'button',
								text: 'Search',
								handler: function (button, event) {
									var user1= reallife.view.Main.mama;
									var mystore = new Ext.data.JsonStore({
										proxy: {
											type: 'ajax',
											url: 'search.php',
											},
										fields: [
										'Pseudo', 'Prenom', 'Nom'
										]
									});
									mystore.load();
 
									}
 
							},] 
					},
 
 
 
				],
 
			},

**sekaijin** · 26/12/2013, 10h32

de mémoire dans sencha touch le grid s'apelle 'Ext.grid.Grid'

A+JYT

**bil_home** · 04/01/2014, 22h18

est-ce que l'on peut uploader des fichier vidéo de petite taille sur le serveur via ajax ?

**sekaijin** · 05/01/2014, 12h10

on peut uploader n'importe quoi

il faut penser au timeout si les fichiers sont gros
http://www.w3.org/TR/XMLHttpRequest/...eout-attribute
A+JYT

**bil_home** · 09/01/2014, 21h59

ok merci
j'arrive à lancer l'application camera mais le bouton video est grisé.
le code doit être fait pour prendre des photo.
pas moyen de trouver comment faire une video...

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
{
 
							xtype: 'button',
							name: 'submit',
							text: 'submit',
							handler: function(button, event) {
								Ext.device.Camera.capture({
								source: 'camera',
								destination: 'file',
								 success: function(url) {
									//show the newly captured image in a full screen Ext.Img component:
 
								}	
 
								});
							},	
 
					},

**sekaijin** · 10/01/2014, 07h21

il faut lire la doc des plateformes et de sencha
il faut que ton appli soit signée et qu'à l'install elle ait déclaré se servir de la camera. sinon l'os lui interdit l'accès

j'ai jamais fais ça
A+JYT

**bil_home** · 10/01/2014, 11h25

oui j'ai fait le certificat pour generer l'appli et dans le packager on a bien

Code :

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

1
2
3
4
5
6
7
8
9
"permissions":[
            "INTERNET",
            "ACCESS_NETWORK_STATE",
            "CAMERA",
            "VIBRATE",
            "ACCESS_FINE_LOCATION",
            "ACCESS_COARSE_LOCATION",
            "CALL_PHONE"
        ],

Question de Noob, Sencha et Wamp (MYSQL, PHP)

Ext JS / Sencha

Discussions similaires

Partager

Partager