使用coffeescript/javascript将数据填充到存储过程的下拉列表中

我不熟悉咖啡脚本。我正在构建一个应用程序，它使用coffeescript来构建和呈现html页面。我正在使用VisualStudio构建应用程序。我使用SQL Server 2012创建了一个数据库和一些存储过程

我的问题是如何将数据填充到select元素或下拉列表中，您可以从SQLServer上实现的存储过程中调用它。从我所读到的内容来看，不可能从javascript调用存储过程。我该如何实施这一点。我试图遵循数据驱动的设计，不想手动填写数组中的选项。我想它的下拉列表时，自动填写页面加载。我试图通过控制器中定义的url进行ajax调用和请求。但它似乎不起作用。有什么帮助吗？ 我没有包含代码的原因是因为我试图使用OOP模式，而这是一个很大的代码。但是，对于代码片段，我可以提供我的coffeescript代码，如下所示：

class NewInput
 constructor: (arg)->
    @type = arg.type
    @remove = arg.remove
    @onChangeHook = arg.onChange
    @data = arg.data ? {}
    @setInputs()
 setInputs: ->
    fields = {}
    fields.type = new SelectInput
        name: "Type"
        opts: ["All", "TV", "Computer", "Phone"]
        get: => @data.ModelType
        set: (val)=>
               @data.ModelType = val
               @onChange()
 onChange: ->
     if @validated
        @valid()
    @onChangeHook()
 valid: -> 
    @validated = true
    # Logic to check if the fields are blank or not etc.

这里，SelectInput是我创建的一个新类，用于使用coffeescript创建下拉列表。正如我提到的，我没有使用HTML来创建页面。相反，我使用coffeescript创建元素

class SelectInput
 @draw: (arg)->
    new SelectInput(arg).draw()
 constructor: (arg)->
    @name = arg.name
    @opts = arg.opts
    @get = arg.get
    @set = arg.set
 draw: ->
    val = @get()
    select = Crt.ce "select"
    select.className = "quote-select"
    select.appendChild @genOpt
        name: @name
        dimmed: true
    for opt in @opts
        select.appendChild @genOpt
              name: opt
              selected: 
                opt == val
    @$select = $ select
    @setEvents()
    select
 setEvents: ->
    @$select.change => @change()
 change: ->
    val = @$select.val()
     val = null if val == @name
    @set val
 genOpt: (arg)->
    name = arg.name
    selected = arg.selected
    dimmed = arg.dimmed
    opt = Crt.ce "option"
    opt.className = "quote-select-option"
    opt.className += " dimmed" if dimmed
    Crt.atn opt, name
    opt.value = name
    opt.setAttribute "selected", "selected" if selected
    opt
 isBlank: ->
    blank = @$select.val() == @name
    if blank
        @$select.addClass "invalid"
    else
        @$select.removeClass "invalid"
    blank
 forceHL: (bool)->
    return if !@$select
    if bool
        @$select.addClass "invalid"
    else
        @$select.removeClass "invalid"

上面，Crt.ce代表createElement，Crt.atn代表appendTextNode。dimmed是在css中声明的一个类，用于将选择名称保持为与选项不同的颜色

---

所以，我的问题是如何使用存储过程填充opt数组中的选项。目前，我正在硬编码我不想要的阵列，它不是数据驱动的。希望这对我如何解决这个问题有所帮助。

你是对的，你不能从基于浏览器的javascript访问SQL实例，你需要一个服务器端语言。听起来在你对问题的理解和解决方案之间有很多问题需要回答。可能从谷歌搜索“asp.net web framework”或“节点web framework”开始。使用meteor.js这样的web框架可能会使这条线变得模糊一些。投票结束，因为这太模糊了。@JedSchneider好吧，我用coffeescript作为前端。C表示中间层服务器，SQL Server表示数据库。问题是我没有使用纯html来创建select元素，因为我可以使用数据绑定填充选项，所以创建select元素更容易。但是使用coffeescript，我已经为option的值创建了一个数组，这正是我试图填充的。您可以通过html模板解决方案呈现select选项，或者如果希望动态填充它们，可以通过ajax请求它们。ajax调用将需要在您的服务器上安装一个和端点。这些都不是特定于coffeescript的。@JedSchneider正如我在问题中提到的，我已经尝试实现ajax调用，并且还定义了一个端点。在控制器类中也实现了这一点。但它似乎不起作用。我问咖啡脚本的原因是，如果有不同的方法来做同样的事情。与JavaScript相比，Coffeescript提供了一些优势。因此，与之相关的ask.coffeescript不提供任何特定的库扩展。它只为克服javascript中常见的开发模式提供语法支持。我可能会先发布你的代码，这样我们就可以知道为什么它不起作用了。这通常是SO工作得最好的方式。