Storing information in a database via a web API using AngularJS

I am new to the world of AngularJS and Web API. I am currently facing challenges when trying to send data to a database through Web API and Angular. I have successfully managed to load JSON data from the Web API. Any assistance on this matter would be greatly appreciated. My HTML:

<div class="container-fluid" ng-controller="SubmitDataCtrl">
     <div class="container text-center" style="margin-bottom:5px">
         <div id="divTables">
             <table id="tbl_SMDetails" class="display responsive nowrap aleft" cellspacing="0" width="100%">
                 <thead>
                     <tr>
                         <th class="all">Name</th>
                         <th class="all">CTSID</th>
                         <th class="all">FDID</th>
                         <th class="all">Name of the Project</th>
                         <th class="all">Effort Hour</th>
                         <th class="all">Month</th>

                     </tr>
                 </thead>

                 <tbody>
                     <tr ng-repeat="showData in loadData">
                         <td>{{showData.EmpName}}</td>
                         <td>{{showData.EmpCognizantID}}</td>
                         <td>{{showData.FDID}}</td>
                         <td><input id="Text1" type="text" />{{showData.projectName}}</td>
                         <td><input id="Text1" type="text" />{{showData.effortHour}}</td>
                         <!--<td>{{date | date:'MM-dd-yyyy}}</td>-->
                         <td>{{showData.date}}</td>
                     </tr>
                 </tbody>
             </table>
         </div>

     </div>
   <div>
       <a ng-href='#SubmitData' class="btn  btn-default" ng-click='go()'>Submit</a><span></span>
       <a ng-href='#SubmitData' class="btn  btn-default" ng-click=''>Reset</a>
       
   </div> 
     </div>

My service page looks like:

var request = $http({
                        method: method_args,
                        url: myConfig.ServiceURL + url,
                        data: JSON.stringify(input_data),
                        Accept: 'application/json',
                        headers: {'Content-Type':'application/json'},
                        xhrFields: {
                            withCredentials: true
                        }
                    });
                }

and my controller is

App.controller("SubmitDataCtrl", function($scope, ajaxService) {
//login user    
ajaxService.MakeServiceCall("employee/GetTeamMember?         superVisiorCogniID=256826", "GET", "")
.then(function effortData(data)
{
  // alert(data);
  $scope.date = new Date();
  $scope.loadData = data;
  showData = $scope.loadData;
  for (var i = 0; i < showData.length; i++)
  {
      //alert(showData[i].EmpName + showData[i].EmpCognizantID + showData[i].FDID);
  }});

$scope.go = function()
{
   //alert('clicked');
   ajaxService.MakeServiceCall("effort/SaveTeamEfforts?hourLoadDate=08/20/2015&hourLoadByCogniID=256826&forMonth=July", "POST", Employee).then(function save() {
        var Employee =
            {
                "EmpCogniID": showData[i].EmpCognizantID,
                "FDTimeCardHour": showData[i].effortHour,
                "HourLoadDate": 08/11/2015,
                "HourLoad`enter code here`By": "256826",`enter code here`
                "ForMonth": "july"
            }
   }).success(function (Employee)
   {
       $scope.showData[i] = Employee;
   });
   alert(Employee);    
}
});

Answer №1

Without a clear understanding of the intended outcome of the API POST call, providing an answer is challenging.

Have you tested the POST request to effort/saveTeamEfforts using a REST tester in your browser to ensure its functionality?

If the test is successful, consider implementing an .error function in your API call to identify any potential errors, as suggested by Dan.

L

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

Step-by-step guide: Uploading files with Ajax in Codeigniter

I am facing an issue with updating data and uploading an image when editing a row in my grid. Although the data is successfully updated, I am encountering difficulties in saving the image file to a folder. Here is what I have tried: While using AJAX, I ...

A dynamic 3-column layout featuring a fluid design, with the middle div expanding based on the

Sorry for the vague title, I'm struggling to explain my issue clearly, so let me elaborate. I am using flexbox to create a 3-column layout and want the middle column to expand when either or both of the side panels are collapsed. Here is a screenshot ...

Instead of JSON, WCF delivers XML as its response format

When I try to consume a web service from another project in my client project (even though both projects are in the same solution), I am unable to receive the expected JSON output. [WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json,RequestF ...

Vue Component Rendering Before Vuex Data is Ready

I am facing a challenge with my Vue2 component that depends on Vuex to fetch the currently selected node (infoNode) and display its data to the user. In my beforeCreate function, Axios is used to retrieve the top level nodes and set the 'infoNode&apos ...

Having trouble accessing AJAX POST data in Python?

For this jQuery request, I utilize an HTTP POST. function retrieveData() { const information = JSON.stringify({ "test_id": "1" }); jQuery.post('/retrieveData', information, function (response) { a ...

Manage the Cancel button functionality in Safari/Chrome when dealing with the Open in App Store pop up

Is there a way to manage the Cancel button on the Open in App prompt when redirected from Safari/Chrome to the AppStore? The situation is as follows: A user is prompted to download the app via a browser link. Upon clicking the link, it determines whether ...

When the ENTER key is pressed, trigger a function within the form instead of submitting it

Incorporating a table with filterable data utilizing the jQuery DataTables library, I face an issue. The said table is situated within a form where selecting rows (via checkboxes in one column) prompts the SUBMIT button to add them to a collection. The ta ...

What are the best ways to stop jQuery events from propagating to ancestor elements?

I have a collection of nested UL's that follow this structure: <ul class="categorySelect" id=""> <li class="selected">Root<span class='catID'>1</span> <ul class="" id=""> <li>First Cat<span ...

Display the value of a JavaScript variable in a Codeception Acceptance test

Is there a way to view the value of a vanilla JavaScript variable while running an acceptance test? In PHP, you can see the value of a variable in debug using $I->seeMyVar($var), but how can you pass the value of a JavaScript variable to a PHP variable ...

Nested Angular click events triggering within each other

In my page layout, I have set up the following configuration. https://i.stack.imgur.com/t7Mx4.png When I select the main box of a division, it becomes highlighted, and the related department and teams are updated in the tabs on the right. However, I also ...

Display function not functioning properly following AJAX request

I'm working on a functionality where I want to initially hide a table when the page loads, and then display it with the results when a form is submitted using Ajax. The issue I'm facing is that the code refreshes the page and sets the table back ...

How to remove an element from a nested JSON array object using AngularJS

I am looking to remove a specific element from a nested json array. The JSON object provided has the root node named EE with nested child Nodes and Packages. My goal is to delete the node with id = 7. Is there a way to achieve this? $scope.data = { ...

Replacing a string in a textarea using Jquery

Trying to dynamically replace a string value in a textarea while typing into a textbox using jQuery. Utilizing the keypress event for this functionality. Any ideas on what could be causing issues with this example? <input type="text" id="textbox" /> ...

What is the value of x in the equation 2 raised to the power of x equals 800

Similar Question: What is the reverse of Math.pow in JavaScript? 2^x=i If i is given, how can we determine x using Javascript? ...

Prevent the upward arrow from appearing on the first row and the downward arrow from appearing on the last row when

This is a straightforward question, but I'm unsure how to achieve it. I am currently working on sorting columns using jQuery. $(document).ready(function(){ $(".up,.down,.top,.bottom").click(function(){ var row = $(this).parents("tr:f ...

If every object within the array contains a value in the specified property, then return true

In my current project, I am working with an array of objects that looks something like this: $scope.objectArray = [ {Title: 'object1', Description: 'lorem', Value: 57}, {Title: 'object2', Description: 'ipsum', V ...

Displaying 'N/A' in the chart if the data is missing

I have a chart that displays data, but when data does not exist it shows "undefined%". https://i.sstatic.net/Fm3Tl.png Is there a way to remove the "undefined%" and simply display nothing on the graph if no data exists? Here is the code snippet: import { ...

Executing Leaflet on the Node.js backend server

I have been attempting to run Leaflet on a Node.js server without success. I followed the instructions in the download section and used Jake to build it, but when I try to require Leaflet in a server file and start my node server, it crashes with the error ...

The functionality of nested dynamic routing in the API is experiencing issues

Looking to extract product details from a specific category of products? My folder structure appears as follows: https://i.stack.imgur.com/1UCy3.png In "productId/index.jsx" => This snippet is utilized to retrieve individual product details: ...

What is the process of extracting a URL and inputting it into a form to enhance

Can anyone help with extracting a specific value (TEXT) from a URL and automatically paste it into an input form field? For example, if the URL is domain.com/page?code=123abc, I need to grab the code (in this case, 123abc) and have it automatically popula ...