使用AJAX调用PHP（通过MSQL）并填充引导模式

Question

我在HTML表格上有一个用户列表，当我点击一个条目时，我有一个通过AJAX进行模式加载，它应该填写所有相关的表单来自该用户的信息。信息可以通过更改进行更改和提交。

我无法过去让模态加载并且无法将数据加载到模型中。

下面是脚本：

<script> 
$('#editUserModel').on('show.bs.modal', function (event) { 
     var button = $(event.relatedTarget) // Button that triggered the modal 
     var recipient = button.data('userID') 

     $(function() 
      { 

      $.ajax({          
       url: 'getUser.php?id=',       
       data: "recipient",       

       dataType: 'json',      
       success: function(data)   
       { 
       var id = data[0];    //get id 
       var firstName = data[1];  //get name etc... 
       var lastName = data[2]; 
       var username = data[3]; 
       var password = data[4]; 
       var jobTitle = data[5]; 
       var TaskTeam = data[6]; 
       var admin = data[12]; 

       var modal = $(this) 
       modal.find('.modal-body input').html(username) 

       } 
      }); 
      }); 


    }) 
</script> 

这里列出了用户（这工作，当我点击编辑按钮模态负荷但是模式是灰色的，没有显示出潜在的数据）

的PHP

<?php 
include("dbconnect.php"); 

$dbQuery= mysql_query("SELECT * FROM users ORDER BY jobTitle ASC;"); 

while($dbRow = mysql_fetch_array($dbQuery)) 
{ 
$userID = $dbRow['id']; 
$username = $dbRow['username']; 
$firstName = $dbRow['firstName']; 
$lastName = $dbRow['lastName']; 
$jobTitle = $dbRow['jobTitle']; 
$userteam = $dbRow['TaskTeam']; 

echo '<tr>'; 
echo '<td>'; 
echo '<button type="button" class="btn btn-primary close" data-toggle="modal" data-target="#editUserModel" data-userID='.$userID.'><span title="Edit" aria-hidden="true" class="glyphicon glyphicon-edit"></span></button>'; 
echo '</td>'; 

echo '<td>'.$firstName.'</td>'; 
echo '<td>'.$lastName.'</td>'; 
echo '<td>'.$jobTitle.'</td>'; 
echo '<td>'.$userteam.'</td>'; 
echo '<td></td>'; 

/* 
echo '<td>'; 



echo '</td>'; 
*/ 

echo '</tr>'; 
} 

echo mysql_error(); 
mysql_close(); 

?> 

这里是模态的div：

<div class="modal fade" id="editUserModel" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="editModalLabel"></h4> 
     </div> 
     <div class="modal-body"> 
     <form> 
      <div class="form-group"> 
       <label for="username" class="control-label">Username:</label> 
       <input type="text" class="form-control" id="username"> 
      </div> 
      <div class="form-group"> 
       <label for="password" class="control-label">Password:</label> 
       <input type="text" class="form-control" id="password"> 
      </div> 
      <div class="form-group"> 
       <label for="firstName" class="control-label">First Name:</label> 
       <input type="text" class="form-control" id="firstName"> 
      </div> 
      <div class="form-group"> 
       <label for="lastName" class="control-label">Surname:</label> 
       <input type="text" class="form-control" id="lastName"> 
      </div> 
      <div class="form-group"> 
       <label for="jobTitle" class="control-label">Job Title:</label> 
       <input type="text" class="form-control" id="jobTitle"> 
      </div> 
      <div class="form-group"> 
       <label for="TaskTeam" class="control-label">Task Team:</label> 
       <input type="text" class="form-control" id="TaskTeam"> 
      </div> 
     </form> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Submit Changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

这里是PHP文件，该文件retriev es用户数据：

<?php 
    $userID = intval($_GET['id']); 
    include("dbconnect.php"); 

    $sql="SELECT * FROM users WHERE id = $userID"; 
    $result = mysql_query($sql); 
    $array = mysql_fetch_row($result);  

    echo json_encode($array); 

    mysql_close(); 
?> 

我不完全了解PDO，我不确定问题出在哪里。

Answer 1

Rahter比mysql使用mysqli。此外，问题正在发生，因为您需要遍历行结果。试试这个：

$servername = "localhost"; 
$username = "username"; 
$password = "password"; 
$dbname = "myDB"; 

// Create connection 
$conn = new mysqli($servername, $username, $password, $dbname); 
// Check connection 
if ($conn->connect_error) { 
    die("Connection failed: " . $conn->connect_error); 
} 


$userID = intval($_GET['id']); 
$sql="SELECT * FROM users WHERE id = $userID"; 
$result = $conn->query($sql); 

if ($result->num_rows > 0) { 
    // output data of each row 
    $array = array(); 
    while($row = $result->fetch_assoc()) { 
     array_push($array, $row); 
    } 
    echo json_encode($array); 
} else { 
    echo "0 results"; 
} 
$conn->close(); 

然后在你的JS，这种替代的.success内容：

success: function(data) { 
    var obj = JSON.parse(data); 
     $.each(obj, function(key, val) { 
      console.log(val); 
      //add your functions here 

      /* 
      var id = data[0];    //get id 
      var firstName = data[1];  //get name etc... 
      var lastName = data[2]; 
      var username = data[3]; 
      var password = data[4]; 
      var jobTitle = data[5]; 
      var TaskTeam = data[6]; 
      var admin = data[12]; 

      var modal = $(this) 
      modal.find('.modal-body input').html(username) 
      * 
      */ 
     }); 
}