title: Add or Push multiple JSON objects to an API JSON array using javascript
body: <p>I have a CSV file full of data that has been converted into JSON. Right now I'm trying to figure out how I can send multiple JSON objects into the API JSON array. I'm currently using ractive as my chocie of framework. The JSON objects will be added by clicking on the "Send JSON Data" button</p>
  
  <p><a href="https://i.stack.imgur.com/2bhJC.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2bhJC.jpg" alt="enter image description here"></a></p>
  
  <p><strong>CSV to JSON Conversion</strong> </p>
  
  <pre><code>&lt;html&gt;
  
  &lt;body&gt;
  
  &lt;?php 
  
      function csvToJson($fname) {
          if (!($fp = fopen($fname, 'r') )) {
              die("Can't open file");
          }
  
          $key = fgetcsv($fp, "1024", ",");
  
          $json = array();
              while ($row = fgetcsv($fp, "1024", ",")) {
                  $json[] = array_combine($key, $row);
          }
  
          fclose($fp);
  
          foreach ( $json as $k=&gt;$v ) {
  
  
              $json[$k]['dateRequested']     = $json[$k]['DATE']; 
              $json[$k]['assignedAgent']     = $json[$k]['AGENT'];
              $json[$k]['finalCompanyName']  = $json[$k]['COMPANY NAME'];
              $json[$k]['unitNumber']        = $json[$k]['UNIT'];
              $json[$k]['floorNumber']       = $json[$k]['FLOOR_LEVEL'];
              $json[$k]['buildingName']      = $json[$k]['BUILDING NAME'];
              $json[$k]['streetNumber']      = $json[$k]['NUMBER'];
              $json[$k]['streetName']        = $json[$k]['STREET'];
              $json[$k]['subdivisionName']   = $json[$k]['SUBDIVISION_COMPOUND_VILLAGE'];
              $json[$k]['barangayName']      = $json[$k]['BARANGAY'];
              $json[$k]['districtNum']       = $json[$k]['DISTRICT'];
              $json[$k]['cityMunicipality']  = $json[$k]['CITY_MUNICIPALITY'];
              $json[$k]['provinceName']      = $json[$k]['PROVINCE'];
              $json[$k]['region']            = $json[$k]['REGION'];
              $json[$k]['area']              = $json[$k]['AREA'];
              $json[$k]['longitude']         = $json[$k]['LONGITUDE'];
              $json[$k]['latitude']          = $json[$k]['LATITUDE'];
              $json[$k]['secRanking']        = $json[$k]['Sec Ranking'];
              $json[$k]['affiliate']         = $json[$k]['Affiliates'];
              $json[$k]['profiling']         = $json[$k]['Profiling'];
              $json[$k]['contactNumber']     = $json[$k]['CONTACT NUMBER'];
              $json[$k]['industry']          = $json[$k]['INDUSTRY']; 
              $json[$k]['amAssigned']        = $json[$k]['AM ASSIGNED'];
              $json[$k]['source']            = $json[$k]['SOURCE'];
              $json[$k]['gbu']               = $json[$k]['GBU'];
              $json[$k]['retention']         = $json[$k]['RETENTION'];
              $json[$k]['sec']               = $json[$k]['SEC'];
              $json[$k]['tier']              = $json[$k]['TIER'];
              $json[$k]['acqui']             = $json[$k]['ACQUI'];
              $json[$k]['finalReco']         = $json[$k]['FINAL RECO'];
              $json[$k]['remarksFindings']   = $json[$k]['FINAL REMARKS'];
  
              unset($json[$k]['DATE']);
              unset($json[$k]['AGENT']);
              unset($json[$k]['COMPANY NAME']);
              unset($json[$k]['UNIT']);
              unset($json[$k]['FLOOR_LEVEL']);
              unset($json[$k]['BUILDING NAME']);
              unset($json[$k]['NUMBER']);
              unset($json[$k]['STREET']);
              unset($json[$k]['SUBDIVISION_COMPOUND_VILLAGE']);
              unset($json[$k]['BARANGAY']);
              unset($json[$k]['DISTRICT']);
              unset($json[$k]['CITY_MUNICIPALITY']);
              unset($json[$k]['PROVINCE']);
              unset($json[$k]['REGION']);
              unset($json[$k]['AREA']);
              unset($json[$k]['LONGITUDE']);
              unset($json[$k]['LATITUDE']);
              unset($json[$k]['Sec Ranking']);
              unset($json[$k]['Affiliates']);
              unset($json[$k]['Profiling']);
              unset($json[$k]['CONTACT NUMBER']);
              unset($json[$k]['INDUSTRY']);
              unset($json[$k]['AM ASSIGNED']);
              unset($json[$k]['SOURCE']);
              unset($json[$k]['GBU']);
              unset($json[$k]['RETENTION']);
              unset($json[$k]['SEC']);
              unset($json[$k]['TIER']);
              unset($json[$k]['ACQUI']);
              unset($json[$k]['FINAL RECO']);
              unset($json[$k]['FINAL REMARKS']);
  
          }
  
          return json_encode($json, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES);
  
      }
  
   ?&gt;
  
  
  
  &lt;?php
  $json_data = csvToJson("lms.csv");
  ?&gt;
  </code></pre>
  
  <p><strong>Javascript</strong> </p>
  
  <pre><code>&lt;div id="container"&gt;
  
  &lt;/div&gt;
  
  
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/ractive/0.9.0-build-48/ractive.js"&gt;&lt;/script&gt;
  
  
  &lt;script id="template" type="text/ractive"&gt;
       &lt;a class="button cta" on-click="addData"&gt;Send JSON Data&lt;/a&gt;
  &lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
  
  var app = new Ractive({
      el       : '#container',
      template : '#template',
  });
  
  var proxy       = 'http://192.168.1.126/lms-dev-noel/proxy.php';
  var endpoint    = 'account/leads/';
  var rt          = 'POST';
  var url         = proxy+'?endpoint='+endpoint+'&amp;rt='+rt;
  
  var lms_json    = &lt;?php echo json_encode($json_data); ?&gt;;
  
  var jobjects = JSON.parse(lms_json);
  console.log(jobjects)
  
  
  
  
  app.on('addData', function(event) {
      $.ajax({
          type     : 'POST',
          url      : url,
          data     : jobjects,
          dataType : 'json',
          success  : function() {
              console.log(jobjects);
          },
          error    : function(error) {
              console.log('Error')
          }
  
      })
  
  })
  
  
  &lt;/script&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>