2010-06-24 5 views
2

J'utilise la fonction iFrame Upload de Ben Nadel pour un outil d'édition sur un site sur lequel je travaille. J'apprends jQuery. La fonction fonctionne magnifiquement. Cela fait partie d'une fenêtre modale réutilisable et tout fonctionne. Mais, je veux dire dynamiquement la fonction d'où vient l'appel afin qu'il charge le formulaire approprié dans la fenêtre modale. Comment pourrais-je passer cela dans la fonction. En ce moment, il est codé en dur pour recevoir #uploadform. Essentiellement, je veux réutiliser la fonction et déposez-les dans varialbles comme l'action, la prévisualisation et d'identification du formulaire etc ...Comment transmettre un ID d'élément à ma fonction jQuery

$(function(){ 
       var jForm = $("#uploadform"); 
       jForm.submit(
        function(objEvent){ 
        var jThis = $(this); 
        var strName = ("uploader" + (new Date()).getTime()); 
        var jFrame = $("<iframe name=\"" + strName + "\" src=\"about:blank\" />"); 
        jFrame.css("display", "none"); 
        jFrame.load(
         function(objEvent){ 
          var objUploadBody = window.frames[ strName ].document.getElementsByTagName("body")[ 0 ]; 
          var jBody = $(objUploadBody); 
          var objData = eval("(" + jBody.html() + ")") 
          var thumb = ('thumbnails/' + eval(jBody.html())); 
          $("#header").css("background", "url(" + thumb + ") no-repeat center"); 
          $("#preview").attr("src", thumb); 
        setTimeout(
         function(){ 
          jFrame.remove(); 
          },100); 
       }); 
      $("body:first").append(jFrame); 
      jThis 
       .attr("action", "upload_act_single.cfm") 
       .attr("method", "post") 
       .attr("enctype", "multipart/form-data") 
       .attr("encoding", "multipart/form-data") 
       .attr("target", strName); 
      }); 
     }); 

Répondre

4

je vais suggérer quelque chose de similaire sauf créer une fonction distincte pour l'occasion:

function formSubmit(formId) { 
    var jForm = $("#"+formId); 
    //remainder of your code 
} 

Ensuite, pour chaque forme créer votre connexion onSubmit soit directement lors de la déclaration du formulaire HTML:

<form id="myForm" class="pageForms" onsubmit="function(formSubmit(this.id))> ... 

Ou programatically:

$("#myForm").submit(function() { 
    formSubmit("#myForm"); 
}); 

[OR]

$(".pageForms").submit(function() { //to apply to all forms within the document 
    formSubmit("#"+this.id);   //with that class 
}); 

OU pour toutes les formes dans le document (mais pas sûr si cela va fonctionner)

$("form").submit(function() { 
    formSubmit("#"+this.id); 
}); 

Rappelez-vous pour effectuer la pièce jointe dans la fonction onLoad [$ (function() {...})] ou erwise javascript erreurs pourraient se produire: S

+0

Donc, essentiellement mon téléchargement est enveloppé dans la fonction formulaireSubmit, correct? Si tel est le cas, je suppose que cela me permettrait également de définir mes autres vars comme où les soumissions et d'autres données que je voudrais inclure dans le soumettre. Est-ce que cela me permettrait également de soumettre automatiquement si j'ai fait un onChange dans mon champ de saisie de fichier par opposition à onSubmit? – Ofeargall

+0

Exactement, vous pouvez définir la méthode et l'action dans l'élément de formulaire HTML standard et les appeler avec javascript basique via this.action/this.method. Par conséquent, seulement besoin d'une fonction jQuery! Oui, vous pouvez utiliser un trigger onChange à la place et utiliser simplement $ ("formElement.id") .val() dans les données à soumettre. Vous devriez regarder le toolkit dojo, en particulier les méthodes dojo.xhrGet/dojo.xhrPost (ou dojo.io.iframe.send pour les données de formulaire en plusieurs parties);) – lintal

0

essayer $(this).attr("id")

+0

Ceci est vraiment un commentaire, pas une réponse à la question. Veuillez utiliser "ajouter un commentaire" pour laisser un commentaire à l'auteur. –

+1

je vous remercie pour les commentaires :) fera la prochaine fois – GerManson

0
var myFunction = function(formid) { 
    var jForm = $(formid); 
    // .... 
} 

$(function() { 
    myFunction("#uploadform"); 
}); 
$(function() { 
    myFunction("#uploadform2"); 
});