Obtaining JSON information within the AngularJS Scope

I am delving into the world of AngularJS for the first time and trying to understand it by following this example: http://jsfiddle.net/SAWsA/11/

After successfully acquiring data in JSON format, I encountered no issues. Here is a snippet of the JSON data:

[{"Activity_Matrix_ID":"163","Activity_ID":"131","Activity_Date":"2062-02-16","Activity_Category":"Maintenance","Activity_Project":"All Projects","Activity_Description":"Json data ","Activity_Hours":"2"},{"Activity_Matrix_ID":"161","Activity_ID":"129","Activity_Date":"2044-02-25","Activity_Category":"Tech Support","Activity_Project":"All Projects","Activity_Description":"Dummy dummy ","Activity_Hours":""}]

My goal is to load this data into $scope.items. However, I am unsure if I am approaching this correctly. Despite being able to view the URL and its data, I am struggling with properly transferring the JSON data from the URL to the angular scope.

I attempted the following script:

    <script type="text/javascript">
        var sortingOrder = 'Activity_Projects';
    </script>

<script>
function ctrlRead($scope, $filter) {

         $scope.myData = function(item, event) {

          var responsePromise = $http.get({method: 'GET', url: 'https://url_root_same_domain/timesheet/timesheet_info_table_json.php'}).success(function(data, status, headers, config) {

              $scope.items = data; 
              console.log(data);
            }).
            error(function(data, status, headers, config) {
              alert("No data");
            });
        }
 </script>   

Answer №1

Give this a shot:

Use the following code snippet to make a GET request using AngularJS $http service:
var responsePromise = $http.get('https://url_root_same_domain/timesheet/timesheet_info_table_json.php').success(...rest of your code here

Remember, when using $http.get() function in AngularJS, the first argument should be a URL, not an object. Also, no need to specify the method as get since it's already implied by the function.

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 successfully executing child_process.exec within an ajax request

On a server that I have access to but not ownership of, there is a node js / express application running on port 3000. Various scripts are typically executed manually from the terminal or via cron job. My goal is to have a button on the client-side that tr ...

Need to swiftly modify values of css attributes?

Here is a snippet of the code I am working with: <div></div> <button> Go </button> div { width: 50px; height: 50px; border: 1px solid #ccc; } var bgs = ['red', 'blue', 'yellow', 'green&apo ...

A Guide on Transferring Bep-20 Tokens to Multiple Addresses Without the Need for a For Loop in Web3 or Ethers

Is there a way to efficiently send tokens to multiple addresses without using loops or writing solidity code? I have noticed that when using a loop, the site gets very slow and throws timeout errors. Any suggestions on how to solve this issue? We are spec ...

Executing the command "jsonlint test.json" in the Command Prompt results in the error message ENOENT: file or directory not found with the error code -4058

When I run the command "jsonlint test.json" from the cmd (Command Prompt), I get an error message saying ENOENT: no such file or directory, errno: -4058. However, when I paste the JSON text directly into https://jsonlint.com, it validates the JSON as corre ...

AngularJS xeditable typeahead - dynamically modify input field based on the value of another input field

Struggling with the angularjs xeditable typeahead feature. I attempted to update one input field using the value of another input field, but encountered an issue. Even after updating the $scope variable, xeditable failed to bind the new value to the HTML ...

Ways to guide user after logging out

My Angular front end includes the following code in app.js to handle user logout: .when('/logout', { templateUrl: 'mysite/views/logout.html', resolve: { authenticated: ['djangoAuth', function(djangoAuth){ return ...

Using JavaScript to set the value of an input text field in HTML is not functioning as expected

I am a beginner in the programming world and I am facing a minor issue My challenge lies with a form called "fr" that has an input text box labeled "in" and a variable "n" holding the value of "my text". Below is the code snippet: <html> <head&g ...

Tips for creating a div that slides from the right side to the left side

I received a code from someone and I need help with making the sliding div slide from right to left. Essentially, I want the div to hide on the right side and slowly move to the left within a width of 300px. Here is the HTML code: <a id="loginPanel"&g ...

Rapid processing of JavaScript upon page load

I recently implemented a dark mode feature on my WordPress site. Here are the four modes I included: 1- Automatically based on user's system settings 2- Light mode 3- Semi-lit mode 4- Dark mode The implementation is in place and functioning perf ...

Setting a cookie within an Angular interceptor

My angular interceptor function includes a request object. intercept(req: HttpRequest<any>, next: HttpHandler) { return next.handle(req); } I am looking to set my token in the request cookie under the name my-token. How can I achieve this? I ...

Order the results by a predicate chosen by the user and a predefined secondary attribute

Trying to organize a table of results by a user selected criterion and then by a predefined secondary one. For instance, the ng-repeat setup looks like this: <tr ng-repeat="line in model.resultList | orderBy:['-predicate', 'secondary_va ...

Looking to retrieve an element from an array of objects based on consecutive object properties, I have a specific value to search for

const levels = [ { indexId: 'A', level: 1, name: 'A', parent: '0', }, { indexId: 'A-A1', level: 2, name: 'A1', parent: 'A', }, { ...

Support for Big Decimal in Org.json

Is there a way to add BigDecimal support to the org.json library? I'm attempting XML to JSON conversion using this library, but it seems to be lacking Big Decimal support. Any suggestions on how to handle this issue? Even after trying the 20200518 ve ...

Can the AngularJS icon adapt to different lists?

I'm currently developing in AngularJS / Jade and I need to implement functionality where an icon changes when a user clicks on something. The code I have right now looks like this: a(onclick='return false', href='#general', data-t ...

Vue automatically refreshes momentjs dates prior to making changes to the array

I am dealing with a situation where my child component receives data from its parent and, upon button click, sends an event to the parent via an event bus. Upon receiving the event, I trigger a method that fetches data using a Swagger client. The goal is ...

Convert JavaScript code to Google Appscript

Looking for guidance on incorporating Javascript code into my Google Appscript. Here is the code snippet: I have a separate Stylesheet.html file saved. Can someone advise me on how to invoke the functions within the html file? <script> //google. ...

Displaying Data in Table Using Ajax Request

I'm working on a project that involves creating an HTML table from an ajax request pulling SharePoint list items. The screenshot provided demonstrates how it functions and what it displays after the button is clicked. However, I am looking for a way t ...

Prevent scrolling after every time the mouse wheel is used

I have created a function that increments a class on a list item, here is the code snippet: var scrollable = $('ul li').length - 1, count = 0; $('body').bind('mousewheel', function(e) { if (e.originalEvent.wheelDelta / ...

Steps for automatically toggling a button within a button-group when the page is loaded using jQuery in Bootstrap 3

Here is a button group setup: <div class="btn-group" data-toggle="buttons"> <label class="btn btn-default"> <input type="radio" name="environment" id="staging" value="staging" />Staging </label> <label class= ...

Angular8 Chart.js customizes the Y axis tick labels

Is there a way to dynamically adjust the Y-axis ticks in a chart.js graph? I attempted to modify them using the following commands: this.chartOptions.scales.yAxes[0].ticks.min = 10; this.chartOptions.scales.yAxes[0].ticks.max = 18; ...