Issue on Updating a jQuery Function by Ajax and PHP

Issue on Updating a jQuery Function by Ajax and PHP

Can you please help me to figure out how to pass ajax result into a jquery function.

I have a HTML Select options as:


  1. <?php
  2.     define('DB_HOSTNAME', 'xxxx'); 
  3.     define('DB_USERNAME', 'xxxx'); 
  4.     define('DB_PASSWORD', 'xxxx'); 
  5.     define('DB_DATABASE', 'xxxx'); 
  6.     $mysqli = new mysqli(DB_HOSTNAME, DB_USERNAME, DB_PASSWORD, DB_DATABASE);
  7.     if ($mysqli->connect_errno) {    die('Unable to connect!');}
  8.     else{
  9.         $query = 'SELECT DISTINCT projectID FROM DATA';
  10.         if ($result = $mysqli->query($query))   {
  11.             if ($result->num_rows > 0) 
  12.             {
  13. ?>  
  14.  <select id="selbycolo" class="selectpicker" data-live-search="true" data-size="5">
  15.  <option value="select">Select From List</option>
  16.  <?php      
  17.  while($row = $result->fetch_assoc()) {
  18. ?>      
  19.  <option value="<?php echo $row['projectID']; ?>"><?php echo $row['projectID']; ?></option>     
  20. <?php           
  21.         }
  22. ?>
  23. </select>
  24. <?php
  25.         }
  26.         else {  echo 'No records found!';}
  27.         $result->close();
  28.     }
  29.     else {echo 'Error in query: $query. '.$mysqli->error;}
  30. }
  31. $mysqli->close();
  32. ?>
then I have an jQuery Ajax method as:

  2. <script type="text/javascript">
  3.  $(document).ready(function(){
  4.  $('#selbycolo').change(function()
  5.         {
  6.             if($(this).val() == '') return;
  7.             $.get(
  8.                 'ecolo.php',
  9.                 { id : $(this).val() },
  10.                 function(data)
  11.                 {
  12.                   //$('#result').html(data);
  13.                  }
  14.             );
  15.         });

  17. });
  18. </script>
and finally I have the ecolo.php which I would like to populate some  Plots  into another jquery function. Here is what I have

  2. <?php
  3. define('DB_HOSTNAME', 'xxxx'); 
  4. define('DB_USERNAME', 'xxxx'); 
  5. define('DB_PASSWORD', 'xxxx'); 
  6. define('DB_DATABASE', 'xxxx'); 
  7. $mysqli = new mysqli(DB_HOSTNAME, DB_USERNAME, DB_PASSWORD, DB_DATABASE);
  8. $resultStr = '';
  9. $query = 'SELECT * FROM DATA WHERE projectID='.$_GET['id'];
  10. if ($result = $mysqli->query($query)) 
  11. {
  12.     if ($result->num_rows > 0) 
  13.     {

  15.         while($row = $result->fetch_assoc())
  16.         {


  19.         }

  21.     }
  22.     else
  23.     {
  24.         $resultStr = 'Nothing found';
  25.     }
  26. }
  27. echo $resultStr;
  28. ?>
now what I need to do is updating a jquery function

  2. 'Area 1': {
  3.                     latitude: 49.25,
  4.                     longitude: -123.10,
  5.                     tooltip: {
  6.                     content: "xzx"
  7.                     }
  8.            }
In this script

  2. <script>
  3. $(function () {
  4.     $(".maparea1").mapael({
  5.         map: {
  6.             name: "testmap",
  7.             defaultArea: {
  8.                 attrs: {
  9.                     stroke: "#90856f",
  10.                      "stroke-width": 0.7,
  11.                    fill: "url(img/svg.png)"
  12.                     }
  13.             }
  14.         },
  15.         plots: {
  16.         'Area 1': {
  17.                 latitude: 49.25,
  18.                 longitude: -123.10,
  19.                 tooltip: {
  20.                     content: "xzx"
  21.                 }
  22.             }
  23.         }

  25.     });
  26. });
  27. </script>
which  'Area 1'  is coming from  area  column ,  latitude  from  lat  ,  longitude  from  long  and content value from projectID. sorry this tools long but I tried to put every thing here by details.