2010-06-24 6 views
2

내가 작업중인 사이트의 편집 도구에 Ben Nadel의 iFrame 업로드 기능을 사용하고 있습니다. 나는 jQuery를 배우고있다. 이 기능은 아름답게 작동합니다. 재사용이 가능한 모달 윈도우의 일부이며 모든 것이 작동합니다. 그러나 호출이 어디서 왔는지 함수에 동적으로 알려서 적절한 양식을 모달 창에로드합니다. 어떻게 함수에 전달할 것인가? 지금은 #uploadform을 받기 위해 하드 코딩되어 있습니다. 기본적으로, 나는jQuery 함수에 요소 ID를 전달하는 방법

$(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); 
      }); 
     }); 

답변

4

을 시도 ... 기능을 다시 사용하고 액션, 미리보기와 같은 varialbles 드롭 및 ID 등을 형성 할 행사에 대한 별도의 함수를 만들 제외 :

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

다음을 HTML 양식을 선언 할 때, 각 양식에 대한 직접 당신의 onSubmit 연결을 만들 :

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

또는 프로그래밍 방식 :

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

[OR]

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

또는 문서의 모든 형태의

(이 작동하는지하지만 확인)

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

기억 onLoad 함수 [$ (function() {...})] 또는 oth 예기치 못한 자바 스크립트 오류가 발생할 수 있습니다. S

+0

그래서 본질적으로 내 업로드는 formSubmit 함수로 래핑됩니다. 그렇다면 제출 한 부분과 제출하고자하는 다른 데이터와 같은 다른 vars를 정의 할 수도 있습니다. onSubmit과 반대로 내 파일 입력 필드에서 onChange를 수행하면 자동 제출이 가능합니까? – Ofeargall

+0

정확히, 표준 HTML 양식 요소 내에서 메소드와 조치를 정의하고 this.action/this.method를 통해 기본 javascript로 호출 할 수 있습니다. 따라서 하나의 jQuery 함수 만 필요합니다. 예, 대신 onChange 트리거를 사용하여 제출할 데이터에 val()을 사용하면됩니다. dojo 툴킷, 특히 dojo.xhrGet/dojo.xhrPost (또는 다중 부분 양식 데이터의 경우 dojo.io.iframe.send) 메소드를 참조해야합니다. – lintal

0

나는 비슷한 제안 거라고 $(this).attr("id")

+0

이것은 정말로 의견이며 질문에 대한 답변이 아닙니다. 작성자에 대한 의견을 남기려면 "의견 추가"를 사용하십시오. –

+1

피드백에 감사드립니다 :) 다음에 할 것입니다 – GerManson

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

$(function() { 
    myFunction("#uploadform"); 
}); 
$(function() { 
    myFunction("#uploadform2"); 
}); 
관련 문제