Discussion :

[Invité]

Salut à tous, je suis toujours et toujours en train de réaliser mon application et je vois le bout du tunnel. Il ne me reste 2/3 etapes dont deux où je rencontre de petit soucis au niveau de l'upload. C'est pourça que je viens ici demander de l'aide

Premierement, j'ai réalisé un formulaire d'upload pour uploader une archive et cela fonctionne parfaitement mais en dur malheureusement pas moyen de lui mettre un controleur.

voici le bout de code qui fonctionne :

Code :

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

1
2
3
4
5
6
7
      <form action="/api/upload" method="POST" enctype="multipart/form-data">
                        <div class="fileUpload btnLink">
                            <span>Parcourir</span>
                            <input type="file" id="zipFile" name="zipFile" ng-model="$ctrl.zipFile" class="upload" required>
                        </div>
                        <button type="submit" value="submit"  class="btnLink">Importer</button>
                    </form>

Celui que j'aimerai qui fonctionne :

Code :

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

1
2
3
4
5
6
7
<form ng-submit="$ctrl.save($ctrl.zipFile)">
                        <div class="fileUpload btnLink">
                            <span>Parcourir</span>
                            <input type="file" id="zipFile" name="zipFile" ng-model="$ctrl.zipFile" class="upload" required>
                        </div>
                        <button type="submit" value="submit"  class="btnLink">Importer</button>
                    </form>

son controleur :

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
 $ctrl.save = function (zipFile) {
            if ($ctrl.newTemplate.id == null) {
                $ctrl.newTemplate.id = templateid++;
                $ctrl.templates.push($ctrl.newTemplate);
               console.log(zipFile);
                $http({
                    method: 'POST'
                    , url: '/api/upload'
                    , data: {
                         zip: zipFile
                    }
                });
 
            }
            $ctrl.newTemplate = {};
        }

le soucis est qu'il me renvoie une erreur de ce type :
Cannot red property 'path' undefined. J'ai fais un console au niveau de mon zipfile mais il est vide pourquoi ?

Merci pour votre aide

[Invité]

Voici la solution que j'utilise pour uploader mes fichiers sans module additionnel :

Dans la vue :

Code :

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

1
2
3
4
 
<img src = "{{nouveauMedicament.photo}}" class = "img-responsive" >
<input  class="" type="file" name="file" onchange="angular.element(this).scope().telechargerFichier(this.files)" ></input>// Button qui permet d'uploader
{{infoUpload}}

Dans le controleur de la vue, on écrit cette fonction :

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
 
/* CHARGEMENT D UNE PHOTO SUR LE SERVEUR */
	$scope.telechargerFichier = function(files) {
		var fd = new FormData();
		//Prends le premier fichier selectionné
		fd.append("file", files[0]);
		console.log(files[0].name);
		var uploadUrl = "upload.php";
		$http.post(uploadUrl, fd, {
			withCredentials: true,
			headers: {'Content-Type': undefined },
			transformRequest: angular.identity
		}).success(function(data){ 
				$scope.infoUpload="Fichier téléchargé sur le serveur "; 
				$scope.nouveauMedicament.photo="uploads/"+files[0].name; 
			})
			.error(function(data){
				$scope.infoUpload="Echec du téléchargement sur le serveur";
			});
 
	};

(Dans la fonction call Back de la fonction $http, on affiche la photo uploadée grâce à $scope.nouveauMedicament.photo="uploads/"+files[0].name; (En l'occurence ct un médicament) )

Puis le fichier PHP upload.php qui "dépose" les fichiers sur le serveur, dans le répertoire "uploads" :

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
 
<?php
 
        if ( !empty( $_FILES ) ) {
 
                $tempPath = $_FILES[ 'file' ][ 'tmp_name' ];
                $uploadPath = dirname( __FILE__ ) . DIRECTORY_SEPARATOR . 'uploads' . DIRECTORY_SEPARATOR . $_FILES[ 'file' ][ 'name' ];
 
                move_uploaded_file( $tempPath, $uploadPath );
 
                $answer = array( 'answer' => 'File transfer completed' );
                $json = json_encode( $answer );
 
                echo $json;
 
        } else {
 
                echo 'No files';
 
        }
 
        ?>

Note : I'a pas de sécurité paramétrée

[Invité]

Impeccable ça fonctionne merci pour ton aide !