如何使用 laravel 添加跳转功能

Question

我想实现一个跳转到功能。它基本上就像一个面包屑，但不完全是。它是dropdown，可以有左右按钮。请参阅下面的代码：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">


<div class="btn-group" role="group" aria-label="...">
  <a href="previousItemIfHas" class="btn btn-default">←</a>

  <div class="btn-group" role="group">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      Jump to
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
      <li><a href="#">Assignment1</a></li>
      <li><a href="#">Quiz2</a></li>
      <li><a href="#">Quiz4</a></li>
      <li><a href="#">Assignment2</a></li>
    </ul>
  </div>
  
  <a href="nextItemIfHas" class="btn btn-default">→</a>
</div>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

控制器

$course = Course::with([
   'assignments' => $undeleted,
   'quizzes' => $undeleted,
   'add_links' => $undeleted
])->findOrFail($course_id);
$course_items = collect($course->assignments);
$course_items = $course_items->merge(collect($course->quizzes));
$course_items = $course_items->merge(collect($course->add_links));
$course_items = $course_items->sortBy('item_number');

想要的结果：
如果$course 循环，它可以列出按item_number 排序的项目。如果你点击第一项，那么应该有no left arrow，和最后一项一样，如果你点击最后一项，应该有no @987654329 @。项目列表在我创建的dropdown 中列出。

问题 如果item 是第一项，我不知道如何添加条件，这样我就可以删除左键，与最后一项相同。

注意：我使用的是 laravel 5.1

Answer 1

我认为你的意思是在模板中：

你可以使用

@foreach ($users as $user)
  <p>This is user {{ $user->id }}</p>
@endforeach

在“foreach”循环中你有变量循环

@foreach ($users as $user)

@if ($user == reset($users )) 
    This is the first iteration.
@endif

@if ($user == end($users))
    This is the last iteration.
@endif

<p>This is user {{ $user->id }}</p>

@endforeach

这样你就可以看到是第一项还是最后一项

更多：

http://php.net/manual/en/function.reset.php

http://php.net/manual/en/function.end.php

Answer 2

你好试试这个

它会从没有上一个按钮开始，当你点击任何有上一个的东西时，会显示上一个，当你点击任何没有下一个的东西时，下一个将被隐藏..等等..

将 id="next" 赋予下一个按钮，将 id="prev" 赋予上一个按钮

请运行这个 sn-p

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">


<div class="btn-group" role="group" aria-label="...">
  <a href="previousItemIfHas" class="btn btn-default" id="prev">←</a>

  <div class="btn-group" role="group">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      Jump to
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
      <li><a href="#">Assignment1</a></li>
      <li><a href="#">Quiz2</a></li>
      <li><a href="#">Quiz4</a></li>
      <li><a href="#">Assignment2</a></li>
    </ul>
  </div>
  
  <a href="nextItemIfHas" class="btn btn-default" id="next">→</a>
</div>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script>
$('#prev').hide();
$(".dropdown-menu li").click(function(){
      if($(this).next('li').length <= 0) {
      $('#next').hide();
      } else {
          $('#next').show();
      }

      if($(this).prev('li').length <= 0) {
           $('#prev').hide();
      } else {
           $('#prev').show();
      }
    
   });
</script>