在表单中选择第3个下拉列表时自动重定向？

Question

我有3个预先输入的字段:

它们如下:

国家:| _ __ _ __ _ ____ |

州:| _ __ _ __ _ ____ |

城市:| _ __ _ __ _ ____ |

这是第二个typeahead字段的代码(其余类似):

<input type="text" class="span3" style="margin: 0 auto;"
data-provide="typeahead"  data-items="4"
data-source="["Alabama","Alaska",
               <many more US states>
              ,"Wyoming"]">

现在......我需要两个类型字段看起来像下拉菜单,这可以通过这里的说明来实现..没问题.

• https://github.com/danielfarrell/bootstrap-combobox
• http://dl.dropbox.com/u/21368/bootstrap-combobox/index.html

我问的问题属于下面的"最后一个选项":注意:我在Rails中构建这个,所以ruby代码会很好...

占位情况:

我需要每个下拉列表都有一个灰色的默认占位符文本.

例如:

国家:| _ USA __ _ __ _ _ |

州:| _ IOWA __ _ __ _ |

城市:| _ DES MOINES ____ |

遗漏价值案例:

如果用户键入自动填充中不存在的城市值,我想向他们显示带有链接的下拉列表.

例如:用户在城市字段中输入"yahoo".这应该导致输出"那个城市不存在,点击这里搜索它"

点击上面的文字可以将我重定向到Google.com

错误案例:

如果在第一个字段(国家/地区)中未选择任何内容,则第二个字段在下拉列表中应具有默认值:"请选择要开始的国家/地区"

最后选项:

成功选择城市后,例如:旧金山...我想重定向到一个新的html文件,如"mysite.com/datastore/calsan.html"(每个选项的前三个字母以小写形式附加在一起)

这个最终的html文件将被预先生成,并将有关于城市"旧金山"的相关统计数据和有趣的事实...我还将为数据存储文件夹中预生成的其他城市提供有趣的事实.

Answer 1

请参阅下面的我的代码段

占位情况

<script type="text/javascript">
  $(document).ready(function(){
    $('.combobox').combobox({placeholder: "Type Something.."});
  });
</script>

最后的选择

<script type="text/javascript">
    $('.combobox').change(function(){
      if($(this).val().length > 0){
        var fileName = $(this).val().substr(0,3); // this is for getting the first 3 characters, apply the same logic wherever necessary
        window.location("/datastrore/" + fileName + ".html");
      }   
    })
</script>