在AngularJS中创建一个下钻表单
Creating a drill-down form in AngularJS
我试图使用AngularJS在web应用程序中创建一个提交表单,其中每个表单条目的选项依赖于对前一个表单条目的响应。为了简单起见,我希望将它们全部放在一个页面上,并且在填充前一个表单条目之前,进一步的表单项将显示为灰色,或者在验证前一个响应时弹出。我想这个概念可能有一个名字,但我一直在努力为相关的搜索结果找到正确的关键字来找到这个想法的例子或教程。这个概念叫什么?
下面是一个简化的表单示例,其中用户提交比赛结果。常量提供程序提供定义下拉选项的对象(例如allSports.team=['Basketball', Soccer', ...]
),但是显示哪些选项取决于先前的用户输入(例如category=team
)。
- What is the name of the tournament?
- What category of tournament sport is it? (drop down)
- Team (yes)
- Individual
- What sport is it? (drop down)
- Basketball
- Soccer (yes)
- How many games were played in the tournament? (text entry)
- 3*
- For game 1, what was the name of the home team?
- Cougars
- For game 1, what was the name of the away team?
- Penguin
- Indicate which team won game 1:
- Cougars (yes)
- Penguins
- (repeat for games 2-3)
提交按钮将tournament
对象添加到tournaments
对象数组中,类似于以下内容:
var tournaments = [
{ 'tourneyName' = 'Cougar Classic',
'sportType' = 'Team',
'sportName' = 'Soccer',
'games' = [
{ 'teams' = [ 'Cougars', 'Penguins' ],
'winner' = 'Cougars' },
{ 'teams' = [ 'Cougars', 'Penguins' ],
'winner' = 'Penguins' },
{ 'teams' = [ 'Cougars', 'Penguins' ],
'winner' = 'Cougars' }
]
},
(next tournament)
]
在web应用程序中,用户可以根据特定的标准搜索比赛(所有篮球比赛,企鹅获胜的足球比赛,所有个人运动等)
你能提供的任何资源或帮助,帮助我完成这样的事情,我将不胜感激。我非常熟悉Angular的基础知识和简单的表单提交,但在我所做的教程中,我还没有真正找到这种范围的东西。此外,我正在与angular-meteor一起工作,所以如果有任何专业人士有任何更具体的建议(相关软件包等),我将非常欢迎。
我想出了我正在寻找的概念的名称,称为"级联选择"。一旦我明白了这一点,我就能够找到一些有用的资源来完成这个任务。这里有一个例子。有趣的是,掌握正确的词汇是多么重要!
我发现angular也形式上完成了很多我一直在寻找的其他事情,比如可以集成级联,可以交互式地启用/禁用选项,等等。
我希望这个发现能帮助到其他人!
- jquery mobile上多个页面上的一个表单
- 循环遍历包含另一个表单的表单
- 如何在javascript转换编码中将一个动态值从一个表单添加到另一个页面
- 我确实有一个表单,如果用户输入了输入,它应该检查否定或空的输入框,并抛出一条警告消息
- 如何通过 JS 将内容从一个表单中的一个文本框复制到另一个表单中的另一个文本框
- Slding表单不会一次显示一个表单
- html链接onclick弹出一个表单
- 使用 javascript 将值从一个表单传递到另一个表单
- 当在一个表单中进行更改时,ng-disabled 会触发所有表单验证
- 如何将一个表单中的项目添加到 Rails 中另一个表单的下拉选项
- 如何在一个表单标记中验证多个字段集
- 如何从一个表单的输入字段中获取数据,并使用JQuery在不同的表单中填充相同的输入类型
- 在PHP中将下拉选择列表的内容从一个表单传递到另一个表单
- 一个表单包含多个提交操作
- Javascript-更正用户名和密码以启用另一个表单
- 在ul后面添加一个表单
- angular js如何在提交一个表单时验证另一个表单
- 如何将某些HTML从一个页面转换为另一个表单
- 使用JavaScript将数据从一个表单显示到另一个页面
- 两个表单,一个选择/下拉框-需要将选择值从一个表单复制到另一个表单