AJAX新功能：点击按钮PHP

我和一个朋友试图弄明白如何创建一个函数，根据下拉菜单中设置的值从数据库中提取一行。经过大量的搜索，我们走到了这一步，但点击后什么也没有发生。如果我只加载php，我只会得到带有“old method”的错误消息。任何帮助都将不胜感激。如果这在答案中很重要，那么只需要对结果进行样式化

（添加了原始AJAX代码）位于中间

谢谢大家!

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
            <script type ="text/javascript">

    //      <!-- Change fields to be sourced by field list in future -->
            let FIELD_LIST = [
                            "Any Field",
                            "Animation",
                            "Audio",
                            "Culinary",
                            "Fashion",
                            "Gaming",
                            "Industrial Design",
                            "Interior Design",
                            "Photo",
                            "Video",
                            "Web Design"
                        ];

            let INTEREST_MAP = {
                "Any Field": ["Any Interest"],
                "Animation": ["Modeling", "Motion", "Lighting", "Backgrounds", "Learning Animation"],
                "Audio": ["ADR", "Audio Post", "Composer", "Electrician", "Foley", "Mixer", "On-Set", "Sound Design", "Studio", "Learning Audio"],
                "Culinary": ["Baker", "Catering", "Cuisine (specify)", "Management", "Learning Culinary"],
                "Fashion": ["Costume", "Design", "Marketing", "Tailor", "Wardrobe", "Learning Fashion"],
                "Gaming": ["3D Artist", "Animator", "Art Director", "Concept Artist", "Environment Artist", "Game Tester", "Modeler", "Motion Capture", "Project Manager", "Programmer", "UI Artist", "Learning Gaming"],
                "Industrial Design": ["Product", "Learning Industrial Design"],
                "Interior Design": ["Commercial", "Drafting", "Environment", "Hospitality", "Institution", "Residential", "Learning Interior"],
                "Photo": ["Commercial", "Event", "Fashion", "Narrative", "Nature", "Real Estate", "Sports", "Wedding", "Learning Photo"],
                "Video": ["Cinematographer", "Director", "Editor", "Producer", "Production Assistant", "Scriptwriter", "Learning Video"],
                "Web Design": ["Developing", "Interface", "Typography", "User Experience", "Learning Web Design"]
            };      

            function populate2(fieldId, interestId) {
                let field = document.getElementById(fieldId).value;
                let interestList = document.getElementById(interestId);
                interestList.innerHTML = "";
                for(let interest in INTEREST_MAP[field]){
                    let newOption = document.createElement("option");
                    newOption.value = INTEREST_MAP[field][interest];
                    newOption.innerHTML = INTEREST_MAP[field][interest];
                    interestList.options.add(newOption);
                }
            }
    //      $(document).ready(function(){
    //     $("#collaborate").click(function(){
    //         $.get("Profiles.php", function(data){
    //             alert("Data: " + data);
    //         });
    //     });
    // });
            $(document).ready(function(){
                $('#collaborate').click(function() {
                    event.preventDefault();
                    $.get('userprofiles.php', {ajax: true},function(data, status){
                        alert(data);
                    });
                });
            });

    </script>
<div id="container">

  <div class="column">
      <select class="field" name="field"  id="field" onchange="populate2('field','interestId')" >
            <option value="Any Field">Any Field</option>
            <option value="Animation">Animation</option>
            <option value="Audio">Audio</option>
            <option value="Culinary">Culinary</option>
            <option value="Fashion">Fashion</option>
            <option value="Gaming">Gaming</option>
            <option value="Industrial Design">Industrial Design</option>
            <option value="Interior Design">Interior Design</option>
            <option value="Photo">Photo</option>
            <option value="Video">Video</option>
            <option value="Web Design">Web Design</option>
      </select>
      <h1 class="info1">1</h1>
      <h3 class="info1">Select an artist's field of choice you need</h3>
  </div>
  <div class="column">
      <select class= "interestId" name="interestId" id="interestId">
        <option value="Any Interest">Any Interest</option>
      </select>
          <h1 class="info2">2</h1>
              <h3 class="info2">Select a specific interest you're looking for</h3>
  </div>

  <div class="column">
    <button class="button" id="collaborate" name="collaborate">
        Collaborate!
    </button>
  </div>

  </div>

</div>

PHP

$Interest=$\u GET['interestId']；
$sql=“从用户中选择*，其中Interest1='$Interest'或Interest2='$Interest'或Interest3='$Interest'；
$result=mysqli\u查询（$sql）；
//$row=mysql\u fetch\u row（$result）；
//回声“；
//打印（行）；
//回声“；
//尝试选择查询执行
//旧方法如下
如果（$结果）{
打印（结果）；
mysqli_免费_结果（$result）；
}否则{
echo“错误：无法执行$sql.”。mysqli_错误（$link）；
}

在php中，而不是使用print\r（）

然后在jQuery中

---

这有什么帮助呢？

我刚刚决定将下拉列表包装成一个表单，并将其重新设置为原始形状。PHP的工作方式很有魅力。

“点击后什么也没发生”。您首先需要跟踪这一失败的具体位置—单击处理程序是否正在启动？ajax失败了吗？查询失败了吗？在单击处理程序中放置一个警报，以查看是否触发了该警报。打开浏览器控制台，同时查找错误。这就是我们所困惑的。没有错误。我不懂调试器，但我的朋友懂。他浏览了我们的原始代码，我会补充，但没有发现任何问题。我决定改变它，看看是否能让它工作。请给出详细信息和代码。不仅仅是整个页面的代码。解释briefly@AnikethSaha你能解释一下你需要更多的细节吗？说到编程，我是个新手（朋友要好得多），但这是我们两人都不太幸运的事情。因此，基本上你想要的是：“当单击标有“协作”的按钮时，我想从数据库中提取一条记录”？它给出的只是与警报相关的HTML中的一个错误。虽然这是你所做的，这决不是对你问题的回答。

$(document).ready(function(){
            $('#collaborate').click(function() {
                $.ajax({
                    type: "GET",
                    url: "userprofiles.php",
                    data: { 'interest' : "asd" } // this line does nothing at the moment. But ideally it is used to pass data directly as variables to your php document.
                }).done(function( result ) {
                    // alert( "Data Saved: " + result );
                    $('#data').text(data);
                });
            });
        });

 $Interest = $_GET['interestId'];

    $sql = "SELECT * from User WHERE Interest1='$Interest' OR Interest2='$Interest' OR Interest3 ='$Interest'";

   $result = mysqli_query($sql);

    //  $row = mysql_fetch_row($result);

    //  echo "<pre>";
    //  print_r($row);
    //  echo "</pre>";

    // attempt select query execution

// OLD METHOD BELOW
    if ($result) {
        print_r($result);
        mysqli_free_result($result);
    } else {
        echo "ERROR: Could not execute $sql. " . mysqli_error($link);
    }

 echo json_encode($result);

alert(JSON.parse(data));