我正在尝试使用Backbone删除表中的行。我正在为这个项目使用Rails 4和backbone-on-rails gem。
我正在使用addEntryevent在我的Movies表中添加行。这会添加一个包含id,movie_title和user_id的新行。
索引视图
class Movieseat.Views.MovieseatsIndex extends Backbone.View
template: JST['movieseats/index']
initialize: ->
@collection.on('update', @render, this)
@collection.on('add', @appendEntry, this)
render: ->
$(@el).html(@template())
@collection.each(@appendEntry)
this
events: ->
"click li": "addEntry"
"click .remove": "removeEntry"
addEntry: (e) ->
movie_title = $(e.target).text()
@collection.create title: movie_title
removeEntry: (e) ->
thisid = @$(e.currentTarget).closest('div').data('id')
console.log thisid
@collection.remove thisid
appendEntry: (entry) ->
view = new Movieseat.Views.Entry(model: entry)
$('#entries').append(view.render().el)
当我点击.remove元素时,我得到一个控制台日志结果,显示存储在我想删除的元素中的id。
条目视图
class Movieseat.Views.Entry extends Backbone.View
template: JST['movieseats/entry']
className: 'movie-frame'
render: ->
$(@el).html(@template(entry: @model))
this
这是我的index.jst.eco模板
<h1>Movies</h1>
<div id="entries"></div>
这是我在index.jst.eco模板中呈现的Entry模板(我正在这样做,所以我只会重新渲染添加到视图中的电影。
<div class="movie-frame" data-id="<%= @entry.get('id') %>">
<p><%= @entry.get('title') %></p>
<p class="remove">Remove</p>
</div>
我的Backbone路线,
class Movieseat.Routers.Movieseats extends Backbone.Router
routes:
'': 'index'
initialize: ->
@collection = new Movieseat.Collections.Movieseats()
@collection.fetch()
index: ->
view = new Movieseat.Views.MovieseatsIndex(collection: @collection)
$('#container').html(view.render().el)
但是当我点击.remove元素时,没有网络活动。触发addEntry事件时会有网络活动。
答案 0 :(得分:1)
显然@collection.remove
没有发出HTTP请求。将此更改为@collection.get(thisid).destroy()
可以解决问题。但是你仍然需要在Rails控制器中创建一个destroy方法,
Backbone视图索引中的removeEntry事件,
removeEntry: (e) ->
thisid = @$(e.currentTarget).closest('div').data('id')
@collection.get(thisid).destroy()
Rails控制器中的destroy方法,
def destroy
movie = Movie.find_by_id(params[:id])
movie.destroy
respond_to do |format|
format.json {render :json => {:msg => "item deleted!"},:status => 200}
end
end