The Backbone Model is producing unspecified data

Having crafted a backbone model, it looks like this:

var note_model = Backbone.Model.extend({
    default    : {
        HistoryKey  : "",
        InsertDate  : "",
        MemberKey   : "",
        NoteDate    : "",
        ContactNote : "",
        UserId      : ""
    },
    initialize : function(note) { 
        this.HistoryKey  = note.historykey;
        this.InsertDate  = note.insertdateUTC;
        this.MemberKey   = note.memberkey;
        this.NoteDate    = note.notedateUTC;
        this.ContactNote = note.contactnote;
        this.UserId      = note.userid; 
        console.log(this.get('HistoryKey'));
    }
});

Next, I have established a collection with a defined URL and populated the model using the fetch method of the collection. However, every time I attempt to access the model data using 

model_object.HistoryKey

I can retrieve the data just fine. But when attempting to use 

model_object.get("HistoryKey")

I receive an undefined value. The JSON data structure is as follows

    {
        "historykey": 4,
        "insertdateUTC": "2013-11-15T23:21:44.247",

    }

Interestingly, if I utilize 

model_object.get("historykey")

The data comes through properly. So my question remains, why am I unable to retrieve the data using member.get("HistoryKey")?

javascriptjsonbackbone.js

Answer №1

For proper functionality, utilize 

this.set("HistoryKey", note.historykey)
within the initialize function. By doing so, you are correctly assigning an attribute to the Backbone model instead of just setting a property on the object. If you were to include console.log(this.HistoryKey) in the initialize method, you would receive the desired value. For more information, refer to:

Answer №2

When working with your model, it's recommended to utilize the set function to modify attributes:

this.set('HistoryKey', data.historykey);
this.set('InsertDate', data.insertdateUTC);
this.set( 'MemberKey', data.memberkey);
this.set('NoteDate', data.notedateUTC);
this.set( 'ContactNote', data.contactnote);
this.set('UserId', data.userid);

For retrieving properties, you can use the get method.

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

Transmitting JSON data in Rails using a POST request

I have a question that I hope someone can help me with. My understanding of how these applications work is quite basic and I'm trying to fill in the gaps in my knowledge. Here is a breakdown of how the applications function: 1: i: The web app generat ...

ruby-on-railsrubyjsonrestpost

NgFor is failing to display data from a fully populated array of objects

CLICK HERE FOR THE IMAGE So, let's tackle the issue at hand. I have an array that contains data fetched from an API. These data points are essentially messages. Now, below is the TypeScript file for a component where I aim to display all these messag ...

javascripthtmlangular

The JSON retrieval process using AJAX and a PHP proxy encounters an error at the %20 character

