웹마스터 팁

  2. Support
  3. 웹마스터 팁

Sketchbook5 모바일 게시판에 파일 업로드 기능 추가 하기

2012.11.28 15:11

hhgyu

그냥재미로님의 모바일 파일 업로드 지원 게시판이 있는데

요걸 잘하면 스케치북5 모바일 게시판도 업로드가 가능 하게 할 수 있지 않을 까해서

끄적이다 아주그냥 대공사를 하고 말았습니다 ㅠㅠ


테스트 기종

아이폰4S IOS 5.1.1

갤석시S3 4.1

모두 이상 없이 잘됩니다.


먼저 write_form.html 8번째 줄

<!--%import("css/board.css")-->

밑에 추가 해줍니다.

?
write_form.html
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
<!--%import("./js/ajaxfileupload.js")-->
 
<?php
include_once(_XE_PATH_.'/modules/file/file.class.php');
include_once(_XE_PATH_.'/modules/file/file.controller.php');
$oFileController = &getController('file');
 
if(!$_SESSION['_editor_sequence_']) $_SESSION['_editor_sequence_'] = 1;
$editor_sequence = $_SESSION['_editor_sequence_'] ++;
$oFileController->setUploadInfo($editor_sequence, $upload_target_srl);
$_SESSION['upload_info'][$editor_sequence]->enabled = true;
$_SESSION['upload_info'][$editor_sequence]->upload_target_srl = $upload_target_srl;
?>
<style type="text/css">
.success {
border-width: 1px;
border-style: dotted;
border-color: blueViolet;
padding: 10px;
}
.success img {
display: block;
}
.success a {
margin-left: 10px;
font-weight: bold;
}
</style>
<script type="text/javascript" >
jQuery.extend({
    handleError: function( s, xhr, status, e ) {
        // If a local callback was specified, fire it
        if ( s.error )
            s.error( xhr, status, e );
        // If we have some XML response text (e.g. from an AJAX call) then log it in the console
        else if(xhr.responseText)
            console.log(xhr.responseText);
    }
});
    function ajaxFileUpload()
    {
        if(document.getElementById('Filedata').value ==""){
            alert("파일을 선택하세요");
            return false;
        }
 
        var up=jQuery("#t_document_srl").attr("value");
 
        jQuery.ajaxFileUpload
        (
            {
                url:'index.php?&act=procFileIframeUpload',
                secureuri:false,
                fileElementId:'Filedata',
                dataType: 'html',
                data:{
                mid: '{$mid}',
                editor_sequence: '1',
                uploadTargetSrl: up,
                manual_insert: 'true'
                },
                success: function (frameId, data, status)
                {
                var frm = document.getElementById('ff');
                var io = document.getElementById(frameId);         
                if(io.contentWindow)
                {
                    var sourceFile = document.getElementById(frameId).contentWindow.uploaded_fileinfo.source_filename;
                    var uploadFile = document.getElementById(frameId).contentWindow.uploaded_fileinfo.uploaded_filename;
                    var document_srl = document.getElementById(frameId).contentWindow.uploaded_fileinfo.upload_target_srl;             
                    var file_srl = document.getElementById(frameId).contentWindow.uploaded_fileinfo.file_srl;
 
                }else if(io.contentDocument)
                {
                    var sourceFile = document.getElementById(frameId).contentDocument.uploaded_fileinfo.source_filename;
                    var uploadFile = document.getElementById(frameId).contentDocument.uploaded_fileinfo.uploaded_filename;
                    var document_srl = document.getElementById(frameId).contentDocument.uploaded_fileinfo.upload_target_srl;                                   
                    var file_srl = document.getElementById(frameId).contentDocument.uploaded_fileinfo.file_srl;
                }
                //frm.document_srl.value = document_srl;
 
                jQuery("#t_document_srl").attr("value",document_srl);
 
            //  document.getElementById('Filedata').value ='aaa';
                 
                if(uploadFile != ""){
                    var Extension = uploadFile.substring(uploadFile.lastIndexOf('.') + 1).toLowerCase();
                    if (Extension == "gif" || Extension == "png" || Extension == "bmp" || Extension == "jpeg" || Extension == "jpg") {
                    jQuery('<li id="'+file_srl+'" class="wrt_opt"></li>').appendTo('#files').html('<img width="50px" height="atuo" src="'+uploadFile+'" /><span class="filename">'+sourceFile+'</span><a href="javascript:delete_file('+file_srl+',1)" class="abn dark">{$lang->cmd_delete}</a>').addClass('success');
                    }
                    else
                    {
                    jQuery('<li id="'+file_srl+'" class="wrt_opt"></li>').appendTo('#files').html('<span class="filename">'+sourceFile+'</span><a href="javascript:delete_file('+file_srl+',1)" class="abn dark">{$lang->cmd_delete}</a>').addClass('success');
                    }
                } else{
                    jQuery('<li></li>').appendTo('#files').text(sourceFile).addClass('error');
                }
                 
                    if(typeof(data.error) != 'undefined')
                    {
                        if(data.error != '')
                        {
                            alert(data.error);
                        }else
                        {
                            alert(data.msg);
                        }
                    }
                },
                error: function (data, status, e)
                {
                    alert(e);
                }
            }
        )
         
        return false;
 
    }
     
    function frmSubmit(){
        var frm = document.getElementById('ff');
        procFilter(frm, insert);
    }  
     
