전송 데이터를 통해 colorbox 아약스에게

Question

HTML

<div class="cus_input"> 
    <form id="category_form" method="GET" action="<?php echo base_url(); ?>welcome/find/" > 
     <input type="text" id="category_input" name="q" placeholder=" Find Category"/> 
     <a type="submit" class="ajax cboxElement" id="category_submit" src="<?php echo base_url() ?>img/board/icons/add.jpg" value="" /> 
    </form> 
</div> 

컨트롤러 수동으로 URI에 갈 때이 컨트롤러가 제대로 내 원하는 결과를 생성

function find() 
{ 
     $this->pageload_model->load_page(); 
     $getquery = $this->input->get("q"); 
     $data['find'] = $this->find_model->get_find_view($getquery); 
     $page['content'] = $this->load->view("template/findtemplate.php", $data); 
     echo json_encode($page); 
} 

를 사용하여 제출합니다. jquery UI 대화 상자를 사용하기 위해 약간 수정되었습니다. 그러나, 나는 차라리이 시점에서 colorbox 또는 fancybox를 사용하려고합니다.

찾기 모델 :

public function get_find_view($q) 
    { 
     if (!$q) { 
     $html = "Search disrupted: <a href='". base_url()."'>Go back to main page </a>"; 
     return $html; 
     } else { 
     $accountdata['found'] = $this->find_model->get_found_view($q); 
     $accountdata['create_category'] = $this->find_model->get_create_category_view($q); 
     return $this->load->view('find/find_view', $accountdata , TRUE); 
     } 
    } 

colobox 아약스 JS는해야한다 : $('ajax').colorbox()

나는이 개 지역 ... 위로 직선 아무런 문제없이 작동 링크하고있는 아약스 클래스가 위에서 언급 한 제출 버튼. 내가 뭘 찾고있는 입력 값을 find() 컨트롤러에 보내고 페이지를로드하고 colorbox 창을 통해 열어. 결국 pushstate에 변경 사항을 추가하여 새 URL/페이지를 크롤링하고 공유 할 수 있습니다.

나는 운이 없다. 도와 주셔서 감사합니다! 필요한 코드를 추가합니다.

Answer 1

전 색상 상자를 사용하지 않았으므로이 문제에 100 % 동의하지 않습니다. 당신이해야 할 일은 폼에서 데이터를 직렬화하고 Ajax 요청을 직접 처리하는 것입니다. 이 같은 뭔가 :

HTML :

<div class="cus_input"> 
    <form id="category_form" method="GET" action="<?php echo base_url(); ?>welcome/find/" onsubmit="return category_form_submit();" > 
    <input type="text" id="category_input" name="q" placeholder=" Find Category"/> 
    <a type="submit" id="category_submit" src="<?php echo base_url() ?>img/board/icons/add.jpg" value=""/> 
    </form> 
</div> 

JQUERY :

function category_form_submit() { 
    $.get('/welcome/find?' + $('#category_form').serialize(), function(response){ 
     $.fn.colorbox({html:response}); 
     //here is where you could put your pushstate code 
    }); 
    return false; 
}