2011-12-01 4 views
0

이 내가 facebox 플러그인로드 내 HTML 페이지의 머리 태그에있는 것입니다 :이 내 DIV 코드입니다

<!-- This is for the facebox plugin to work --> 
<link href="<?php echo base_url();?>styles/facebox/src/facebox.css" media="screen" rel="stylesheet" type="text/css" /> 
<script src="<?php echo base_url();?>styles/facebox/lib/jquery.js" type="text/javascript"> </script> 
<script src="<?php echo base_url();?>styles/facebox/src/facebox.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    jQuery(document).ready(function($) { 
     $('a[rel*=facebox]').facebox({ 
      loadingImage : "<?php echo base_url();?>styles/facebox/src/loading.gif", 
      closeImage : "<?php echo base_url();?>styles/facebox/src/closelabel.png" 
     }) 
    }) 
</script> 

<?php if(isset($$j)) : foreach($$j as $row) : ?> 
    <div class="single-result" id="single-result"> 
     <div class="name"><?php echo $row->Name; ?></div> 
     <div class="description"><?php echo $row->Description; ?></div> 
    </div> 
<?php endforeach; ?> 
<?php else : ?> 
    error here 
<?php endif; ?> 

내가 원하는 건, 사용자가 div id = "single-result"를 클릭하면 데이터베이스에서 데이터를 가져 와서로드하는 PHP 컨트롤러에 아약스 호출을하도록 함수를 호출하는 아약스 코드입니다 facebox 모달 창으로보기.

내가 모르는 부분은 facebox 모달 윈도우에로드하는 방법입니다. 아약스 호출을 사용하여 파일로 데이터를 보내고 페이지의 특정 div에보기를로드하는 방법을 알고 있습니다. 그냥 페이지의 특정 div 대신 모달 창에로드하려고합니다.

전혀 가능합니까? (또한 내가 php 프레임 워크에 대한 codeigniter를 사용하고 있습니다)

여기 div에 클릭하면 콘텐츠 오른쪽 div로 아약스 요청 결과를로드 할 내 아약스 코드입니다.

<script type="text/javascript"> 
       $("#single-result").click(function() { 

        var form_data = { 
         ajax: '1', 
         itemcode: "<?php echo $row->id; ?>" 
        }; 


        $.ajax({ 
         url: "<?php echo site_url('ajax/item_info_right'); ?>", 
         type: 'POST', 
         data: form_data, 
         success: function(msg) { 
          $('#content-right').html(msg); 
         } 
        }); 

        return false; 
       }); 
       </script> 
       <!-- END --> 

어떻게하면 위의 코드를 수정하여 facebox 모달 창으로 사용할 수 있습니까? facebox가 아래 코드를 제공한다는 것을 알지만, 어떻게해야 할 지 모릅니다.

jQuery.facebox(function() { 
    jQuery.get('code.js', function(data) { 
     jQuery.facebox('<textarea>' + data + '</textarea>') 
    }) 
}) 

답변

0

그것은 당신이 계신 정말 분명하지 않다 ...

당신이 원하는 것은 데이터가 facebox으로 채울 수있는 아약스 POST에서 반환해야하는 경우

, 단순히 성공 facebox 전화 아약스 게시물의 콜백 : 또는

$("#single-result").click(function() { 
     var form_data = { 
      ajax: '1', 
      itemcode: "<?php echo $row->id; ?>" 
     }; 


     $.ajax({ 
      url: "<?php echo site_url('ajax/item_info_right'); ?>", 
      type: 'POST', 
      data: form_data, 
      success: function(msg) { 
       jQuery.facebox(msg); 
      }) 
     }); 

, 그것은 포스트가 처리되는 동안 facebox 로딩 그래픽을 원한다면, 당신은 facebox 기능에 아약스 POST를 포장 할 수 있습니다 다음과 같습니다

$("#single-result").click(function() { 
    jQuery.facebox(function() { 
     var form_data = { 
      ajax: '1', 
      itemcode: "<?php echo $row->id; ?>" 
     }; 
     $.ajax({ 
      url: "<?php echo site_url('ajax/item_info_right'); ?>", 
      type: 'POST', 
      data: form_data, 
      success: function(msg) { 
       jQuery.facebox(msg); 
      }) 
     }); 
    }) 
})