0

I have one query that, I have couple of json objects(contains id and description) in Postgresql database. My requirement is: I need to display each and every json data(id and description) from Postgresql database to my view page on hitting the URL automatically (like: if we hit http://localhost:9000 then that json data should come from database and should be displayed on my view page in table format on loading). Please let me know that how to implement it ? (Any examples or any code). Thanks in advance. In btw: I'm loading these json objects from localhost via jquery/ajax call to database/server.

//it is used to send json data to server

    $scope.loadJson = function() {
      var file, fr, input, receivedText;
      receivedText = function(e) {
        var lines, newArr;
        lines = e.target.result;
        alert('lines: ' + lines);//gives json data
        newArr = JSON.parse(lines);
        $.ajax({
          type: 'POST',
          contentType: 'application/json; charset=utf-8',
          dataType: 'json',
          url: '/sendJson',
          data: JSON.stringify(lines),
          success: function(data) {},
          error: function(XMLHttpRequest, textStatus, errorThrown) {

        });
      };
      if (typeof window.FileReader !== 'function') {
        alert('The file API isn\'t supported on this browser yet.');
        return;
      }
      input = document.getElementById('fileinput');
      if (!input) {
        alert('Um, couldn\'t find the fileinput element.');
      } else if (!input.files) {
        alert('This browser doesn\'t seem to support the `files` property of file inputs.');
      } else if (!input.files[0]) {
        alert('Please select file before clicking \'Load\'');
      } else {
        file = input.files[0];
        fr = new FileReader;
        fr.onload = receivedText;
        fr.readAsText(file);
      }
    };

html:

<table border="1"> 
                        <tr>
                            <td>
                                <label>Select File:</label>
                                <input type='file' id='fileinput' accept=".json" name="fileinput"> 
                            </td> 
                            <td>
                                <input type='button'  value='Load' ng-click="loadJson()">
                            </td>
                        </tr>
                    </table>
Dhana
  • 711
  • 3
  • 14
  • 40
  • first place why you need `$.ajax` here in angular, you should use `$http` instead for making ajax – Pankaj Parkar Feb 17 '16 at 06:15
  • @PankajParkar, thanks for your reply, yes we can use $http, but I am new to AngularJS, hopefully we can use both I guess. It is storing my files/objects into backend successfully. – Dhana Feb 17 '16 at 06:35
  • you should use that.. It will messed up with angular digest system. and then you will face problem related to data binding. I'd recommend you go through [this answer](http://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background) to clearing out things – Pankaj Parkar Feb 17 '16 at 06:41
  • but, for me it is another Use case that belongs to send files to server. I gave it that for normal how I am sending to server. – Dhana Feb 17 '16 at 06:50

0 Answers0