如何将值传递到模态形式laravel 5.2
我是拉拉维尔的初学者 我使用的是Laravel 5.2 我在welcome.blade.php中有一个标签，它指向data target=myModal，这个模式表单是我在另一个页面中创建的，包含在4个页面中，我需要它预览与此页面和产品相关的产品详细信息 例如，在欢迎页面中，当我单击产品的快速视图时，它调用此弹出表单，并为其提供一个id以查询和获取所有产品详细信息如何将值传递到模态形式laravel 5.2,laravel,laravel-5.2,Laravel,Laravel 5.2,我是拉拉维尔的初学者 我使用的是Laravel 5.2 我在welcome.blade.php中有一个标签，它指向data target=myModal，这个模式表单是我在另一个页面中创建的，包含在4个页面中，我需要它预览与此页面和产品相关的产品详细信息 例如，在欢迎页面中，当我单击产品的快速视图时，它调用此弹出表单，并为其提供一个id以查询和获取所有产品详细信息 <!-- Quick View Content Start --> <div cl
<!-- Quick View Content Start -->
<div class="modal fade" id="myModal" role="dialog">
<!-- Modal Dialog Box Start -->
<div class="modal-dialog max-width">
<!-- Modal content Start -->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<!-- Modal Body Start -->
<div class="modal-body">
<div class="quiick-view-details">
<!-- Product Thumbnail Start -->
<div class="main-product-thumbnail">
<div class="row">
<!-- Main Thumbnail Image Start -->
<div class="col-sm-5">
<!-- Thumbnail Large Image start -->
<div class="tab-content">
<div id="home" class="tab-pane fade in active">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/new-products\3_1.jpg"><img src="{{ Request::root() }}/website/img/accessories\8.jpg" alt="product-view"></a>
</div>
<div id="menu1" class="tab-pane fade">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/best-seller\6_1.jpg"><img src="{{ Request::root() }}/website/img/accessories\7_1.jpg" alt="product-view"></a>
</div>
<div id="menu2" class="tab-pane fade">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/best-seller\6_2.jpg"><img src="{{ Request::root() }}/website/img/best-seller\6_2.jpg" alt="product-view"></a>
</div>
<div id="menu3" class="tab-pane fade">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/best-seller\4_2.jpg"><img src="{{ Request::root() }}/website/img/best-seller\4_2.jpg" alt="product-view"></a>
</div>
<div id="menu4" class="tab-pane fade">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/best-seller\9_2.jpg"> <img src="{{ Request::root() }}/website/img/best-seller\9_2.jpg" alt="product-view"></a>
</div>
<div id="menu5" class="tab-pane fade">
<a data-fancybox="images" href="{{ Request::root() }}/website/img/accessories\7_2.jpg"><img src="{{ Request::root() }}/website/img/accessories\7_2.jpg" alt="product-view"></a>
</div>
</div>
<!-- Thumbnail Large Image End -->
<!-- Thumbnail Image End -->
<div class="product-thumbnail">
<div class="thumb-menu owl-carousel">
<div class="active">
<a data-toggle="tab" href="#home"> <img src="{{ Request::root() }}/website/img/thumbnail\1.jpg" alt="product-thumbnail"></a>
</div>
<div>
<a data-toggle="tab" href="#menu1"> <img src="{{ Request::root() }}/website/img/thumbnail\2.jpg" alt="product-thumbnail"></a>
</div>
<div>
<a data-toggle="tab" href="#menu2"> <img src="{{ Request::root() }}/website/img/thumbnail\3.jpg" alt="product-thumbnail"></a>
</div>
<div>
<a data-toggle="tab" href="#menu3"> <img src="{{ Request::root() }}/website/img/thumbnail\4.jpg" alt="product-thumbnail"></a>
</div>
<div>
<a data-toggle="tab" href="#menu4"> <img src="{{ Request::root() }}/website/img/thumbnail\5.jpg" alt="product-thumbnail"></a>
</div>
<div>
<a data-toggle="tab" href="#menu5"> <img src="{{ Request::root() }}/website/img/thumbnail\6.jpg" alt="product-thumbnail"></a>
</div>
</div>
</div>
<!-- Thumbnail image end -->
</div>
<!-- Main Thumbnail Image End -->
<!-- Thumbnail Description Start -->
<div class="col-sm-7">
<div class="thubnail-desc fix">
<h2 class="product-header">Fusion Backpack</h2>
<div class="pro-ref">
<p><label>المخزون :</label><span class="stock" title="abailability">متاح فى المخزن</span></p>
<p><label class="text-uppercase">sku:</label><span>25-UG05</span></p>
</div>
<div class="rating-summary fix mtb-10">
<div class="rating-feedback f-right">
<a href="#">(1 تعليق)</a>
<a href="#">أضف الى تعليقك</a>
</div>
<div class="rating f-right">
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
</div>
</div>
<div class="pro-price mb-15">
<span>$19.00</span>
</div>
<div class="box-quantity mb-30">
<form action="#">
<input class="number" id="number" type="number" value="1">
<button class="action-prime">أضف الى السلة</button>
</form>
</div>
<div class="product-social-link">
<ul class="list-inline">
<li><a href="#">أضف الى المفضلة</a></li>
<li><a href="#">أضف الى المقارنة</a></li>
<li><a href="#">ارسل بالبريد الالكترونى</a></li>
</ul>
</div>
<p class="ptb-30">وصف المنتج.</p>
</div>
</div>
<!-- Thumbnail Description End -->
</div>
<!-- Row End -->
<!-- Product Thumbnail Description Start -->
<div class="thumnail-desc">
<div class="row">
<div class="col-sm-12">
<ul class="main-thumb-desc pt-30">
<li class="active"><a data-toggle="tab" href="#dtails">التفاصيل</a></li>
<li><a data-toggle="tab" href="#reviews">التعليقات</a></li>
</ul>
<!-- Product Thumbnail Tab Content Start -->
<div class="tab-content thumb-content">
<div id="dtails" class="tab-pane fade in active">
<p>مواصفات المنتج<br>
<ul>
<li>Durable nylon construction.</li>
<li>2 main zippered compartments.</li>
<li>1 exterior zippered pocket.</li>
<li>Mesh side pouches.</li>
<li>Padded, adjustable straps.</li>
<li>Top carry handle.</li>
<li>Dimensions: 18" x 10" x 6".</li>
</ul>
</div>
<div id="reviews" class="tab-pane fade">
<!-- Reviews Start -->
<div class="review pb-40">
<h3 class="review-title mb-35">تعليقات الزوار</h3>
<h4 class="review-mini-title">Plazathemes</h4>
<ul class="review-list">
<!-- Single Review List Start -->
<li>
<span>الجودة</span>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<label>Plazathemes</label>
</li>
<!-- Single Review List End -->
<!-- Single Review List Start -->
<li>
<span>السعر</span>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<label>Review by Plazathemes</label>
</li>
<!-- Single Review List End -->
<!-- Single Review List Start -->
<li>
<span>القيمة</span>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<label>Posted on 7/20/16</label>
</li>
<!-- Single Review List End -->
</ul>
</div>
<!-- Reviews End -->
<!-- Reviews Start -->
<div class="review pt-50">
<h3 class="review-title mb-30">You're reviewing: <br><span>Go-Get'r Pushup Grips</span></h3>
<p class="mb-10 req">your rating</p>
<ul class="review-list">
<!-- Single Review List Start -->
<li>
<span>الجودة</span>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
</li>
<!-- Single Review List End -->
<!-- Single Review List Start -->
<li>
<span>السعر</span>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
</li>
<!-- Single Review List End -->
<!-- Single Review List Start -->
<li>
<span>القيمة</span>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
<i class="zmdi zmdi-star-outline"></i>
</li>
<!-- Single Review List End -->
</ul>
</div>
<!-- Reviews End -->
<!-- Reviews Field Start -->
<div class="riview-field mt-30">
<form autocomplete="off" action="#">
<div class="form-group">
<label class="req" for="n-name">اسمك</label>
<input type="text" class="form-control" id="n-name" required="required">
</div>
<div class="form-group">
<label class="req" for="summary">عنوان التعليق</label>
<input type="text" class="form-control" id="summary" required="required">
</div>
<div class="form-group">
<label class="req" for="comment">التعليق</label>
<textarea class="form-control" rows="5" id="comment" required="required"></textarea>
</div>
<button type="submit" class="btn-default">أضف التعليق</button>
</form>
</div>
<!-- Reviews Field Start -->
</div>
</div>
<!-- Product Thumbnail Tab Content End -->
</div>
</div>
<!-- Row End -->
</div>
<!-- Product Thumbnail Description End -->
</div>
<!-- Product Thumbnail End -->
</div>
<!-- Quick View Details End -->
</div>
<!-- Modal Body End -->
</div>
<!-- Modal Content End -->
</div>
<!-- Modal Dialog Box End -->
</div>
<!-- Quick View Content End -->
为此，可以使用jquery。默认情况下，你应该使用css隐藏模式
然后，当用户单击按钮时，u将使用onclick调用javascript函数，并将产品id传递给它。调用该函数后，您将向服务器发送一个ajax请求，获取详细信息，并使用类和id选择器将返回的数据设置到模式中，最后一步，您将向用户显示模式 在javascript代码中尝试此操作
<script>
$(document).on('click', '.show-modal', function() {
$("#picture_show").prop("src", "{{ URL::asset('img/products/')}}/"+$(this).data('target'));
});
</script>
你的问题到底是什么？请解释您迄今为止所做的尝试，以及哪些不起作用，以及您希望实现的目标。目前的解释太宽泛了，因为没有具体的问题。我做了一些改变，这是新的，我看到了，这个模式没有打开？或者模态有什么问题？我对模态做了这个更改，添加了这个输入来检查结果，我有这个jquery代码来执行{！！Html:：script'website/js/vendor/jquery-1.12.4.min.js'！！}$document.onclick，.showmodal，function{var myProductId=$this.data'id'；$myModal productId.val myProductId；$.ajax{url:'/getProduct/do_ajax'，方法：'POST'，数据：{id:myProductId}，成功：functiondata{if data{$collected\u data=data；}}}}；}；并使此函数在控制器公共函数中执行\u ajaxRequest$request，$id{if$request->ajax{$data=war\u types\u Model:：where['id'=>id]->get；return json_encodecompact'data'；}}，这是我的路线：：post'/getProduct/do_ajax'，Category_Controller@do_ajax“；需要将此id从页面发送到modal，并通过ajax或其他方式检索产品详细信息注意：我有许多动态标记