skip to Main Content

I have the following Ajax code in an html file:

<script  type="text/javascript" src="jquery-3.5.0.min.js">
    $.ajax({
        method: "GET",
        url:"nba2019_namelist.php",
        success:function(res) {
            $("#playerNames").html(res)
        }
    })
</script>

This is supposed to load a php file (which really just creates a list from a csv), but is not working. I am using Apache to make php function, and when I go to http:/localhost/nba2019_namelist.php, my list is present, so I am fairly certain that the php file isn’t the issue. The ajax code is meant to replace the following html list:

<div>
  <ul id="playerNames">
      <li><b>Harden</b></li>
      <li><b>Giannis</b></li>
      <li><b>Lebron</b></li>
      <li><b>Booker</b></li>
      <li><b>Lavine</b></li>
      <li><b>Westbrook</b></li>
      <li><b>Jokic</b></li>
  </ul>
</div>

But the only output when I load the page are the same names that are typed in here, not the ones created by my php file. What am I doing wrong here? Do I need to specify in the Apache httpd.conf which php file I want to load? I don’t really know any Ajax, but based on what I have seen on forums, it should work. What am I doing wrong here, and what should I do next to fix this issue?

If JQuery is the only solution, just let me know, I would just rather not learn something new at the moment, unless it is completely necessary.

2

Answers


  1. Chosen as BEST ANSWER

    I was able to fix my own problem. I followed a tutorial online that suggested changing my vanilla <script> tag that contained my ajax code to instead read <script type="text/javascript" src="jquery.min.js">. This made my code not function properly.

    To solve this, I changed my script tag back to the vanilla <script>, and instead put the following at the bottom of my <head>: <script type="text/javascript" src="jquery.min.js"></script>

    This allowed my php code to be grabbed from ajax as expected.


  2. Try this by using fetch:

    fetch('nba2019_namelist.php')
    .then(response=>response.Text())
    .then(data => { 
         document.getElementById("playerNames").innerHTML = data;
     });
    

    I hope it helps

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search