CI 묻고 답하기

제목 자바스크립트 변수 CI 에서 사용하기
글쓴이 루비콘 작성시각 2016/01/25 17:16:56
댓글 : 7 추천 : 0 스크랩 : 0 조회수 : 15406   RSS
아래 소스는 Daum 주소 api 입니다 궁금한게 있어서 여쭈어 보려고 하는데요ㅠ

아래 소스를 보시면 아시겠지만 var fullAddr 에 값이 저장 되는 것을 아실 수 있으실거에요
근데 여기서 저장된 var fullAddr 변수를 CI 를 사용해서 DB에 저장하고 싶은데 이럴떤 어떤식으로 해야하나요 ㅠㅠ

CI에 자바스크립트 라이브러리를 좀 보았는데 좀 어려운건지 제가 이해를 못하는건지

var fullAddr 를 DB에 저장해서 다시 사용자 페이지에 보여주고 싶은데 좀 어렵네요 ㅠㅠ도와주세요 


<input type="text" id="sample4_postcode" placeholder="우편번호">
<input type="button" onclick="sample4_execDaumPostcode()" value="우편번호 찾기"><br>
<input type="text" id="sample4_roadAddress" placeholder="도로명주소">
<input type="text" id="sample4_jibunAddress" placeholder="지번주소">
<span id="guide" style="color:#999"></span>

<script src="http://dmaps.daum.net/map_js_init/postcode.v2.js"></script>
<script>
    function sample4_execDaumPostcode() {
        new daum.Postcode({
            oncomplete: function(data) {
                // 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.

                // 도로명 주소의 노출 규칙에 따라 주소를 조합한다.
                // 내려오는 변수가 값이 없는 경우엔 공백('')값을 가지므로, 이를 참고하여 분기 한다.
                var fullRoadAddr = data.roadAddress; // 도로명 주소 변수
                var extraRoadAddr = ''; // 도로명 조합형 주소 변수

                // 법정동명이 있을 경우 추가한다. (법정리는 제외)
                // 법정동의 경우 마지막 문자가 "동/로/가"로 끝난다.
                if(data.bname !== '' && /[동|로|가]$/g.test(data.bname)){
                    extraRoadAddr += data.bname;
                }
                // 건물명이 있고, 공동주택일 경우 추가한다.
                if(data.buildingName !== '' && data.apartment === 'Y'){
                   extraRoadAddr += (extraRoadAddr !== '' ? ', ' + data.buildingName : data.buildingName);
                }
                // 도로명, 지번 조합형 주소가 있을 경우, 괄호까지 추가한 최종 문자열을 만든다.
                if(extraRoadAddr !== ''){
                    extraRoadAddr = ' (' + extraRoadAddr + ')';
                }
                // 도로명, 지번 주소의 유무에 따라 해당 조합형 주소를 추가한다.
                if(fullRoadAddr !== ''){
                    fullRoadAddr += extraRoadAddr;
                }

                // 우편번호와 주소 정보를 해당 필드에 넣는다.
                document.getElementById('sample4_postcode').value = data.zonecode; //5자리 새우편번호 사용
                document.getElementById('sample4_roadAddress').value = fullRoadAddr;
                document.getElementById('sample4_jibunAddress').value = data.jibunAddress;

                // 사용자가 '선택 안함'을 클릭한 경우, 예상 주소라는 표시를 해준다.
                if(data.autoRoadAddress) {
                    //예상되는 도로명 주소에 조합형 주소를 추가한다.
                    var expRoadAddr = data.autoRoadAddress + extraRoadAddr;
                    document.getElementById('guide').innerHTML = '(예상 도로명 주소 : ' + expRoadAddr + ')';

                } else if(data.autoJibunAddress) {
                    var expJibunAddr = data.autoJibunAddress;
                    document.getElementById('guide').innerHTML = '(예상 지번 주소 : ' + expJibunAddr + ')';

                } else {
                    document.getElementById('guide').innerHTML = '';
                }
            }
        }).open();
    }
</script>

 

 

 다음글 폼검증 에러 질문입니다. (2)
 이전글 CI와 MySQL에 관한 질문입니다 (7)

댓글

샤오란 / 2016/01/25 17:21:27 / 추천 0

저라면 컨트롤러 하나 만들고 사용자가 주소 선택시 ajax로 컨트롤러 호출해서 디비에 insert할것 같습니다.

루비콘 / 2016/01/25 17:23:33 / 추천 0

//샤오란 님 제가 에이작스 사용법을 잘 몰라서 혹시 참고할 만한 자료같은게 있을까요?

샤오란 / 2016/01/25 17:40:36 / 추천 0

이걸 어떻게 설명해야할지 ㅎㅎ

1. 다음 주소 api의 로직 마지막에 function 을 하나 만듭니다.

2. 그 function 을 통해 jquery 를 사용하여  컨트롤러를 호출합니다.

3. 컨트롤러에서 ajax요청인지 여부를 판단하여, 모델을 로드하여 디비에 insert 합니다.

 

 

// 아래 정도 코드면 이해하실거라고 생각합니다.

중요한것은

이벤트가 발생되는시점 제가 올려놓은 소스에서는 버튼을 클릭하는 부분이겠죠

루비콘님은 주소 api 스크립트의 원하는 부분에서 이벤트를 발생시키면 되고 (함수도 만들어야겠죠)

그 이벤트 발생시 함수가  실행되고 (제가 올린소스에서는 chte_chk()라고 생각하시면됩니다.)

그 함수를 통해 특정 컨트롤러를 호출하는 겁니다. (제가 올린소스에서는 Main컨트롤러가 되겠죠.)

제가 올린 코드는 설명하는데 있어서 필요없는 부분을 지운겁니다.

샤오란 / 2016/01/25 17:45:32 / 추천 0
<button onclick="cate_chk('<?php echo $cn;?>')" class="btn <?php echo $btn_class;?>"><?php echo $cn;?></button>
<script>
function cate_chk(cate, id) {
 //alert(cate);
 var param = {cate:cate, id:id};
 // 여기서 응답받을 함수를 선택해준다.
 $.post("/main", param, parseData, "html") ;  // 컨트롤러 , 보낼변수, 응답받을 함수, 응답받을 데이터 형태
 //alert('전송시작');

 //값을 가져다가 할인율을 만들어 집어넣는다.
}

function parseData(objInfo) {
 // php 파일 헤더에서 문자셋을 명시해줘야 한다. 굉장히 중요함
 //alert(objInfo);
 $('#imgslideArea').html(objInfo);
}
</script>
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Main extends MY_Controller {
 
 // Board객체가 생성될때 생성자가 호출됨.
 function __construct() 
 {
  // 부모의 생성자 호출
  parent::__construct();
 }

 function index() {
  // 여기서 일반요청인지 ajax요청인지 판단한다.
  if(!$this->input->is_ajax_request()) { // 일반요청이라면
   $this->load->view('main/main_view', $data);
  } else { // ajax 요청이라면
   // 여기서 생성된 데이터를 가지고 html 로 만들어서 echo 한다.
   $this->load->view('main/main_view_ajax', $data);
  }

 }
 }



  
}

 

루비콘 / 2016/01/25 17:54:20 / 추천 0

//샤오란 아 정말 감사합니다 이제좀 이해가 되는거 같기도하네요 아작스 정말 어렵네요 ㅠㅠ

샤오란 / 2016/01/25 17:55:53 / 추천 0

금방 하실수 있으실거에요. 어렵지 않아요~ .

루비콘 / 2016/01/26 09:26:26 / 추천 0

//샤오란 항상 답변 감사합니다 ㅎㅎㅎ