Javascript Ajax laravel在模式中显示客户端信息

我正在开发一个租车应用程序。我有三张桌子：客户、汽车和地点

表位置：将客户端的cin作为外键，并将车辆id作为外键

以下是客户端和位置模式之间的关系：

class client extends Model
{

 protected $primaryKey = 'cin';

   public $incrementing = false;

  public function locations()
    {
   return $this->hasMany(Location::class);
  }

     }

我在这里显示所有客户端：

  <table class="mytable" id="table">
  <tr><th>Nom</th><th>Prenom</th><th>CIN</th><th>Email</th><th >Action</th> 
</tr>
  {{ csrf_field() }}

   @foreach($clients as $client)
 <tr class="client{{$client->cin}}">
 <td>{{ $client->nom }}</td><td>{{ $client->prenom }}</td><td>{{ $client- 
 >cin }}</td><td>{{ $client->email }}</td>
 <td>
  <span><a type="button" class="show-modal" href="#"  data-nom="{{$client- 
   >nom}}" data-prenom="{{$client->prenom}}"  data-tel="{{$client->tel}}" 
  data-cin="{{$client->cin}}" data-email="{{$client->email}}"><img 
   src="img/ac3.png"></a></span>
  </td></tr>
  @endforeach
 </table>

我的控制器

  public function getclientData($cin){
  $car_dat = array();

  $car_dat= Client::find($cin);
  $car_data=array();
  $car_data=$car_dat->locations;

 return response()->json(['success' => true, 'car_data' => $car_data]);
 }

控制器中的逻辑运行良好，因此我认为问题出在Ajax函数中

---

问题描述：当我单击“显示”按钮时，我将客户id传递给我的控制器，然后我想用ajax显示客户租车，但没有显示任何内容。

首先，我认为最好将

html

属性转换为实际包含html元素（例如，使用

document.createElement（'tr'）

）

其次，您的

$。
post
回调中的每个（）

函数不做任何操作。将返回您给它的对象。这意味着

appendTo

将不起作用。另外，

appendTo

只能处理jQuery对象，这些对象是使用

$（'selector'）

语法时返回的对象。您应该检查控制台是否有任何错误（应该有）

因此，您的解决方案是首先将

html

变量设置为html（或者编辑元素，如果设置为1），然后将其附加到表中：

var testArray={
数据：[
“哇”，
“太棒了”，
“再来一次”
]
};
var html=“请使用document.createElement使用实际的html元素”；
$.each（测试数组、函数（索引、测试数据）{
html=html+“”+testData[0]+”，这是“+testData[1]+”。请让我们试试这个“+testData[2]+”
”；
});
$（'#mytable'）.html（html）
我的新ajax功能现在可以工作了

     $(document).on('click', '.show-modal', function() {
     $('#show').modal('show');
     $('#nom').text($(this).data('nom'));
     $('#prenom').text($(this).data('prenom'));
     $('#tel').text($(this).data('tel'));
     $('#cin').text($(this).data('cin'));
     $('#email').text($(this).data('email'));


  //Along with your modal action you can use following code


var cin = $(this).data('cin');


$.post('client/'+cin, function(response){ 

if(response.success)
    {
       var html=" <tr><th>Date de prise</th><th>Date de fin</th><th>Matricule</th> 
  <th>details de contrat</th></tr> " ;

          $.each(response.car_data, function(i, car_data) {

                                        html += "<tr class='historique'>"+
                                        "<td>" + car_data.date_prise +"</td>" + 
                                        "<td>" + car_data.date_fin +"</td>"+
                                        "<td>" + car_data.voiture_matricule +"</td>"+
                                        "<td>" + cin +"</td>"+"</tr>"



                                                            });
          $('#mytable').html(html);

   }
},'json');

});

$（文档）.on（'click'，'show modal'，function（））{
$（'#show'）。模态（'show'）；
$（'#nom'）.text（$（this.data（'nom'））；
$（'#prenom'）.text（$（this.data（'prenom'））；
$（'#tel'）.text（$（this.data（'tel'））；
$（'#cin'）.text（$（this.data（'cin'））；
$（'#email'）.text（$（this.data（'email'））；
//除了模态动作之外，您还可以使用以下代码
var cin=$（this.data（'cin'）；
$.post（'client/'+cin，函数（response）{
if（response.success）
{
var html=“财务矩阵的批准日期
合同细节”；
$.each（response.car_数据，函数（i，car_数据）{
html+=“”+
“+car\u data.date\u prise+”+
“”+汽车\数据。日期\财务+“”+
“”+car\u data.voiture\u矩阵+“”+
“+cin++”
});
$（'#mytable'）.html（html）；
}
}“json”）；
});
看起来您在ajax
appendTo
循环中缺少了表行（例如，
）。谢谢您，我添加了它们，但仍然存在相同的问题，甚至没有显示表头
      Route::post('client/{cin}', 'ClientsController@getclientData');

  public function getclientData($cin){
  $car_dat = array();

  $car_dat= Client::find($cin);
  $car_data=array();
  $car_data=$car_dat->locations;

 return response()->json(['success' => true, 'car_data' => $car_data]);
 }

     $(document).on('click', '.show-modal', function() {
     $('#show').modal('show');
     $('#nom').text($(this).data('nom'));
     $('#prenom').text($(this).data('prenom'));
     $('#tel').text($(this).data('tel'));
     $('#cin').text($(this).data('cin'));
     $('#email').text($(this).data('email'));


  //Along with your modal action you can use following code


var cin = $(this).data('cin');


$.post('client/'+cin, function(response){ 

if(response.success)
    {
       var html=" <tr><th>Date de prise</th><th>Date de fin</th><th>Matricule</th> 
  <th>details de contrat</th></tr> " ;

          $.each(response.car_data, function(i, car_data) {

                                        html += "<tr class='historique'>"+
                                        "<td>" + car_data.date_prise +"</td>" + 
                                        "<td>" + car_data.date_fin +"</td>"+
                                        "<td>" + car_data.voiture_matricule +"</td>"+
                                        "<td>" + cin +"</td>"+"</tr>"



                                                            });
          $('#mytable').html(html);

   }
},'json');

});