Tag: backbone.js

不可能的骨干僵尸

我一直在努力调试我的Backbone多页面应用程序，以摆脱“僵尸”，但遗憾的是无济于事。 在今天之前，我甚至没有意识到我有一个僵尸问题 。 我究竟做错了什么？ 这是我的RegionManager： var regionManager = (function() { var currView = null; var rm = {}; var closeView = function(view) { if (view && view.close) { view.close(); } }; var openView = function(view) { view.render(); if (view.onShow) { view.onShow(); } }; rm.show = function(view) { closeView(currView); currView = view; openView(currView); }; return rm; […]

Backbone js Model保存多次

我学习了Backbone js，所以我开始创建示例应用程序。 顺便说一句，我现在面临一个问题，即模型在我的数据库中保存了不止一次。 我的意思是当你点击“ 创建用户 ”时，你会看到一个表单，所以当我点击“创建用户”按钮时，我的数据库中的详细信息会被多次保存，因此主页中会显示所有重复的用户信息。 实际上我试图练习这个video： https://www.youtube.com/watch?v=FZSjvWtUxYk ： https://www.youtube.com/watch?v=FZSjvWtUxYk 输出看起来像这样： http://backbonetutorials.com/videos/beginner/#/new ： http://backbonetutorials.com/videos/beginner/#/new 这是我的代码： /*$.getJSON(‘api/users/1’,function(data){ console.log(data); });*/ User Manager New User First Name Last Name Age Create User First Name Last Name Age var UsersList = Backbone.Collection.extend({ url: ‘api/users’ }); var User = Backbone.Model.extend({ urlRoot: ‘api/users’ }); var UsersListView = Backbone.View.extend({ el: ‘.page’, render: […]

页面多次刷新/重新加载

我正在学习JavaScript和backbone.js并尝试开发一个小型Web应用程序。 但问题是我的页面（图形）被重载多次（超过预期）。 因此页面会在页面稳定并显示图形之前自动重新加载（超快）页面。 当我说“重新加载浏览器”时，我的意思是说谷歌浏览器刷新图标的重新加载图标会多次刷新/（正向旋转，向后旋转），最后显示数据。 以下是我迄今为止尝试过的简短版本。 由于我处于学习阶段，我可能没有制定正确的编码标准。 请耐心等待我。 所以，我必须在首页上显示一个图形（稍后我需要在同一页面上添加更多图形）。 该图的数据来自REST服务。 HTML： 我有一个锚点和一个模板来显示图形数据。 视图模型 这是针对图表特定的数据： var firstSubViewModel = Backbone.View.extend({ template: _.template($(‘#myChart-template’).html()), events: { ‘click .Refresh’: ‘fetchModelData’ }, fetchModelData: function() { this.model.initialize(); }, render: function() { $(this.el).html(this.template()); var ctx = $(this.el).find(‘#lineChart’)[0]; var lineChart = new Chart(ctx, { type: ‘line’, data: { labels: [“Jan”, “Feb”, “Mar”, “Apr”, “May”, “Jun”, […]

使用requireJS for plugin将多个函数导出到jquery

我正在尝试使用requireJS 将此库/插件添加到jquery。 我看过文档和其他SO问题，我仍然无法弄清楚出了什么问题。 使用backbone和require作为例子：我很确定我需要在main.js文件中使用shim。 我也很确定我还需要在我想要使用的特定文件中加载插件（即使我实际上并没有在函数体中使用rangyInputs对象）（我这样做）骨干）。 真的，我只想将rangyInputs库中的函数绑定到jquery一次，然后只需要在我需要这些函数的所有文件中使用jquery。 define([ ‘jquery’, ‘underscore’, ‘backbone’ , ‘views/listView’ , ‘sockets’ , ‘collections/nodesCollection’ , ‘views/listView’ , ‘models/node’ , ‘rangyInputs’ //I define the path to this like I do the path for backbone in main.js ], function($, _, Backbone, ListView, io, nodesCollection, listView, nodeModel ,rangyInputs){ 最小化的图书馆最后有这个： $.fn.extend({ getSelection: jQuerify(getSelection, false), setSelection: jQuerify(setSelection, true), […]

Backbone按ID删除行

我正在尝试使用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) […]

Backbone.js – 导航时出现404 jQuery错误

导航没有按照我的预期工作，当我触发goToTournament（见下文）时，当前视图只是重新渲染，我在控制台上找到了jQuery 404 not found错误。 URL正在适当更改，并且还会触发正确的路由方法。 // js/views/home.js define([ ‘jquery’, ‘jquerym’, ‘underscore’, ‘backbone’, ‘models/tournaments/featured’, ‘collections/home’, ‘text!/templates/home.html’ ], function($, JQM, _, Backbone, FeaturedModel, HomeCollection, homeTemplate) { var HomeView = Backbone.View.extend({ el: $(‘#site-main’), events: { ‘click .tournament’: ‘goToTournament’ }, initialize: function() { this.render(); }, render: function() { var homeCollection = new HomeCollection(); homeCollection.fetch({ success: function() { var data […]

骨干牵线木偶复合视图渲染模板

我正在尝试使用Marionette CompositeView呈现列表。 我不确定为什么渲染列表只有一个显示单词result的项目。 我期待第一个项目显示Level 1 。 这是我当前代码的小提琴： http ： //jsfiddle.net/16L1hen4/ 这是我的JS，模板和数据： JavaScript的： var App = new Backbone.Marionette.Application(); App.addRegions({ mainRegion: ‘#main’ }); var TreeModel = Backbone.Model.extend({ }); var TreeCollection = Backbone.Collection.extend({ model: TreeModel, url: ‘https://api.mongolab.com/api/1/databases/backbone-tree/collections/tree?apiKey=somekey’ }); var TreeView = Backbone.Marionette.CompositeView.extend({ initialize: function() { console.log(this.collection); }, tagName: ‘ul’, template: _.template( $(‘#tree-template’).html() ) }); var treeCollection = new […]

使用自定义布局和变量no字段与骨干表单

我正在开发一个应用程序，我在其中使用backbone-forms.js来生成动态表单。 所以目前我们能够生成具有这样的标签和输入元素的简单forms 但实际上我必须改变字段的排列。在每一行中我将有一个标签，两个输入字段。 所以我想问一下，是否可以使用骨干表单动态生成这样的表单。 如果我们将使用完整的自定义模板，那么使用此框架没有任何意义。 因此，可以仅为一行提供html并基于同一模板生成其他行。 如果可以生成这样的forms，我们将如何将其值设置为fieldname id class等到第三个字段。 请建议。

Backbone，我应该使用sync还是JQuery？ 我可以听吗？

在前端使用Backbone的Rails应用程序。 基本上我希望用户输入一个字符串并点击提交按钮。 单击该按钮后，将更新两个视图。 我从SO用户那里得到了很多帮助，但遇到了另一个问题。 以下是详细信息： 我有两个模型，Publication和Article（带有相应的Rails模型）。 我正在使用gem（Feedzirra）来解析用户输入的RSS URL。 所以我将url发送到/ publications并使用返回的数据我可以获取id，这样我就可以将它用作POST到/ articles的输入。 现在是重新渲染两个视图的时候了。 起初我尝试使用Backbones .sync函数来发出POST请求，并让视图监听更改并相应地更新。 但是，因为我需要来自一个请求的数据，所以我可以将它提供给下一个请求，我必须使用$ .post（）而不是.sync。 这主要是因为我不太了解如何使用.sync。 这可以使用.sync吗？ 这是Backbone中的Article视图： SimpleGoogleReader.Views.ArticlesIndex = Backbone.View.extend({ template: JST[‘articles/index’], el: ‘#article’, events:{ ‘click #new_feed’: ‘createFeed’ }, initialize: function() { this.listenTo(this.model, “sync”, this.render); }, render: function(){ this.$el.html( this.template({articles: this.model.toJSON()}) ); return this; }, createFeed: function(e){ e.preventDefault(); var feed_url = $(‘#new_feed_name’).val(); $.post(‘/publications’, […]

如何在执行另一个函数之前等待函数完成

我正在使用selecter jquery 。 我通过键入代码来初始化它 $(“select”).selecter(); 在开始添加元素之前，我需要确保formstone selecter jquery库已经完成。 所以我所做的就是使用$.when函数 initialize: function(){ $.when($(“select”).selecter()).then(this.initOptions()); }, initOptions: function(){ this.$el.find(‘.selecter’).addClass(‘something’); } 但这不起作用。 在执行另一个函数之前，我如何等待formstone selecter正在做它的事情？ 谢谢， UPDATE 这是我所做的更新，但它不起作用。 initialize: function(){ $(“select”).selecter({callback: this.initOptions }); }, initOptions: function(){ this.$el.find(‘.selecter’).addClass(‘something’); }