IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

rafraichir une div après requete post


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 044
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 044
    Par défaut rafraichir une div après requete post
    Bonjour, je ne sais pas comment expliquer mon petit problème.
    En faites je fais un upload d'une image avec une requête de type post.
    Jusque la pas de probléme....
    Seulement l'image ne change pas (logique) et je suis obliger de recharger la page pour voir la modification.
    Je me demande comment faire pour recharger la div qui contient mon image ou un équivalent propre avec rechargement de la page courante
    Bref vos conseils sont précieux

  2. #2
    Invité
    Invité(e)
    Par défaut
    salut,

    lorsque tu as fait ton upload dimage qui est jimagine dans un iframe ou qqch dautre.
    Dans cet iframe, il faut que tu genere l'image avec un nom style
    <img src="monImage.jpg?10003409094" alt=""/>

    Ca a pour but de faire charger la nouvelle image au navigateur.

  3. #3
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 044
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 044
    Par défaut
    je n'utilise pas d'iframe pour l'envoi d'image, un formulaire plutôt classique avec l'image juste en dessous.
    Pensez vous que je doivent faire une requête get ou un load pour charger cette image et lors de l'envoi refaire une requête ?

  4. #4
    Rédacteur
    Avatar de marcha
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2003
    Messages
    1 571
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : Suisse

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2003
    Messages : 1 571
    Par défaut
    Salut,

    J'ai de la peine à saisir la technique que tu utilises pour uploader ton image, tu peux
    donner un peu de code ?

  5. #5
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 044
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 43
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 044
    Par défaut
    Pour le moment, je recharge la page après envoi :
    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
     
    function updateProgress() {
    	  var progress;
    	  progress = $("#progressbar")
    	    .progressbar("option","value");
    	  if (progress <= 100) {
    	      $("#progressbar")
    	        .progressbar("option", "value", progress + 1);
    	      $("#progressText").text(progress+"%");
    	      setTimeout(updateProgress, 100);
    	  }
    	  if(progress>=100){
    		  location.reload();
    	  }
    	  return false;
    	}
    		$('<div class="filesystem"></div>').insertAfter('span.photo');
    		$('.filesystem').empty();
    		$(':checkbox#addimg').click(function(){
    	 		if(this.checked){
    	 			jQuery('<input type="file" id="photo" name="photo" value="" />').appendTo(".filesystem");
    	 		}else{
    	 			jQuery('.filesystem').empty();
    	 		}
    	 	});
    $('#subimg').click(function(){
    $('#profil-photo').ajaxSubmit({
    			 	url:"http://test.dev",
    			 	type:"post",
    			 	beforeSubmit:function(){
    		 		$("#progressbar").progressbar({ value: 0 });
    			 	setTimeout(updateProgress, 100);
    			 	}
    			});
    })
    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
    <form class="forms-profil" method="post" action="" enctype="multipart/form-data" id="profil-photo">
    	<fieldset>
    		<table>
    		<tr>
    			<td class="label"><label for="addimg">Photo :</label></td>
    		</tr>
    		<tr>
    			<td>
    			<table>
    				<tr>
    					<td style="width:400px;">
    						<div id="progressbar"></div>
    					 	<div id="progressText"></div>
    					 </td>
    				</tr>
    			</table>
    			<table>
    				<tr>
    					<td style="width:250px;">
    						<input type="hidden" name="MAX_FILE_SIZE" value="1048576" />
    				 		<input type="checkbox" name="addimg" id="addimg" value="" />&nbsp;<span class="photo">Envoyer une Photo</span>
    				 	</td>
    				 	<td>&nbsp;</td>
    				 	<td style="width:250px;" class="errorInput"></td>
    			 	</tr>
    			 	<tr>
    			 	<td><input type="submit" name="saddimg" class="ud-button ui-state-default ui-corner-all" value="envoyer" id="subimg" /></td>
    			 	</tr>
    		 	</table>
    			</td>
    		</tr>
    		<tr>
    			<td class="status"></td>
    		</tr>
    		<tr>
    			<td valign="top">
    				<img style="margin:4px 0 0 5px;" src="/monimage.gif" width="" height="" alt="photo" />
    			</td>
    			<td style="width:100px;"></td>
    		</tr>
    	</table>
    	</fieldset>
    	</form>
    C'est en gros quoi mais recharger l'image
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <img style="margin:4px 0 0 5px;" src="/monimage.gif" width="" height="" alt="photo" />
    pour remplacer le src me semble peut être une bonne idée cela m'éviterai de recharger toute la page comme indiquer dans la fonction updateProgress

  6. #6
    Rédacteur
    Avatar de marcha
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2003
    Messages
    1 571
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : Suisse

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2003
    Messages : 1 571
    Par défaut
    Salut,

    Je n'ai encore jamais trouvé de solution d'upload qui n'utilise pas la technique
    du ciblage du formulaire dans un iframe (a pars avec des plugins tel que flash
    ou java)

    Est-tu bien sur de ce que tu es en train de faire ?

Discussions similaires

  1. Rafraichir une div après suppression
    Par spawns dans le forum jQuery
    Réponses: 2
    Dernier message: 15/09/2014, 23h28
  2. [1.x] Rafraichir une div après une requête ajax
    Par phpestpuissant dans le forum Symfony
    Réponses: 2
    Dernier message: 02/10/2012, 09h25
  3. rafraichir une div en ajax
    Par devmassi dans le forum Ruby on Rails
    Réponses: 1
    Dernier message: 22/02/2008, 16h10
  4. [MooTools] Recharger une div apres affiche d'une modale box
    Par alas70 dans le forum Bibliothèques & Frameworks
    Réponses: 1
    Dernier message: 30/11/2007, 17h18
  5. [AJAX] rafraichir une div !
    Par omantherasta dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 24/12/2006, 17h35

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo