Facebox problem

796 Views Asked by At

Excuse me could someone send me a complete tutorial or post a example about of Facebox as its documentation is poor.

My problem is that ajax request is OK but don´t show any popup with content.

Perhaps I forgot steps.

My code

Application controller

class ApplicationController < ActionController::Base
  include AuthenticatedSystem
  include RoleRequirementSystem
  include FaceboxRender

...

end

Application layout

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

      <title><%= configatron.site_name %></title>

      <%= stylesheet_link_tag "facebox" %>
      <%= stylesheet_link_merged :base %>
      <%= javascript_include_merged :base %>
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
      <%= stylesheet_link_tag 'mobile' if mobile_device? %>
      <%= javascript_include_tag('jquery.simplemodal') %>
      <%= javascript_include_tag("jquery.form") %>
      <%= javascript_include_tag "facebox" %>
      <script type="text/javascript">
          $j = jQuery.noConflict();
          jQuery(document).ready(function($) {
            $('a[rel*=facebox]').facebox()
          })

      </script>
    </head>
...
...

index view

<% content_for :header do %>Lista de Pack<% end %>

<%= facebox_link_to "Ver packs", :url => {:controller => "packs", :action => "prueba"}, :method => :get -%>

prueba view

<div id="pack-list">
 <h1>HOLA</h1>
</div>

packs controller

  def index
  end

  def prueba
    @packs = Pack.paginate :page => params[:page], :per_page => 5

    respond_to do |format|
      format.html
      format.js { render_to_facebox }
    end
  end
1

There are 1 best solutions below

3
On BEST ANSWER

as it says here: http://chriswanstrath.com/facebox/

<a href="remote.html" rel="facebox">text</a>

<script src="jquery.js" type="text/javascript"></script>
<link href="/facebox/facebox.css" media="screen" rel="stylesheet" type="text/css"/>
<script src="/facebox/facebox.js" type="text/javascript"></script>
<script>
  jQuery(document).ready(function($) {
    $('a[rel*=facebox]').facebox() 
  })
</script>