function delete_file(file_srl,editorSequence){
     
    var msg = window.confirm('삭제하시겠습니까?');
    if(msg)
    {
        var settings = file_srl;
        var params = new Array();
        params["file_srls"]  = file_srl;
        params["editor_sequence"] = editorSequence;
        var response_tags = new Array("error","message");
        exec_xml("file","procFileDelete", params, function() { reloadFileList(settings); } );
    }else{
        return false;
    }
 
}
function reloadFileList(settings) {
    jQuery("#"+settings).remove();
}
jQuery($).ready(function($){
    $("#loading_dialog")
    .ajaxStart(function(){
        $(this).show();
        $("#loading_form").hide();
    })
    .ajaxComplete(function(){
        $(this).hide();
        $("#loading_form").show();
    });
});
</script>



그 다음 같은 파일에서

<li>

<label for="nText">{$lang->content}</label>

<textarea name="content" cols="20" rows="8" id="nText"></textarea>

</li>

요렇게 생긴 놈 밑에 추가 합니다.

?
write_form.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<ul id="files" >
</ul>
<li class="wrt_locate">
    <div id="loading_dialog" style="display:none">
        <img id="loading" src="./img/loading.gif">
        <p>잠시만 기다려 주세요</p>
    </div>
    <div id="loading_form">
    <label for="nFileUpload">파일첨부</label>
        <input id="Filedata" type="file"  name="Filedata" class="input" style="width:100%;" value="">
        <button type="button" id="buttonUpload" onclick="return ajaxFileUpload();" class="btn">파일 업로드</button>
        <p>파일을 먼저 업로드하신 후 등록하세요</p>
    </div>
</li>


그다음은 ./js/ 폴더에

ajaxfileupload.js

이 파일을 올려 줍니다.


아마도 이렇게 하면 됩니다.


이게 힘들다 싶으면

sketchbook5Mobile.zip

이파일을 덮어 쓰셔도 됩니다.

이 게시물을
좋아요(+1)
목록
제목 글쓴이 날짜
영등포오피 ⦑출장마사지안내.COM⦒ 영등포OP 영등포오피 영등포출장샵 영등포오피 koykoyah 2025.02.22
제주도오피 ⦑오피.CLUB⦒ 제주도마사지 제주도오피 제주도오피 제주도OP koykoyah 2025.02.22
선릉오피 선릉OP ⦑오피쓰.COM⦒ 선릉휴게텔 선릉오피 선릉오피 koykoyah 2025.02.22
강남오피 ⦑오피쓰.COM⦒ 강남오피 강남출장마사지 강남오피 강남OP koykoyah 2025.02.22
일산오피 ⦑출장마사지안내.COM⦒ 일산오피 일산OP 일산건마 일산오피 koykoyah 2025.02.22
수원오피 ⦑오피쓰주소.COM⦒ 수원오피 수원OP 수원건마 수원오피 koykoyah 2025.02.22
목포오피 목포출장안마 ⦑오피사이트.NET⦒ 목포OP 목포오피 목포오피 koykoyah 2025.02.22
대전오피 대전오피 ⦑출장마사지안내.COM⦒ 대전OP 대전스파 대전오피 koykoyah 2025.02.22
동대문오피 ⦑출장안마사이트.COM⦒ 동대문OP 동대문오피 동대문출장샵 동대문오피 koykoyah 2025.02.22
수원오피 수원출장안마 ⦑출장마사지안내.COM⦒ 수원OP 수원오피 수원오피 koykoyah 2025.02.22
판교오피 판교오피 ⦑오피.CLUB⦒ 판교OP 판교스파 판교오피 koykoyah 2025.02.22
대구오피 대구OP ⦑오피사이트.NET⦒ 대구휴게텔 대구오피 대구오피 koykoyah 2025.02.22
신도림오피 신도림OP ⦑오피.CLUB⦒ 신도림휴게텔 신도림오피 신도림오피 koykoyah 2025.02.22
청주오피 청주OP ⦑출장마사지안내.COM⦒ 청주휴게텔 청주오피 청주오피 koykoyah 2025.02.22
신도림오피 신도림오피 ⦑출장안마사이트.COM⦒ 신도림OP 신도림스파 신도림오피 koykoyah 2025.02.22
답십리오피 ⦑오피.CLUB⦒ 답십리마사지 답십리오피 답십리오피 답십리OP koykoyah 2025.02.22
부평오피 ⦑오피쓰주소.COM⦒ 부평오피 부평출장마사지 부평오피 부평OP koykoyah 2025.02.22
제주도오피 ⦑출장마사지안내.COM⦒ 제주도마사지 제주도오피 제주도오피 제주도OP koykoyah 2025.02.22
대구오피 대구OP ⦑출장마사지안내.COM⦒ 대구휴게텔 대구오피 대구오피 koykoyah 2025.02.22
부산오피 ⦑오피.CLUB⦒ 부산OP 부산오피 부산출장샵 부산오피 koykoyah 2025.02.22
태그 쓰기