Backbone - First render client views before creating them upon saving

I'm completely stumped on how to make this work. I can successfully create the models, but running create or anything else on them afterwards seems impossible. It's been 6 long hours of trying and failing... Can someone please point out where I'm messing up? :(

1) Begin by creating a WorkflowCollection

this.workflows = new WorkflowCollection();
and set workflows.length = 0.

2) Now, add empty workflows for each workflow id (var workflow = [1,2,3]):

for(var i =0;i<workflow.length;i++;) { 
       this.workflows.add(new Workflow({fk_workflow_id: workflow[i]})); 
}

3) Update workflows.length = 3. Next, render the views for the current workflows:

var self = this; 
this.workflows.each(function(model) {
       self.renderView(model.get("fk_workflow_id"), model);
});

The renderView function, for instance, triggers:

if(this.kit) this.kit.close();
        this.kit = new Workflow.PostageView({
            model: model
        // posView may change el? check later
        });

4) Attempting to fetch new data for updating the view's models. BUT IT'S NOT WORKING.

this.workflows.fetch({
    success: function () {
        self.workflows.each(function (model) {
            self.renderView(model.get("fk_workflow_id"), model);
        });
    }
});

5. Trying to save a model:

FileApp.workflowRouter.pos.create is not a function

What could be preventing access to create?! Check out the complete code: http://jsfiddle.net/8upZK/

Answer №1

Oh no! It took me 6 hours to realize that I should have been utilizing the COLLECTION for creating/updating instead of the view. I can't believe I chose the view (step 5).

For example, FileApp.workflowRouter.workflows.create(). Always create/add to a COLLECTION, not a view. What a silly mistake.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How do I utilize the emit() method in the Alexa-SDK to retrieve and return multiple objects within a JSON array?

I am facing an issue with the emit() method in the Alexa-SDK while trying to retrieve multiple account id's from a JSON array. The problem is that it is only emitting one of the values instead of both. How can I modify the emit() method to return both ...

When collapsing an accordion, Bootstrap radio buttons fail to properly select

I have attempted various methods to achieve the desired functionality of having the accordion content close and open accordingly when checking a radio button, while also having the button visually appear as 'checked'. For a more in-depth example, ...

Displaying JSON data within a div section using Ajax and jQuery is not possible

I have generated a JSON in a specific format from an external PHP file: [ { "title": "Welcome!", "description": "The world has changed dramatically..", "image": "img/strawberry-wallpaper.jpg" } ] I am trying to use this data to populate a par ...

Guide to making a sliding animation appear when hovering over a menu using jQuery

I have noticed a common feature on many websites, but I am unsure of how to explain it. At times, there are sliding elements in the navigation, like an arrow under menu items that moves when the user hovers over different links. Here is an example of a s ...

Using JQuery to delete data from a cookie

I have a delicious cookie that I want to savor before removing one element from it based on the widget ID. if (thisWidgetSettings.removable) { $('<a href="#" class="remove">CLOSE</a>').mousedown(function (e) { ...

Troubleshooting PHP and jQuery AJAX: Why is $_POST always empty?

I'm struggling to display the $_POST value in an alert box using jQuery AJAX function. However, the $_POST value from my PHP controller always turns out to be empty, resulting in an empty array in the response. My setup includes PHP version 5.5 and j ...

Angular 1.4.8 Issue: [$injector:modulerr]

I can't seem to identify the main cause of this error. I consistently see a green underline below the word angular in my javascript file. I'm not sure why. (Using Visual Studio Code) HTML <html ng-app="myapp"> <head> ...

Unknown CSS element discovered: bootstrap, gradient, carousel

I recently created a random quote app using javascript, jQuery, and bootstrap on Codepen. Everything worked perfectly there. However, when I organized the files, pushed them to git, and tried to view the app from Safari, I encountered some warnings and t ...

Saving text as an array with: Mongoose, MongoDB, and SimpleDB-mongoose

Within my schema, I define the following: Links: [] When working with a post request in Node.js, my code looks like this: app.post('/add', function (req, res) { var newItem = new db.Item({ Links[0]: req.body.Link1 Links[1]: req.bo ...

Ember 2: Display a loading message only if the IDs were part of the initial response

I frequently use the following code snippet in my projects: {{#each model.posts as |post|}} <div>post.title</div> {{else}} <div>Loading the posts...</div> {{/each}} However, I sometimes face uncertainty regarding whether t ...

Implementing SweetAlert2 in Vue.js to create a modal prompt for confirmation prior to deleting an item

I'm encountering an issue with sweetalert2 while using Laravel Vue for my app development. My goal is to have a confirmation modal pop-up when deleting a row from the database. However, whenever I click "Yes", the item is successfully removed. But if ...

Conceal the item and reveal it upon clicking

There are three div boxes included in a rotator script. However, when clicking on the right button, all three boxes appear overlapping each other instead of showing one at a time. How can I make it so that only one box is shown and the others appear upon c ...

Angular is not programmed to automatically reflect updates made to my string array

let signalRServerEndPoint = 'https://localhost:44338'; this.connection = $.hubConnection(signalRServerEndPoint); this.proxy = this.connection.createHubProxy('MessagesHub'); this.proxy.on("ReceiveMessage", (message) => { ...

Utilizing the powerful slice function within Lodash

I am looking to create a function that takes an array and a number as input. If the number is positive, the function should place it at its corresponding index within the array. For example, if we have an array of 1,2,3,4,5 and the number 2, it should be p ...

How to send a PHP variable to Ajax and execute a corresponding PHP function in response

I have a set of database records that are being displayed in separate div elements on the page. Each record corresponds to a specific ID, with its information displayed inside the div. My goal is to create a delete button for each record that would allow ...

Ways to fix the issue of an unspecified user error in authjs

Having trouble with creating a web token using passport LocalStrategy and passport-jwt. I keep getting a user undefined error in auth.js ****401 Unauthorized**** (if (!user) { return res.json(401, { error: 'message' });}). How can I fix this issu ...

Ways to display notifications when the user is not actively browsing the website?

How can websites display notifications even when the user is not actively on the site? Take Facebook messenger, for instance. Even with the page closed, notifications still pop up. The same goes for Twitter, which also sends push notifications. I ...

Discovering the technique to unearth a specific value within an array nested within another array

I am encountering an issue with finding a value in one array inside another array and utilizing the resulting value to update the state using setState(). Here is the initial state: this.state = { initialStudents:[ {name:"str1",tags;["str","s ...

Utilizing Dojo DGrid to customize the appearance of data within cells

I am facing an issue with my dgrid where I want to style cells by underlining the text when the checkboxes are selected for the row. My initial approach was to add a CSS class to the item once the checkbox is checked for the row. However, this method did ...

Warning message will appear before navigating away from the page if vee-validate is

Wondering how to create a simple confirmation prompt asking if the user really wants to leave a page that includes a basic HTML form. The HTML Form: <!DOCTYPE html> <html> <head></head> <body> <div id="app"> ...