Проблема с крахом начальной загрузки, показывающая все падения одной кнопкой - PullRequest
0 голосов
/ 14 февраля 2019

Это снова я!Я возвращаюсь к вам, потому что у меня проблема с Bootstrap Collapse в моем проекте Laravel.

Итак, я использую Bootstrap 4.2 с Laravel 5.7, работающим на Apache 2. Все отлично работает, кроме этой проблемы с bootstrapсвернуть.

Так вот мой код:

@if(Auth::check())
<div class="col-md-12 mb-0">
  <div class="row">
    @foreach($message as $message)
     <div class="col-md-2">
      <div class="collapse multi-collapse" id="collapse-{{$message->id}}">
        <div class="font-weight-bold">
          <div id="pvMessage">
            @foreach($message->PrivateMessages as $msg)
            <div id="{{$msg->conversation_id}}">{{$msg->userInfo->name}} : {!! $msg->message !!}</div><br /> @endforeach
          </div>
        </div>

        <form class="pt-2">
          <input type="hidden" name="_token" value="{{ csrf_token() }}">
          <input type="hidden" name="user_id" value="{{Auth::user()->id}}" id="user_id" />
          <input type="hidden" name="conversation_id" value="{{$message->id}}" id="channel_id" />
          <div class="input-group mb-3">
            <input type="text" name="message" id="message" class="form-control">
            <div class="input-group-append">
              <input type="hidden" id="sendPv" />
            </div>
           </div>
        </form>
      </div>
    </div>
    @endforeach
  </div>

  <div id="private-message">
    @foreach($private as $private)
    <button onclick="clearInterval(getPvListe)" @if($private->latestMessage->seen == 0 && $private->latestMessage->user_id !== Auth::user()->id)
    class="btn btn-danger"
    @else
    class="btn btn-info"
    @endif
     type="button" data-toggle="collapse" data-target="#collapse-{{$private->id}}" aria-expanded="false" aria-controls="collapse-{{$private->id}}">
     @if($private->user_id != Auth::user()->id)
     {{$private->userInfo->name}}
    @elseif($private->to_id != Auth::user()->id)
     {{$private->toInfo->name}}
     @endif</button> @endforeach
  </div>
      @endif

Javascript:

var getPvListe = setInterval(function () {
    $("#private-message").load(location.href + " #private-message");
}, 2000);
setInterval(function () {
    $("#pvMessage").load(window.location.href + " #pvMessage");
}, 2000);

$("#message").on('keydown', function (e) {
    if (e.which == 13) {
        $("#sendPv").trigger('click');
        return false;
    }
 });
$("#sendPv").click(function (e) {
    e.preventDefault();
    var user_id = $("input[name='user_id']").val();
    var conversation_id = $("input[name='conversation_id']").val();
    var message = $("input[name='message']").val();
    var objDiv = document.getElementById("scrollable");
    $.ajax({
        type: 'POST',
        url: '/pv/sendPv',
        data: {
            message: message,
            conversation_id: conversation_id,
            user_id: user_id
        },
        success: function (data) {
            console.log(data.success);
            $("#message").val('').focus();
            objDiv.scrollTop = objDiv.scrollHeight;
        }
    });
 });

Я ожидаю, что весь крахпоказать правильно, с хорошими сообщениями при хороших идентификаторах.На самом деле, когда я открываю, например, коллапс-1, он показывает мне в коллапсе-1: коллапс-1 и коллапс-2 в том же, но когда я смотрю свой исходный код, все в порядке.

Edit

Когда я проверял свой код в Mozilla, я увидел, что эта часть:

setInterval(function () {
    $("#pvMessage").load(window.location.href + " #pvMessage");
}, 2000);

не работает должным образом, так как загружается слишком много, альтернатива?

1 Ответ

0 голосов
/ 14 февраля 2019

Если я не ошибаюсь, вам не хватает закрывающего тега:

<div class="col-md-12 mb-0">

до самого последнего

@endif
...