每当用户从下拉框中选择一个项目时,我想在类中添加if
和foreach
语句。
应该添加的标签是:
@if($article->tags)
@foreach($article->tags as $articletag)
@if($articletag->tag == $(this).text())
$(this).text()
是用户点击下拉框的文字。这些if
和foreach
的目的是在用户从下拉框中选择项目时根据filtername($this.text())
过滤表格。我该怎么做?
JavaScript运行之前的HTML内容:
<div class="content">
@if($articles)
@foreach($articles as $article)
<div class="row article art-content">
<div class="col-xs-12 col-md-6 hidden-xs hidden-sm">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
<img src="{{ url('image').'/'.$article->featured_image }}?w=460&h=267&fit=crop" alt="" class="img-responsive"/>
</a>
</div>
<div class="col-xs-12 col-md-6 hidden-md hidden-lg">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
<?php $image = $article->mobile_image != null ? $article->mobile_image : $article->featured_image; ?>
<img src="{{ url('image').'/'.$image }}?h=imageHeight" alt="" class="img-responsive"/>
</a>
</div>
<div class="col-xs-12 col-md-6">
<h3 class="article-title">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
{{ $article->title }}
</a>
</h3>
<span>Published on: {{ date('M d, Y', strtotime($article->published_on)) }}</span>
<div class="spacer20"></div>
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}" class="btn btn-primary">Read Article <i class="fa fa-chevron-right fa-fw"></i> </a>
</div>
</div>
<hr/>
@endforeach
<div class="text-center">
{!! $articles->render() !!}
</div>
@else
<div class="row spacer50 text-center">
<div class="col-xs-12 spacer50">
<h4>The key you entered does not match any articles. <br/>Please click <a href="{{ url('articles') }}">here</a> to see a list of all available articles.</h4>
</div>
</div>
@endif
JavaScript执行时的HTML内容:
<div class="content">
@if($articles)
@foreach($articles as $article)
@if($article->tags) //added line
@foreach($article->tags as $articletag) //added line
@if($articletag->tag == 'whatever text the dropdown clicks') //added line
<div class="row article art-content">
<div class="col-xs-12 col-md-6 hidden-xs hidden-sm">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
<img src="{{ url('image').'/'.$article->featured_image }}?w=460&h=267&fit=crop" alt="" class="img-responsive"/>
</a>
</div>
<div class="col-xs-12 col-md-6 hidden-md hidden-lg">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
<?php $image = $article->mobile_image != null ? $article->mobile_image : $article->featured_image; ?>
<img src="{{ url('image').'/'.$image }}?h=imageHeight" alt="" class="img-responsive"/>
</a>
</div>
<div class="col-xs-12 col-md-6">
<h3 class="article-title">
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}">
{{ $article->title }}
</a>
</h3>
<span>Published on: {{ date('M d, Y', strtotime($article->published_on)) }}</span>
<div class="spacer20"></div>
<a href="{{ url('article/'.$article->category->slug.'/'.$article->slug) }}" class="btn btn-primary">Read Article <i class="fa fa-chevron-right fa-fw"></i> </a>
</div>
</div>
<hr/>
@endif
@endforeach
@endif
@endforeach
<div class="text-center">
{!! $articles->render() !!}
</div>
@else
<div class="row spacer50 text-center">
<div class="col-xs-12 spacer50">
<h4>The key you entered does not match any articles. <br/>Please click <a href="{{ url('articles') }}">here</a> to see a list of all available articles.</h4>
</div>
</div>
@endif
JavaScript的:
$('#tags li').on('click', function(){
$('.content').hide();
if($(this).text() == 'All')
$('.content').fadeIn('slow');
else {
//add the @foreach and @ifs
}
});
答案 0 :(得分:0)
看起来您正在使用Laravel Blade模板引擎,它是在服务器中编译的。因此无法通过JavaScript进行更改。他们不能一起使用。
这样的代码是错误的
@if($articletag->tag == $(this).text())
所以你的需求无法实现。也许你应该改变思路,找到另一种方式。