In backbone.js, I often encounter the issue where my attributes are saved as nil when I create a

Whenever I try to add a new affiliate, the information is saved in the database but without a name. I have been struggling to fix this issue for quite some time now.

class Shop.Views.AffiliatesNew extends Backbone.View

  template: JST['affiliates/new']

  events:
    'submit .form-container': 'addAffiliate'

  initialize: ->
    @collection.on('reset', @render, this)
    @collection.on('add', @render, this)

  render: ->
    $(@el).html(@template(affiliates: @collection))
    this

  addAffiliate: (event) ->
    event.preventDefault()
    @collection.create({
      name: $('#first').val()
      })

    <input type="text" name="name" id="first"/> <br />
          .form-title 

          .submit-container
            <input id="affiliate-button" type="submit" value="Submit" />

Answer №1

Consider implementing classes instead of IDs for your input fields. Having multiple instances of #first on the page could result in only the first one being recognized (depending on the browser).

An alternative approach is to limit the search scope within the view by using this.$el.find(<selector>)

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

Tips for integrating an HTML template into a React project

I'm finding it challenging to integrate an HTML template into React. The template I am using is for an admin dashboard with multiple pages. I have successfully copied and pasted the HTML code into JSX files and fixed any syntax issues. Here's wh ...

Checking if the current time falls within a specific range while also taking minutes into account

I am currently working on a website for restaurants offering home delivery services. I need to enable or disable the 'Order Now' button based on the designated home delivery timings of each restaurant. For this purpose, I have access to the star ...

The API request for /api/auth/callback/credentials was resolved successfully, but no response was sent back. This could potentially lead to delays

When attempting to log in with Talend API Tester, I encountered the following message in the terminal: API resolved without sending a response for /api/auth/callback/credentials, this may result in stalled requests. Additionally, here is the screenshot ...

The array.slice() method fails to work properly when I try to start it from any index other than 0

I am currently working with an array called $scope.results which contains 8 objects. I have also created a custom simple pagination and a function called selectAll() that I'm trying to get to work together. Please refrain from suggesting the use of b ...

Changing images dynamically in tinymce using JavaScript

When using the tinymce editor, I attempt to modify my images. I currently have an image within it and I am trying to dynamically change the path of this image with: tinymce.activeEditor.selection.getNode().src = '/my/path/' Surprisingly, this m ...

What is the solution for fixing the [$injector:unpr] error in AngularJS?

I've recently started learning AngularJS and I'm encountering an issue with injecting a service from another file. Despite trying various methods, nothing seems to be working. Here's a snippet from my index.html: ` <!DOCTYPE html> &l ...

Difficulty triggering an event within a collection in Backbone.js

Having recently delved into JavaScript and Backbone, I encountered a puzzling error. Router = Backbone.Router.extend({ routes: { ":albumID": "load" }, load: function (albumID) { if (controller.collectionInitialized == true) ...

Setting up various connections is made possible through Node.js Socket.io

In the process of developing a straightforward chat application using socket.io and incorporating passport.js for user authentication, an issue arises when users log out and then back in. The previous socket connection remains active, resulting in two conn ...

Having trouble sending data to API with Node, Express, and vanilla JavaScript POST form

I am currently utilizing Node JS along with Express JS in order to implement a form submission that pushes data into the database. Below is my form structure <form action="/pokedex/register/poke_submission" method="POST"> ...

Changing a JavaScript string into an array

I have extracted an array of objects from a hidden HTML input field and received the following string: "{"id":"1234","name":"john smith","email":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="dab0a9b7b3aeb29ab8b6bbb2f4b9b5b7" ...

Exploring the scope in JavaScript functions

Looking at this small code snippet and the output it's producing, I can't help but wonder why it's printing in this unexpected order. How can I modify it to achieve the desired output? Cheers, The desired result: 0 1 2 0 1 2 The actual r ...

What is the best way to eliminate the space underneath a graph?

Despite trying multiple solutions, I'm still struggling to remove the excess blue space below the graph that appears when clicking the submit button. Any insights into what might be causing this issue? JSFIDDLE Below are the CSS styles related to t ...

Having trouble retrieving JSON data using ajax

I am currently working with JSON data that is being generated by my PHP code. Here is an example of how the data looks: {"Inboxunreadmessage":4, "aaData":[{ "Inboxsubject":"Email SMTP Test", "Inboxfrom":"Deepak Saini <*****@*****.co.in>"} ...

How to execute a system command or external command in Node.js

I am encountering an issue with Node.js. When using Python, I would typically perform an external command execution like this: import subprocess subprocess.call("bower init", shell=True) Although I have explored child_process.exec and spawn in Node.js, I ...

Save user entries in a database array

I'm working on developing a platform for advertisements where users can create detailed profiles with images. To achieve this, I need to store the information in an array within a backend database for future retrieval. Below is an example of the backe ...

What is the best way to show the interior color of a cube in three.js?

My plan is to create a room using THREE.js starting from a basic cube. Here's what I have written so far: function loadModelcube() { console.log("Function executed successfully"); cube.traverse( function( node ) { if( node.material ) { ...

What is the reason for calling Proxy on nested elements?

Trying to organize Cypress methods into a helper object using getters. The idea is to use it like this: todoApp.todoPage.todoApp.main.rows.row .first().should('have.text', 'Pay electric bill'); todoApp.todoPage.todoApp.main.rows.ro ...

Using a Hook inside a React function is not possible

I encountered an error message known as the "invalid hook call error" while using the useEffect hook in my code. According to the documentation, this issue usually arises due to either a version mismatch or incorrect function calls. Could someone kindly r ...

Having trouble loading images in JavaScript due to an issue with JSON: undefined.jpg not found

I'm struggling to concatenate my image names in this JavaScript code as a newbie, especially since it's pulling from JSON. Any assistance would be greatly appreciated! Below is the JS code snippet I'm working with: function log(msg){ ...

Displaying a loading spinner in a Rails application's div tag

When I upload text to my Rails app, it undergoes processing such as adding tags which takes a few seconds. I envision having a "Processing div" similar to what occurs when submitting a query on Orbitz. What is the most effective method to achieve this? ...