Question

是CoffeeScript的新手。我正在构建一个使用coffeescript来构建和呈现html页面的应用程序。我使用visual studio来构建应用程序。我使用SQL Server 2012创建了一个数据库和一些存储过程。

我的问题是如何从SQL Server上实现的存储过程中将数据填充到“select”元素（或您可能称之为下拉列表）中。从我读过的内容来看，无法从javascript调用存储过程。我该如何实现这一点。我试图遵循数据驱动的设计，不想手动填写数组中的选项。我希望它在下拉列表中在页面加载时自动填充。我尝试进行ajax调用并从我在控制器中定义的url请求。但它似乎没有用。有帮助吗？我没有包含代码的原因是因为我试图使用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”数组中的选项。目前，我正在硬编码我不想要的数据，而不是数据驱动的数组。希望这有助于解决如何解决问题。

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

0 个答案: