jQuery AjaxUpload, devez cliquer deux fois sur le bouton?

Question

J'utilise le plugin AjaxUpload avec jQuery, et tout fonctionne correctement pour la plupart, mais je dois cliquer deux fois sur mon bouton pour l'exécuter. Je devine que c'est une question de portée ... ou encore à apprendre ...

Voici mon code (?):

$(".upload-button").live("click", function(event) { 
     event.preventDefault(); 
     var currentId = $(this).closest("div").attr("id").replace("slide-", ""); 
     new AjaxUpload($(this), { 
     action: "./php/upload.php", 
     name: 'userfile', 
     autoSubmit: true, 
     onSubmit: function(file , ext) { 
     }, 
     onComplete: function(file, response) { 
     // enable upload button 
     // this.enable(); 
     $("#slide-" + currentId).find(".movie-image").attr("src", baseImgPath + file); 
     $("#mImg" + currentId).val(file); 
     } 
    }); 

Toutes les idées sont appréciés. :)

Answer 1

essayez ceci:

var $button = $(".upload-button"); 
    new AjaxUpload($button, { 
     action: "./php/upload.php", 
     name: 'userfile', 
     autoSubmit: true, 
     onSubmit: function(file , ext) { 
     }, 
     onComplete: function(file, response) { 
     // enable upload button 
     // this.enable(); 
     var currentId = $(this).closest("div").attr("id").replace("slide-", ""); 
     $("#slide-" + currentId).find(".movie-image").attr("src", baseImgPath + file); 
     $("#mImg" + currentId).val(file); 
     } 
    }); 

Answer 2

Got ça a marché - voici comment pour quelqu'un d'autre qui pourrait être d'avoir un problème similaire ...

Le principal problème était que ces boutons ont été créés dynamiquement, et AjaxUpload ne sera pas initialement lié dans l'appel .live(), d'où le "cliquer, déplacer, cliquer à nouveau, déclencher". En appelant AjaxUpload (enveloppé dans sa propre fonction, comme ci-dessous), dans ma boucle lorsque les boutons sont créés, ils sont initialement liés et fonctionnent correctement.

La ligne utilisée dans la boucle:

makeUpButton(("#upload-button-" + slideCount), slideCount); 

L'appel AjaxUpload:

function makeUpButton(theButton, theId) { 
    new AjaxUpload(theButton, { 
     action: "./php/upload.php", 
     name: 'userfile', 
     autoSubmit: true, 
     onSubmit: function(file , ext) { 
      this.disable(); 
     }, 
     onComplete: function(file, response) { 
      this.enable(); 
      $("#slide-" + theId).find(".movie-image").attr("src", baseImgPath + file); 
      $("#mImg" + theId).val(file); 
     }  
    }); 
} 

Hope this helps quelqu'un, je sais que ça me rend dingue pendant quelques jours. ;) Cheers.

Answer 3

Essayez ceci:

$(".upload-button").live("hover", function(event) { 

    var currentId = $(this).closest("div").attr("id").replace("slide-", ""); 
    new AjaxUpload($(this), { 
    action: "./php/upload.php", 
    name: 'userfile', 
    autoSubmit: true, 
    onSubmit: function(file , ext) { 
     //onsubmit code here.. 
    }, 
    onComplete: function(file, response) { 
     // oncomplete code here 
    } 
    }); 
    $(this).trigger('click'); 

});

Mine travaillant mais je ne suis pas vraiment sûr comment cela fonctionne. Le « vol stationnaire » (au lieu de « clic ») créera un nouveau AjaxUpload (cela empêchera de cliquer deux fois)

Answer 4

<script type="text/javascript"> 

$(document).ready(function() { 
     $('#yourlinkorbutton').click(function(){ 

       new AjaxUpload('#yourlinkorbutton'),{ 

        .... 

       }); 
    }); 

    $('#yourlinkorbutton').trigger.click(); 
    $('#yourlinkorbutton').trigger.click(); 
}); 

que vous obtiendrez en deux clics lorsque la page se charge. un clic à partir de là.

Answer 5

Si vous créez un bouton dynamique, vous devez créer un AjaxUpload en utilisant un identifiant pour chaque bouton, essayez ceci:

// to add new button                                 
$("#add_sector").click(function() { 
    var ID = [Generate a new ID]; 
    var button = '<a href="javascript:;" id="' + ID + '" class="subir_imagen"><img src="images/icon_subir32.png"></a>'; 


    $('#cont_img_catalogo').append(button); 

    //create Ajax                                  
    new AjaxUpload($('#' + ID),{ 
     action: 'procesar_imagen.php', 
      name: 'image', 
      onSubmit : function(file, ext){ 
      // desabilitar el boton                              
      this.disable(); 
      ... 
      }, 
      onComplete: function(file, response){ 
      // Habilitar boton otra vez                             
      this.enable(); 

      ... 

      } 
     }); 



    }); 

Pour supprimer le bouton Utilisation:

$('#' + ID).fadeOut("slow", function() { $('#' + ID).remove(); }); 

si vous utilisez img , vous devez la classe

a, a:visited{ 
display: block; 
float: left; 
text-decoration:none;} 

Answer 6

si vous en utilisant le contrôle dynamique, ce temps, nous sommes confrontés à problème dans cliquer deux fois, j'ai résolu que cela fonctionne pour moi. i a passer deux jours et résoudre ce s'il vous plaît vérifier ci-dessous les étapes: =

Ajouter une fonction de charge java script en php boucle pour chaque en utilisant ci-dessous

<?php 
for ($i=1; $i<=5; $i++) 
    { 
?> 
<script> 
$(window).load(function() 
     { 
     uploadphoto(<?php echo $i; ?>)     
      }); 
</script> 
<a href="javascript:void(0)" id="photo<?php echo $i; ?>" onclick="uploadphoto(<?php echo $i; ?>)" style="color: #666;"> Upload </a> 
<?php 

} 
?> 

et votre fichier javascript vous pouvez obtenir id dynamique de la boucle php

function uploadphoto(id) 
{ 

new AjaxUpload('#photo'+id, { 

, vous pouvez passer ID dynamique dessus de la ligne de l'échantillon, c'est tout :) heureux de codage