Use angular-resource to add a new entry to the db.json file

I have a JSON file called db.json with the following structure:

{
"menu":[
 {
   "id":0,
   "item":"item1"
},{
   "id":1,
   "item":"item2"
},{
   "id":2,
   "item":"item3"
}
],
"feedback":[]
}

Currently, I am using Angular's $resource to send a JavaScript object to the feedback array using the PUT method.

Below is my service code-

this.getFeedbacks = function(){
            return $resource(baseURL + "feedback/:id", null, {
                'update': {
                    method: 'PUT'
                }
            });
        };

And this is the controller code-

$scope.fb.push($scope.myFeedback);
 menuFactory.getFeedbacks().update({
            id: $scope.fb.id
        }, $scope.fb);

In the JSON, the feedback array is initially empty. The value for myFeedback comes from an ng-model within a specific ng-controller in the HTML form. Upon clicking a submit button, the input values are stored in the JSON file.
The relevant HTML code is as follows-

<form name="feedbackForm" ng-submit="setFeedback()">
   <input type="text" name="name" ng-model="myFeedback.name">
   <input type="submit" name="submit" value="feedback">
</form>

I am encountering issues with my update function. Could someone please explain why? Please bear in mind that I am new to both AngularJS and REST client-server networking.

Answer №1

It seems like this particular task is related to a course on Coursera. Below is the solution I came up with.

Instead of utilizing the 'update' function, it would be more suitable to utilize the 'save' method from $resource in order to insert data into the database or JSON file.

In your controller, you can add the following code:

menuFactory.getFeedbacks().save($scope.feedback);

Make sure to replace '$scope.feedback' with the actual name of the object used in the feedback form.

I trust that this response proves to be beneficial for you!

Answer №2

One important tip is to always keep an eye on the browser console as it can often provide clues on where to troubleshoot errors. Now, let's address the issue at hand: consider utilizing $update instead of update.

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

I am having trouble getting PHP to parse JSON in the way I need

Currently, I am working on a hobby project that involves an API for accessing data. While everything seems to be functioning well on the other ends, I am facing an issue with the JSON array format. I need the JSON array to not have brackets so that I can e ...

One important rule to remember when using React Hooks is that they must be called consistently and in the correct order in each render of the component. It

Encountering an issue while trying to use the ternary operator to determine which React Hook to utilize. The error message states: "React Hook "useIsolationDynamicPhase" is called conditionally. React Hooks must be invoked in the same order during every co ...

Extracting data from websites using Node.js

Currently, I am tackling a task involving web scraping. To give you some context, I take the URL from my webpage and extract the content located between the <body> tags. My objective is to then display this extracted content on my website. Through my ...

Utilizing TypeScript in an AngularJS (1.x) project alongside Webpack: A Step-By-Step Guide

Currently, I am working through the official guide on transitioning from AngularJS (1.x) to Angular (2+). I have successfully divided my application into Components and integrated ES6 with Webpack as the module loader. However, I now find myself unsure of ...

In ReactJS, one can create a variable and include a map function by first declaring the variable and then using the map function within the component. If you

Having trouble integrating the accordian.js page into the app.js main page for compilation. Need help defining and writing out the function correctly, any suggestions? Below is my code: App.js: How do I incorporate the components from the accordian.js pa ...

Guide on installing React packages during runtime

My React project has a number of packages that need to be installed, but they take up a lot of disk space. I would like to install them only when necessary, after the user interacts with a specific component that requires these packages. Is there a way t ...

Validation of input using JQuery

I am currently working on validating a form, with a specific field that needs to be required. Here is the code for the field in question: <p> <label for="lf">Name: </label> <input class="lf" name="name" type="text"/> < ...

Using axios to retrieve data and then sending it to a localhost server using express

I'm a beginner in javascript and currently experimenting with fetching data from an API and posting it to my own server (localhost). For fetching the data, I am using axios as shown below: async function getNCAA() { axios .get(`https://api.th ...

TinyMCE - Utilizing selection.setContent along with getContent for the Warp Button

I am looking to implement a button that will wrap content with all tags. Snippet of Code: editor.addButton('MobileToggleArea', { text: '<M>', icon: false, onclick: function (){ editor.selection. ...

How come my date computed property does not update reactively when changes occur?

I have a Date object in my data, and I need to convert the date into a string for a date picker component in Vuetify. The initial date is being read and displayed correctly. I am able to set the date as well - when I set a code breakpoint, I can see the ...

PHP script integration with WHMCS

I've been attempting to add analytic.php into head.tpl in WHMCS, but I keep encountering an error. Analytic.php location: root/analytic.php Head.tpl location: root/whmcs/template/six/includes/head.tpl I read that WHMCS supports Smarty PHP, so I&apos ...

Retrieve content inside an iframe within the parent container

Hey there! I've been working on adding several iframes to my webpage. Each iframe contains only one value, and I'm trying to retrieve that value from the parent page. Despite exploring various solutions on Stack Overflow, none of them seem to be ...

Can you identify the issue within this jQuery code?

I am experiencing an issue with the code below that is supposed to retrieve JSON data and parse it. However, it doesn't seem to be working as expected. Can anyone help me figure out why? function News() { var q; if(qN=="" || qN==null) q="gaza"; e ...

The issue of a malfunctioning react TypeScript map when used in conjunction with useContext

I am attempting to retrieve data from the TVMaze API using React, TypeScript, and useContext. Although I can display the data, the useContext does not update with the return value, so when I use the map function, nothing is displayed. Any advice on how to ...

Issue with Bootstrap Popover not reflecting changes in Scope Variable

When a user clicks on the input field, I want to retrieve the ID of the input field, filter the object, and bind the data onto the Popover window. However, the scope is not updating from the directive. Below is the code, please point out where I may be g ...

What is the best way to continuously verify login and password credentials?

I am a newcomer to this industry and am facing a challenge with testing the process of entering the correct username and password using Selenium Webdriver. The current method of creating this process without a loop is extremely lengthy and monotonous. Here ...

Angular 6: Issue TS2339 - The attribute 'value' is not recognized on the 'HTMLElement' type

I have a textarea on my website that allows users to submit comments. I want to automatically capture the date and time when the comment is submitted, and then save it in a JSON format along with the added comment: After a comment is submitted, I would li ...

Switching between pages and updating the URL without needing to refresh the page, while still maintaining the content even after a refresh

After experimenting with jQuery's load() method to dynamically change content without refreshing the page, I encountered a recurring issue: the URL remains unchanged. Even when attempting to use history.pushState() to modify the URL, the problem pers ...

automatically close modal upon logout

After a period of inactivity, users are automatically logged out of my angularjs app. The issue arises when a modal dialog is open during this process - even though the user gets logged out due to route change, the modal stays open. One possible solution ...

Having trouble with the active class in vue-router when the route path includes "employees/add"?

I'm currently developing a project using Vue and implementing vue-router for navigation. A peculiar behavior occurs when the route changes to /employees - only the Employees menu item is activated. However, when the route switches to /employees/add, b ...