我最近开始使用bootstrap模式,并试图在@foreach循环内的按钮时钟上创建一个模态,但每当我按下按钮启动模态时,同样的模态出现,它甚至编辑同一地址的内容。 当我从数据库中将模态id更改为id时,模态不再出现。 这是循环的代码:
<div class="container">
<div class="panel-group" style="width: 100%;text-align: center;text-transform: capitalize">
<div class="panel-primary">
@foreach($data as $datas)
{{--@section('id','{{$datas->id}}')--}}
<div class="panel panel-heading" style="text-align: left;" id="{{$datas->id}}"><label class="col-sm-2 control-label" for="blogTitle">{{$datas->title}}</label>
</div>
<div class="panel panel-body ">
<label class="col-sm-2 col-md-offset-4 control-label" for="blogText">{{$datas->blogs}}</label>
<div class="container" style="align-content: right;">
<a href="{{url('/')}}/delete/{{$datas->id}}" class="btn btn-danger btn-lg"><span class="glyphicon glyphicon-remove"></span>Delete</a>
<button class="btn btn-warning btn-lg" data-toggle="modal" data-target="#{{$datas->id}}"><span class="glyphicon glyphicon-pencil"></span>Edit Blog</button>
</div>
</div>
@section('modal')
@parent
<!--Modal2-->
<div class="modal fade" id="{{$datas->id}}" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!--Modal Header-->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span>
<span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="modalTitle">Type Your Blog Here</h4>
</div>
<!--Modal Body-->
<div class="modal-body">
<form class="form-horizontal" method="post" action="{{URL('/')}}/post/{{$datas->id}}" role="form">
{{csrf_field()}}
<div class="form-group">
<label class="col-sm-2 control-label" for="inputTitle3">Title</label>
<div class="col-sm-10">
<input type="text" name="title" class="form-control" id="inputTitle3" value="{{$datas->title}}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="InputBlog3">Blog</label>
<div class="col-sm-10">
<textarea class="form-control" name="New_Blog_Content" id="InputBlog3">{{$datas->blogs}}</textarea>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-ok"></span>Update</button>
<button type="reset" class="btn btn-primary">Reset</button>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-warning" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
{{--@endsection--}}
@endforeach
答案 0 :(得分:0)
<div class="container">
@foreach($data as $datas)
<div class="panel-group" style="width: 100%;text-align: center;text-transform: capitalize">
<div class="panel-primary">
<div class="panel panel-heading" style="text-align: left; width:100%;align-content: stretch ;">
<label class="col-sm-2 control-label" for="blogTitle">{{$datas->title}}</label>
</div>
<div class="panel panel-body">
<label class="col-sm-2 control-label" style="width:100%;align-content: space-around;text-align: center" for="blogText">{{$datas->blogs}}</label>
</div>
<div class="panel-footer">
<a href="{{url('/')}}/delete/{{$datas->id}}" class="btn btn-danger btn-lg"><span class="glyphicon glyphicon-remove"></span>Delete</a>
<button class="btn btn-warning btn-lg" data-toggle="modal" data-target="#{{$datas->id}}"><span class="glyphicon glyphicon-pencil"></span>Edit</button>
</div>
</div>
</div>
<!--Modal-->
<div class="modal fade" id="{{$datas->id}}" role="dialog" aria-labelledby="{{$datas->id}}" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!--Modal Header-->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span class="glyphicon glyphicon-remove"></span>
<span class="sr-only">close</span>
</button>
<h4 class="modal-title" id="modalTitle{{$datas->title}}">Edit Your Blog Here</h4>
</div>
<!--Modal Body-->
<div class="modal-body">
<form class="form-horizontal" method="post" action="{{url('/')}}/edit/{{$datas->id}}" role="form">
<div class="form-group">
<label class="col-sm-2 control-label" for="InputBlogTitle">Title</label>
<div class="col-sm-10">
<input class="form-control" type="text" id="inputBlogTitle" value="{{$datas->title}}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="inputBlogContent">Blog</label>
<div class="col-sm-10">
<textarea class="form-control" id="inputBlogContent">{{$datas->blogs}}</textarea>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-warning btn-wide"><span class="glyphicon glyphicon-check"></span>Update </button>
<button type="reset" class="btn btn-primary btn-lg">Reset<span class="glyphicon glyphicon-repeat"></span></button>
</div>
</form>
<div class="modal-footer">
<button type="button" class="btn btn-warning close" data-dismiss="modal">Close<span class="glyphicon glyphicon-remove"></span></button>
</div>
</div>
</div>
</div>
</div>
@endforeach