I am facing a minor issue. I am making an AJAX call to fetch JSON data using a PHP proxy hosted on my website. Everything works smoothly, but whenever there is an argument with a space, it gets encoded as %20 and I receive the following error: {"status":{ ...

phpajaxjson

What is the reason behind the browser permitting cross-origin POST requests but not PUT requests?

Let's consider a straightforward example of utilizing the XMLHttpRequest. The following code snippet functions correctly (you can verify in the network tab or by navigating your browser to http://requestb.in/yckncpyc) despite displaying a warning in ...

javascriptajaxbrowsercross-browser

Using Styled components and react-router-dom v6 to emphasize the active navigation link upon clicking

I'm just starting out with react and I am trying to figure out how to keep my hover style active while the current page is open. I think I need to set a condition but I am not sure how. const StyledLi = styled.li` `list-style: none; displa ...

javascriptreactjsreact-router-domstyled-components

Ways to display the modal once the user initiates the action

Is there a way to delay loading my modal HTML codes until after the user clicks a button, rather than having them load automatically with the template? HTML <!-- Template Codes--> <button data-toggle="modal" data-target="#modal-content" type="bu ...

javascriptjqueryhtmlangularjs

extraction of information from an object within an array

I am working with an array of objects containing certain keys and values. My goal is to organize these objects by key and then display all the values associated with each key together. [ { '18': 'x' }, { '17': 'y' ...

javascriptnode.js

Angular2-starter configuration setup with environment-based variables (such as .env or .conf) for testing and production settings

Frameworks like PHP Laravel often include files for local configuration, separate from dev, test, and production environments. How can a configuration file be provided for an angular-starter project that contains all local environment variable values (su ...

javascriptangulartypescriptenvironment-variablesconfig

Decomposition of words in VueJS based on numerical values

Is there a way to handle word declension based on the number of items in VueJS? For example, displaying "0 skins", "1 skin", "2 skins", "3 skins", "4 skins", "5 skins", and so on. I currently have a basic code snippet with hardcoded text: <div class=&q ...

javascriptvue.jsobjectvuejs2vue-component

Node.js: Extracting parameters from the URL

When working with Rails, I make a POST request to my server: response = Typhoeus::Request.post("http://url.localtunnel.com/request?from=ola&to=ole") result = JSON.parse(response.body) Now in my Node.js application, I need to retrieve values for From ...

javascriptnode.jscoffeescript

Creating a Timeless Banner with the Magic of `background:url()`

I have a banner placed within a div tag that displays my banner image. I am trying to create a fading effect when transitioning to the next image, but I am struggling to achieve this. I attempted to use jQuery fadeIn(), however, it did not work as expected ...

javascriptjquerycss

Encountering module error 'internal/fs' after updating to Node 7

We have encountered some challenges after attempting to update our build server to node v7.0.0. Specifically, the application build task fails at the "bower_concat" step with the following error message: Loading "bower-concat.js" tasks...ERROR Error: Cann ...

javascriptnode.jsnpmgruntjsbower

The useEffect hook is triggering multiple unnecessary calls

Imagine a tree-like structure that needs to be expanded to display all checked children. Check out this piece of code below: const { data } = useGetData(); // a custom react-query hook fetching data from an endpoint Now, there's a function that fin ...

javascriptreactjstypescriptreact-hooksreact-query

Managing State Changes with Redux

Reducers in Redux are primarily designed to be pure functions that take the previous state and an action as arguments, and return a new state object without mutating the previous state. However, it is still possible for developers to directly mutate the st ...

javascriptreduxreducersmutation

Access to data retrieval was restricted by CORS policies on my Node.js/Express REST API server

I am currently running a localhost node/express server that is designed to accept any post request with a body and then return the same body along with a message. To enable Cross-Origin Resource Sharing (CORS), I have integrated the cors node package into ...

javascriptnode.jsexpresscorsfetch

Selenium Refuses to Launch My Local Browser Despite Explicit Instructions

While using Chrome browser with selenium, I encountered an issue related to browser profiles. Everything works smoothly when the correct binary path is provided, but if an incorrect path is given, it refuses to run. The specific problem arises when the br ...

javascriptselenium-webdriver

Center the popover over the element

I am in the process of creating a resource map using SVGs. My goal is to display a popover in the center of the element when a user clicks on it. However, due to CSS rotation of the map, the traditional techniques such as the one mentioned here have not be ...

javascriptjqueryhtmlcss

What is the best choice - Json or Xml for Silverlight development?

Currently, I am connecting with multiple services through a SL component using both TCP sockets and HTTP web requests. We are in the midst of a discussion regarding what data format to utilize - JSON or XML. I am curious to know what choices others have m ...

xmlsilverlightjsonserialization

Having trouble loading select fields using AJAX within Wordpress? Update and find a solution!

UPDATE: I am struggling to iterate through the response object and populate a select field using my ajax function. Although I have tried using a for loop instead of each(), the select field gets populated with "undefined". Any suggestions on how to resolve ...

javascriptphpjqueryajaxwordpress

An introduction to utilizing .keypress() in jquery

I'm exploring the use of .keypress() to allow users to press enter and trigger a button click on my modal (which closes the modal). When I initially code it as: $(document).keypress(function () { console.log('keypress'); }); it works, but ...

javascriptjqueryhtml