循环遍历单个 <td> 元素 - Laravel答案

【问题标题】：Loop through a single <td> element - Laravel循环遍历单个 <td> 元素 - Laravel
【发布时间】：2020-06-11 01:05:59
【问题描述】：

我是 Laravel 的新手。我使用@foreach 制作了一个从数据库获取数据的表。我想让数据库值 1 & 0 显示为 Active & Inactive 之类的词。但是，我制作的 javascript 只显示第一列（如下面的输出图像所示）。有没有办法让脚本适用于整个表？谢谢！

<tbody>
    @foreach ($data as $row)
    <tr>
        <td> {{ $row->id }}</td>
        <td> {{ $row->name }}</td>
        <td> {{ $row->description }}</td>
        <td id=statust> {{ $row->status }}</td>
        <td id="defaulttt"> {{ $row->default }}</td>
        <td><a href="{{action('DetailTestController@edit',$row->id)}}" class="btn btn-warning">EDIT</a></td>
        <td>
            <form method="post" class="delete_form" action="{{action('DetailTestController@destroy', $row['id'])}}">
                {{csrf_field()}}
                <input type="hidden" name="_method" value="DELETE"/>
                <button type="submit" class="btn btn-danger">Delete</button>
            </form>
        </td>
    </tr>
    @endforeach
</tbody>

Javascript

function checkshow() {
    if (document.getElementById("statust").innerHTML == 1) {
        document.getElementById("statust").innerHTML = "Active";
    } else {
        document.getElementById("statust").innerHTML = "Inactive";
    }
    return;
}

Output

【问题讨论】：

因为您使用的是 id，而 id 仅针对一个元素。你应该在课堂上尝试一下

标签： javascript php jquery html laravel

【解决方案1】：

我不知道你为什么要为此使用 js sn-p。事实上，在这种情况下，您可以简单地使用三元组。

刀片模板将理解这个简写 if else（三元运算符）：

<tbody>
    @foreach ($data as $row)
    <tr>
    <td> {{ $row->id }} </td>
    <td> {{ $row->name }} </td>
    <td> {{ $row->description }} </td>
    <td> {{ ($row->status == 1) ? 'Active' : 'Inactive' }} </td>
    <td id = "defaulttt"> {{ $row->default }} </td>
    <td><a href="{{action('DetailTestController@edit',$row->id)}}" class="btn btn-warning">EDIT</a></td>
    <td>
    <form method="post" class="delete_form" action="{{action('DetailTestController@destroy', $row['id'])}}">
      {{csrf_field()}}
      <input type="hidden" name="_method" value="DELETE" />
      <button type="submit" class="btn btn-danger">Delete</button>
    </form>
    </td>
    </tr>

    @endforeach
</tbody>

JS 旁注：如果您尝试应用多个动作实例，classes 更适合此任务而不是 ids

【讨论】：

【解决方案2】：

输入这个条件来了解你的状态

@foreach ($data as $row)
 @php
   $status = "";
   @if($row->status == '1')
     $status = "Active";
   @else
     $status = "Inactive";
   @elseif
 @endphp

<td>{{ $status }} </td>
@endforeach

或者

<td> {{ ($row->status == 1) ? 'Active' : 'Inactive' }} </td>

【讨论】：

【解决方案3】：

您的代码仅影响表格的第一行的原因是因为您通过 id 而不是类作为选择器来调用元素。 Id 选择器用于唯一的元素。将其更改为类并在 javascript 上循环遍历类并像这样应用您的逻辑。

如果您使用的是 jQuery：

$('.statust').each(function() {
   if($(this).html() ==1){
      $(this).html("Active");
   }else{
      $(this).html("Inactive");
   }  
})

如果您使用的是 javascript 核心：

document.getElementsByClassName("statust").forEach(function(e) {
   if(e.innerHTML ==1){
      e.innerHTML = "Active";
   }else{
      e.innerHTML = "Inactive";
   }  
})

【讨论】：

【解决方案4】：

<tbody>
   @foreach ($data as $row)
     @php
       $status = "";
       @if($row->status == '1')
         $status = "Active"
       @else
         $status = "Inactive"
       @elseif
     @endphp
    <tr>
    <td> {{ $row->id }} </td>
    <td> {{ $row->name }} </td>
    <td> {{ $row->description }} </td>
    <td>{{ $status }} </td>
    <td id = "defaulttt"> {{ $row->default }} </td>
    <td><a href="{{action('DetailTestController@edit',$row->id)}}" class="btn btn-warning">EDIT</a></td>
    <td>
    <form method="post" class="delete_form" action="{{action('DetailTestController@destroy', $row['id'])}}">
      {{csrf_field()}}
      <input type="hidden" name="_method" value="DELETE" />
      <button type="submit" class="btn btn-danger">Delete</button>
    </form>
    </td>
    </tr>
    @endforeach

【讨论】：

【解决方案5】：

你可以这样做

<tbody>
       @foreach ($data as $row)
        <tr>
        <td> {{ $row->id }} </td>
        <td> {{ $row->name }} </td>
        <td> {{ $row->description }} </td>
        <td id = statust> @if($row->status == 1) Active @else Inactive @endif </td>
        <td id = "defaulttt"> {{ $row->default }} </td>
        <td><a href="{{action('DetailTestController@edit',$row->id)}}" class="btn btn-warning">EDIT</a></td>
        <td>
        <form method="post" class="delete_form" action="{{action('DetailTestController@destroy', $row['id'])}}">
          {{csrf_field()}}
          <input type="hidden" name="_method" value="DELETE" />
          <button type="submit" class="btn btn-danger">Delete</button>
        </form>
        </td>
        </tr>

        @endforeach
  </tbody>

【讨论】：