道喜技术日记 .^. 天天红玉世界

Rails Ruby MacOSX 。。。创新来自于刻苦的实践和勤奋的思考... www.hhtong.com


Rails技巧系列：代码redirect_to(@object)够用了吗

由Gudao Luo在2009-01-17 at 11:56发表的

代码redirect_to(@object)够用了吗
图片页面HTML代码简化清单
<div id="tabs">
  <ul>
    <li><a href="#tabs-1">公司</a></li>
    <li><a href="#tabs-2">员工</a></li>
    <li><a href="#tabs-3">集装箱</a></li>
  </ul>
  <div id="tabs-1">Company</div>
  <div id="tabs-2">Employee</div>
  <div id="tabs-3">Container</div>
</div>
  • 说明
    • 代码（一）是通过Rails命令scaffold自动生成代码，其中有一行代码“redirect_to @container”。这一行代码返回到页面，而不能够返回到该页面的某一个标签位置，如上图所示类似页面。如何办？
    • 代码（二）中代码“redirect_to container_path(@container, :anchor => “tabs-3”) ”就是解决这个问题的办法。
代码（一）
  # POST /containers
  # POST /containers.xml
  def create
    @container = Container.new(params[:container])    respond_to do |format|
      if @container.save
        flash[:notice] = 'Container was successfully created.'
        format.html { redirect_to @container) }
        format.xml  { render :xml => @container, :status => :created, :location => @container }
      else
        format.html { render :action => "new" }
        format.xml  { render :xml => @container.errors, :status => :unprocessable_entity }
      end
    end
  end
代码（二）
  # POST /containers
  # POST /containers.xml
  def create
    @container = Container.new(params[:container])    respond_to do |format|
      if @container.save
        flash[:notice] = 'Container was successfully created.'
        format.html { redirect_to container_path(@container, :anchor => "tabs-3") }
        format.xml  { render :xml => @container, :status => :created, :location => @container }
      else
        format.html { render :action => "new" }
        format.xml  { render :xml => @container.errors, :status => :unprocessable_entity }
      end
    end
  end
标记: Rails, Tabs, jQuery, tricks, tutorials

代码世界：介绍使用jQuery UI标签功能

由Gudao Luo在2008-08-02 at 19:04发表的

介绍使用jQuery UI标签功能

使用实例

  • 下载CSS文件及其图片
    1 svn co http://jquery-ui.googlecode.com/svn/tags/latest/themes/flora/
  • 下载jQuery软件及其UI库
    1   curl -O http://code.jquery.com/jquery-latest.js
2   curl -O http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js
3   curl -O http://dev.jquery.com/view/tags/ui/latest/ui/ui.tabs.js
    或者使用命令
    1   wget http://code.jquery.com/jquery-latest.js
2   wget http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js
3   wget http://dev.jquery.com/view/tags/ui/latest/ui/ui.tabs.js
  • 创建一个HTML文件
    1   vi tabs.html
  • 该HTML文件必须包含三部分内容：
     1 <html><head>
 2   <!— 1. 说明CSS文件和jQuery文件的位置 BEGIN —>
 3   <script src="jquery-latest.js"></script>
 4   <link rel="stylesheet" href="flora/flora.all.css" type="text/css" media="screen" title="Flora (Default)">
 5   <script type="text/javascript" src="ui.core.js"></script>
 6   <script type="text/javascript" src="ui.tabs.js"></script>
 7   <!— 1. 说明CSS文件和jQuery文件的位置 END —>
 8 　
 9   <!— 2. jQuery代码 BEGIN —>
10   <script>
11   $(document).ready(function(){
12     $("#example > ul").tabs();
13   });
14   </script>
15   <!— 2. jQuery代码 END —></head><body>
16 　
17   <!— 3. 与jQuery代码相关的HTML代码 BEGIN —>
18   <div id="example" class="flora">
19     <ul>
20       <li><a href="#fragment-1"><span>One</span></a></li>
21       <li><a href="#fragment-2"><span>Two</span></a></li>
22       <li><a href="#fragment-3"><span>Three</span></a></li>
23     </ul>
24     <div id="fragment-1">tab1 内容</div>
25     <div id="fragment-2">tab2 内容</div>
26     <div id="fragment-3">tab3 内容</div>
27   </div>
28   <!— 3. 与jQuery代码相关的HTML代码 END —></body></html>
  • 参考资料
标记: Codes, Rails, Tabs, jQuery, ui