0

实际上,我在使用渲染模板添加动态内容时遇到了问题。

弹出框调用:

$(selectorId).popover({
        placement: 'bottom',
        title: 'New Post',
        html: 'true',
        content: _template,
        container: 'body',
});

呈现的 HTML 模板

<div>
     <label>Name</label><input type="text" name="name" id="name" />
     <label>Message</label><input type="text" name="message" id="messgae" />
     <label>Select Article</label><select name="article" id="article"></select> 
     <input type="button" value="submit">
</div>

只需要专注于“文章”。选择框在模板中为空,渲染后我试图附加文章数据,但它不起作用。

将数据库中的数据附加到选择框

$.each(articles,function(){
   $("#article").append(this.articleName);
});    

文章是一个 JSON 数组

[
  {
       'id': 1,
       'articleName': 'article1'

  },
  {
       'id': 2,
       'articleName': 'article2'

  },
  {
       'id': ,
       'articleName': 'article3'

  }
]

问题:选择框显示为空。

目标:无论何时打开弹出框,用户都可以从选择框中选择文章。

4

1 回答 1

0

您将文章名称附加到选择框,而您应该将选项附加为 html

所以它应该是这样的:

$.each(articles,function(){
   $("#article").append("<option value='"+this.articleName+"'>"+this.articleName+"</option>");
});  

更新:

另一个问题可能是您尝试将选项附加到选择框,而它在页面上尚不存在。因此,如果您将模板附加为字符串(通过“内容”属性),您最初可以使用必要的选择选项来编写模板:

var _template = "<select>";
$.each(articles,function(){
     _template +="<option value='"+this.articleName+"'>"+this.articleName+"</option>";
};
_template+= "</select>";

或者您也可以使用“容器”属性并通过

于 2013-06-18T07:42:14.337 回答