`
sunfengcheng
  • 浏览: 184318 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

动态的向列表添加项

阅读更多
[size=large][color=olive]动态的向列表添加项

这里使用一个简单的  tags 表
  其实以前我有一个项目作的时候比这个复杂多了, 这里就简单讲一下基本的使用方法,要运用到实际项目中还需要你能触类旁通.
   定义一格tags 的表.

db/migrate/001_create_tags.rb:

class CreateTags < ActiveRecord::Migration
  def self.up
    create_table :tags do |t|
      t.column :name, :string
      t.column :created_on, :datetime
    end
  end

  def self.down
    drop_table :tags
  end
end
通过在模型中使用 active Record 校验 可以保证 tag  是唯一的.
 
app/models/tag.rb:

class Tag < ActiveRecord::Base

  validates_uniqueness_of :name
end
在布局中调用prototype.js  和他所对应的样式。
app/views/layouts/tags.rhtml:

<html>
  <head>
    <title>Tags</title>
    <%= javascript_include_tag :defaults %>
  </head> 
  <body>  
    <%= yield  %>
  </body> 
</html>

在 list.rhtml 中包含新的标签表单核一个 调用局部模版,来显示列表。
app/views/tags/list.rhtml:

<h1>Tags</h1>

<% form_remote_tag(:update => 'list', 
                    :complete => visual_effect(:highlight, 'list'),
                    :url => { :action => :add } ) do %>
  <%= text_field_tag :name %>
  <%= submit_tag "Add Tag" %>
<% end %>

<div id="list">
  <%= render :partial => "tags", :locals => {:tags => @tags} %>
</div>

局部模版负责生成选择列表,
app/views/tags/_tags.rhtml:

Total Tags: <b><%= tags.length %></b>;

<select name="tag" multiple="true" size="6">
  <% i = 1 %>
  <% for tag in tags %>
    <option value="<%= i %>"><%= tag.name %></option>
    <% i += 1 %> 
  <% end %>
</select>

控制器包含两个动作, 一个是list ,他传递一个存储的标签列表来用作出示显示。 另一个是ADD , 添加新的标签,重新渲染模版。

app/controllers/tags_controller.rb:

class TagsController < ApplicationController

  def list
    @tags = Tag.find(:all,:order => "created_on desc")
  end

  def add
    Tag.create(:name => params[:name])
    @tags = Tag.find(:all, :order => "created_on desc")
    render :partial => "tags", :locals => {:tags => @tags}, :layout => false
  end
end
[/color][/size]
3
0
分享到:
评论

相关推荐

    动态添加、删除ListView列表项

    2. **动态添加项**: 添加项通常在某个按钮点击事件或其他用户交互后触发。你可以通过调用Adapter的`add()`方法将新数据添加到数据源,然后调用`notifyDataSetChanged()`通知ListView数据已更新。 ```java ...

    jQuery动态添加删除移动列表插件

    首先,jQuery动态添加功能允许我们在用户交互时实时向页面中的列表添加新元素。例如,当你有一个表单,用户输入信息后,这些信息可以即时添加到列表中。以下是一个简单的示例: ```javascript $("#addButton")....

    Jlist中添加Jcheckbox,实现鼠标动态移动列表项,动态添加Jcheckbox,右键动态删除列表项

    这是我之前做的一个项目要实现的一个功能,Jlist 动态添加删除移动Jcheckbox

    动态的向布局中添加布局控件实现ListView效果列表项效果

    标题提到的“动态的向布局中添加布局控件实现ListView效果列表项效果”,是指在运行时动态生成ListView的每个列表项(ListItem)的布局。这种方式通常比静态在XML中定义所有列表项更为灵活,尤其在数据量不确定或者...

    Labview Xcontrol 下拉列表动态添加

    网上搜集了很多关于Labview Xcontrol 方面零零散散的资料, 能用的或者带源码的很少,最近做项目的原因,恰好需要一个给用户选择可以根据输入数组信息, 动态加载和勾选所需的内容的功能, 自己参考部分别人的图片信息, ...

    flash动态风琴列表,实现列表动态添加

    本项目通过AS3(ActionScript 3)实现了一个具有动态添加功能的Flash风琴列表,使得开发者可以方便地在运行时根据需要添加新的列表项。 AS3是Flash Professional和Flex Builder等工具中使用的编程语言,它基于...

    使用列表控件添加和选择数据项

    在本教程中,我们将深入探讨如何使用列表控件来实现这些功能,尤其关注动态添加和选择数据项的过程。列表控件在多种编程语言和框架中都有应用,例如Windows Forms、WPF、Android、iOS以及Web开发中的HTML5等。 1. *...

    VC 动态添加CCList列表内容项.rar

    在这个示例中,“VC 动态添加CCList列表内容项”是一个关于如何在运行时向MFC(Microsoft Foundation Classes)的CListCtrl类控件动态添加条目的教程。CListCtrl是MFC提供的一种列表视图控件,它允许显示多项数据,...

    列表框应用程序,能够对列表项进行添加、修改、删除!

    - **添加项**:可以使用Items集合的Add方法。 ```csharp private void btnAdd_Click(object sender, EventArgs e) { string newItem = txtAdd.Text; lstBoxItems.Items.Add(newItem); txtAdd.Clear(); // ...

    Android中ListView动态添加删除项

    二、动态添加项 1. 在Activity或Fragment中,初始化ListView和Adapter,并设置Adapter到ListView上。 ```java ListView listView = findViewById(R.id.list_view); List&lt;Item&gt; itemList = new ArrayList(); Custom...

    Android DropDownView动态添加列表框值.rar

    本例子主要是自定义一个下拉列表框,演示Spinner的用法,在Android中创建一个DropDownView,动态添加列表框的值,示例运行后,用户即进入添加模式,添加后列表框中会一项内容,依次类推,单击下拉框会看到所添加的值...

    C#实现Winform动态添加菜单的方法

    首先,动态添加菜单的基本思路是,在程序运行时根据需要创建菜单项并将其添加到现有的MenuStrip控件中。在Winform应用中,MenuStrip控件用于展示应用程序的主要菜单。在`Form1_Load`事件处理函数中,我们可以编写...

    向左滑动删除列表,动态添加列表

    "向左滑动删除列表,动态添加列表"这个功能是提升用户交互性和操作便捷性的一个常见特性,广泛应用于各种应用程序,如社交应用、邮件客户端以及任务管理工具等。下面将详细解释这个功能的实现原理和相关技术。 首先...

    jQ+CSS3列表项添加删除效果

    "jQ+CSS3列表项添加删除效果"是一个典型的例子,它结合了jQuery JavaScript库和CSS3的新特性来实现列表中元素的添加与删除操作,同时赋予这些操作视觉上的吸引力。下面我们将详细探讨这个主题。 首先,jQuery是一个...

    QT 动态列表,支持增加、删除

    在QT中,动态列表是一种常见的用户界面元素,用于展示可交互的数据集合,比如文件名、联系人列表等。在本教程中,我们将深入探讨如何在QT中创建一个动态列表,支持增加、删除操作,并通过CSS进行美化。 1. **...

    VBA_为列表框添加列表项的方法.rar

    本资源“VBA_为列表框添加列表项的方法.rar”显然关注于如何使用VBA代码向列表框中动态添加条目。下面将详细阐述这个主题。 首先,我们需要了解在VBA中创建和引用列表框的基本步骤。在用户窗体(UserForm)中,可以...

    那些复杂的列表总要弄个清楚——(一)ListView动态添加项

    本文将深入探讨“那些复杂的列表总要弄个清楚——(一)ListView动态添加项”这一主题,主要关注如何在ListView中动态添加项目。 首先,我们需要了解ListView的基本结构。ListView由Adapter驱动,Adapter是连接数据...

    在dropdownlist中动态添加第一项的方法

    在某些情况下,我们可能需要在用户加载页面时动态地向DropdownList添加第一项,例如“请选择”或“全部”这样的默认选项。这不仅可以提供更好的用户体验,还可以确保用户在做出决定之前不会误提交表单。以下是一些...

    Ios 动态添加按钮

    在iOS开发中,动态添加按钮是一项常见的需求,尤其是在创建自定义视图或者界面布局时。本文将深入探讨如何在iOS应用中实现动态添加按钮,并解释这样做的原因。 首先,我们来理解为什么要在iOS应用中动态添加按钮。...

    动态添加菜单项到TreeView

    在这个场景中,我们要实现的功能是将`MenuStrip`中的菜单项动态地添加到`TreeView`中,这样可以让用户通过树形结构来浏览和访问菜单。 `MenuStrip`是.NET Framework提供的一种控件,用于创建应用程序的菜单栏。它...

Global site tag (gtag.js) - Google Analytics