kimsq 기본 템플릿 메인 모달(게시내용가져오기) 프로세스

kimsq 기본 템플릿 메인 모달(게시내용가져오기) 프로세스

킴스큐를 설치하면 아래와 같이 기본 템플릿을 겟! 할수 있습니다.

위젯으로 별도 처리 되어 있어서 위젯 경로로 예를 들어 보겠습니다.

\widgets\bbs\bs4-bbs-list-01\main.php // 모달에 들어갈 정보를 기본적으로 가지고 있는다 <a class="text-nowrap text-truncate muted-link" href="#modal-bbs-view" data-toggle="modal" data-bid="<?php echo $wdgvar['bid'] ?>" data-uid="<?php echo $_R['uid'] ?>" data-url="<?php echo getBbsPostLink($_R)?>" data-cat="<?php echo $_R['category'] ?>" data-title="<?php echo $wdgvar['title']?>" data-subject="<?php echo $_R['subject']?>">

 

\widgets\bbs\bs4-bbs-list-01\main.php

​

// 모달에 들어갈 정보를 기본적으로 가지고 있는다

<a class="text-nowrap text-truncate muted-link"

        href="#modal-bbs-view" data-toggle="modal"

        data-bid="<?php echo $wdgvar['bid'] ?>"

        data-uid="<?php echo $_R['uid'] ?>"

        data-url="<?php echo getBbsPostLink($_R)?>"

        data-cat="<?php echo $_R['category'] ?>"

        data-title="<?php echo $wdgvar['title']?>"

        data-subject="<?php echo $_R['subject']?>">

​

// a태그 사용안하고 해당태그에 직접 호출시는 아래참조/ "data-target"을 설정

<div class="span4 proj-div" data-toggle="modal" data-target="#호출모달아이디">Clickable content, graphics, whatever</div>

위젯 main.php 페이지 모달 관련 소스

