2015년 4월 21일 화요일

form 데이터 iframe 으로 모든 데이터 전송 (form file iframe 전송)

===================== 페이지단 =====================
<script type="text/javascript">
    $(document).ready(function () {
    });

    // (string formId, callBackfn <- string 아님 이름임)
    function formDataUpLoadIframe(formId, callBackfn, UseReturnData) {
        var vfromObj = document.getElementById(formId);

        if (vfromObj == null) {
            alert("폼이름을 확인하여 주세요");
            return false;
        }
        if (vfromObj.action == "") {
            alert("폼속성 action이 지정되지 않았습니다.");
            return false;
        }

        var vformId = vfromObj.id;
        var vUseName = "iFrames_";
        if ((vformId == null || vformId == "") == false) {
            vUseName += vformId;
        }

        vfromObj.target = vUseName;                             // 폼타켓 지정

        // 첫번째 body태그에 iframe 태그 추가하기위해 시작
        var vbody = document.getElementsByTagName("body")[0];   // 첫번째 body 태그
        var viframeObj = document.createElement("iframe");
        viframeObj.name = vUseName;
        viframeObj.style.display = "none";
        vbody.appendChild(viframeObj);
        // 첫번째 body태그에 iframe 태그 추가하기위해 종료

        // iframe에 콜백 함수 생성
        // json 으로 데이터 받는 콜백함수 구현 -- !!중요 서버단에서 json 객체로 값을 넘기고 스크립트에서 json 객체로 값을 받음
        viframeObj = document.getElementsByName(vUseName)[0];
        viframeObj.onload = function () {
            var vDoc = this.contentWindow ? this.contentWindow.document : (this.contentDocument ? this.contentDocument : this.document);
            var vRoot = vDoc.documentElement ? vDoc.documentElement : vDoc.body;
            var vResult = vRoot.textContent ? vRoot.textContent : vRoot.innerText;
            var vData = JSON.parse(vResult);

            // 콜백함수 호출
            callBackfn(vData, UseReturnData);

            //현재 iframe 삭제 시작
            //viframeObj = document.getElementsByName(vUseName)[0];
            vbody.removeChild(viframeObj);
            //현재 iframe 삭제 종료
        }
        // iframe에 콜백 함수 종료

        vfromObj.submit();  // 폼데이터 전송 (실제 iframe 안에서 전송됨)
    }

    function callbackrun(data, ReturnData) {
        alert(ReturnData.IsContinue);
        alert(data.IsSuccess);
        alert(data.Msg);
    }

    function send() {
        var ReturnData = {};
        ReturnData.IsContinue = true;
        formDataUpLoadIframe("MainFrm", callbackrun, ReturnData);
    }
</script>

<body>
    <form id="MainFrm" action="/test/Save" method="post" enctype="multipart/form-data">
        <input type="text" name="title" value="12345" />
        <input type="file" name="tsFile" />
    </form>
    <a onclick="send();">전송 하장</a>
</body>

==================js 단==================================
function formDataUpLoadIframe(formId, callBackfn, UseReturnData) {
    var vfromObj = document.getElementById(formId);
    if (vfromObj == null) {
        alert("폼이름을 확인하여 주세요");
        return false;
    }
    if (vfromObj.action == "") {
        alert("폼속성 action이 지정되지 않았습니다.");
        return false;
    }

    var vformId = vfromObj.id;
    var vUseName = "iFrames_";
    if ((vformId == null || vformId == "") == false) {
        vUseName += vformId;
    }

    vfromObj.target = vUseName;                             // 폼타켓 지정
    
    // 첫번째 body태그에 iframe 태그 추가하기위해 시작
    var vbody = document.getElementsByTagName("body")[0];   // 첫번째 body 태그
    var viframeObj = document.createElement("iframe");
    viframeObj.name = vUseName;
    viframeObj.style.display = "none";
    vbody.appendChild(viframeObj);
    // 첫번째 body태그에 iframe 태그 추가하기위해 종료

    // iframe에 콜백 함수 생성
    // json 으로 데이터 받는 콜백함수 구현 -- !!중요 서버단에서 json 객체로 값을 넘기고 스크립트에서 json 객체로 값을 받음
    viframeObj = document.getElementsByName(vUseName)[0];
    viframeObj.onload = function () {
        var vDoc = this.contentWindow ? this.contentWindow.document : (this.contentDocument ? this.contentDocument : this.document);
        var vRoot = vDoc.documentElement ? vDoc.documentElement : vDoc.body;
        var vResult = vRoot.textContent ? vRoot.textContent : vRoot.innerText;
        // 익스플로 일경우 문제됨 그래서 마지막 {를 구해서 처리
        vResult = vResult.substring(vResult.lastIndexOf("{"));
        var vData = JSON.parse(vResult);

        // 콜백함수 호출
        callBackfn(vData, UseReturnData);

        //현재 iframe 삭제 시작
        //viframeObj = document.getElementsByName(vUseName)[0];
        vbody.removeChild(viframeObj);
        //현재 iframe 삭제 종료
    }
    // iframe에 콜백 함수 종료

    vfromObj.submit();  // 폼데이터 전송 (실제 iframe 안에서 전송됨)
}
===================== 서버단 =====================
public ActionResult Save(HttpPostedFileBase tsFile, string title)
{
    string strMsg = "aaaa";
    bool isSuccess = false;
    return Json(new { IsSuccess = isSuccess, Msg = strMsg }, JsonRequestBehavior.AllowGet);
}

댓글 없음:

댓글 쓰기