include_once $g['dir_module_skin'].'_widget.php'; <script src="<?php echo $g['url_module_skin'] ?>/js/getPostData.js" ></script> <script> $(function () { var modal_settings={ mid : '#modal-bbs-view', // 모달아이디 ctheme : '<?php echo $d['bbs']['c_skin_modal'] ?>' //모달 댓글테마 } getPostData(modal_settings); // 모달 출력관련11 }) </script>

17

 

1

include_once $g['dir_module_skin'].'_widget.php';

2

3

<script src="<?php echo $g['url_module_skin'] ?>/js/getPostData.js" ></script>

4

<script>

5

6

  $(function () {

7

8

      var modal_settings={

9

        mid  : '#modal-bbs-view', // 모달아이디

10

        ctheme  : '<?php echo $d['bbs']['c_skin_modal'] ?>' //모달 댓글테마

11

      }

12

      getPostData(modal_settings); // 모달 출력관련11

13

14

  })

15

16

</script>

17

위에서 설정한 <script src="<?php echo $g['url_module_skin'] ?>/js/getPostData.js" ></script> 소스 내용 // 보여질 모달의 기본정보를 셋팅한다. function getPostData_main(modal_settings){ // 보여질 모달 아이디 변수받기 var mid=modal_settings.mid; // 모달을 보여줄때 액션 $(mid).on('show.bs.modal', function(event) { var ele = $(event.relatedTarget) // 모달을 호출한 아이템 정의 var uid = $(ele).attr('data-uid')?$(ele).attr('data-uid'):''; // 대상 PK var modal = $(this); //Ajax 데이터 불러오기 $.post(rooturl+'/?r='+raccount+'&m=member&a=get_Data(액션파일경로)',{ //bid : bid, uid : uid // 넘겨줄 값을 셋팅한다. },function(response){ //Ajax 페이지에서 데이터 받아 처리한다. var result = $.parseJSON(response); // Ajax 페이지에서 배열로 값을 받는다. // 아래는 데이터 받는 예시 var Bgoods_type =result.Bgoods_type; var Bgoods_Days =result.Bgoods_Days; var Bgoods_staDate =result.Bgoods_staDate; var Bgoods_endDate =result.Bgoods_endDate; . . . //아래는 받은데이터를 페이지에 값을 치환하는 예시 modal.find('[data-role="Bgoods_type"]').text(Bgoods_type); modal.find('[data-role="Bgoods_Days"]').text(Bgoods_Days); modal.find('[data-role="Bgoods_staDate"]').text(Bgoods_staDate); modal.find('[data-role="Bgoods_endDate"]').text(Bgoods_endDate); }) }) }

 

1

위에서 설정한

2

<script src="<?php echo $g['url_module_skin'] ?>/js/getPostData.js" ></script>

3

소스 내용 

4

5

// 보여질 모달의 기본정보를 셋팅한다.

6

function getPostData_main(modal_settings){

7

    // 보여질 모달 아이디 변수받기

8

    var mid=modal_settings.mid; 

9

10

    // 모달을 보여줄때 액션

11

    $(mid).on('show.bs.modal', function(event) {

12

        var ele = $(event.relatedTarget) // 모달을 호출한 아이템 정의

13

        var uid = $(ele).attr('data-uid')?$(ele).attr('data-uid'):''; // 대상 PK

14

        var modal = $(this); 

15

        //Ajax 데이터 불러오기

16

        $.post(rooturl+'/?r='+raccount+'&m=member&a=get_Data(액션파일경로)',{

17

            //bid : bid,

18

            uid : uid  //  넘겨줄 값을 셋팅한다.

19

        },function(response){ //Ajax 페이지에서 데이터 받아 처리한다.

20

            var result = $.parseJSON(response); // Ajax 페이지에서 배열로 값을 받는다.

21

            // 아래는 데이터 받는 예시

22

            var Bgoods_type     =result.Bgoods_type;

23

            var Bgoods_Days     =result.Bgoods_Days;

24

            var Bgoods_staDate  =result.Bgoods_staDate;

25

            var Bgoods_endDate  =result.Bgoods_endDate;

26

                .

27

                .

28

                .

29

            //아래는 받은데이터를 페이지에 값을 치환하는 예시

30

            modal.find('[data-role="Bgoods_type"]').text(Bgoods_type);

31

            modal.find('[data-role="Bgoods_Days"]').text(Bgoods_Days);

32

            modal.find('[data-role="Bgoods_staDate"]').text(Bgoods_staDate);

33

            modal.find('[data-role="Bgoods_endDate"]').text(Bgoods_endDate);

34

35

        })

36

    })

37

}

38

액션 파일 처리

위에서 경로설정한 액션 파일 "get_Data(액션파일경로)" 소스 내용 <?php $result=array(); $result['error']=false; // 전달 받은 데이터 $uid = $_POST['uid']; // 기본 데이터 $TMPL['s']=$rooturl; $TMPL['r']=$raccount; $TMPL['m']=$m; $TMPL['uid']=$uid; //본 페이지에 전달할 값을 $result 배열에 담는다 $result['Opt_ef1_day'] = $TMPL['Opt_ef1_day']; $result['Opt_ef2_day'] = $TMPL['Opt_ef2_day']; $result['Opt_ef3_day'] = $TMPL['Opt_ef3_day']; $result['Opt_ef4_day'] = $TMPL['Opt_ef4_day']; // 본페이지로 json 리턴한다. 위의 getPostData.js 로 데이터를 리턴한다. echo json_encode($result); ?>

x

 

1

위에서 경로설정한 액션 파일 "get_Data(액션파일경로)" 소스 내용

2

3

<?php

4

$result=array();

5

$result['error']=false;

6

// 전달 받은 데이터

7

$uid = $_POST['uid'];

8

// 기본 데이터

9

$TMPL['s']=$rooturl;

10

$TMPL['r']=$raccount;

11

$TMPL['m']=$m;

12

$TMPL['uid']=$uid;

13

//본 페이지에 전달할 값을 $result 배열에 담는다

14

$result['Opt_ef1_day']      = $TMPL['Opt_ef1_day'];

15

$result['Opt_ef2_day']      = $TMPL['Opt_ef2_day'];

16

$result['Opt_ef3_day']      = $TMPL['Opt_ef3_day'];

17

$result['Opt_ef4_day']      = $TMPL['Opt_ef4_day'];

18

19

// 본페이지로 json 리턴한다. 위의 getPostData.js 로 데이터를 리턴한다.

20

echo json_encode($result);

21

22

?>

23

24

25

ps: 원본 소스파일은 위 소스내용보다 복잡합니다. 디비컨트롤 부분이나 나머지 디테일 부분은
     kimsq 소스 파일에서 확인부탁드립니다.

     사이트 커스텀 하려고 보니 작동원리를 알아야 해서 개인적으로 분석해봤습니다.

---

번외편 

- 별다른 수정이 없었는데 모달로 데이터를 불러오는중 갑자기 아래와 같이 JSON 에러가 난다면? [ unexpected token < in json at position 0 ]

다양하게 검색해봤지만 데이터를 불러오는 액션파일[ a.~~~~ ] 을 이래저래 수정해보던중 갑자기 된다....이건뭐지...ㅠㅠ

나름 생각한 해결방법 

1. 이 액션파일에 관련된 데이터 이외에는 모두 삭제한다.

2. 개발자도구 같은 툴로 Respons 되는 데이터의 내용을 아래와 같이 이상없이 가져오는지 확인해본다.

ps : 생각해 보면 가끔씩 수정한적이 없는데 갑자기 JSON 오류가 나는것 같은데 연계성이나 이런건 확인이 안됐습니다.

      현재로선 개발자 도구를 이용  오류날때 확인해 보는것이 해결 방안 인것 같습니다.

위의 경우는 json이 오류가나는 건데 한가지더 확인된 부분이 있습니다.

getContents($R['컬럼'],'HTML');

위와같이 예를 들면 게시판 내용 불러오기가 안되는 경우 가있는데요

getContent.lib.php 
preg_replace => preg_replace_callback 로 변경해줍니다.

참조 : https://github.com/kimsQ/rb/issues/163