根据从另一页面接收的数据显示DIV

Question

What i have

I've two pages, "home" and "grupo". In "home" exist 3 big DIVS with links for different companies sending to the same page, "grupo". In "grupo" i have 4 divs, wherein 3 of them are hidden, and the first visible.

My Code

View/Home.blade.php

<a href="grupo" title="Bignardi Papéis">
    <div class="pure-u-6-24" id="primeiraEmpresa">
        <img src="assets/images/front/home/bignardi-papeis.png" alt="Previz - Consultoria Previdenciária" class="pure-img" />
        <p class="textoEmpresa"><?php echo $paginaInicial->textochamadabignardi;?></p>
        <span class="leiaMais">+</span>
    </div>
</a>

<a href="grupo" title="Jandaia">
    <div class="pure-u-6-24">
        <img src="assets/images/front/home/logo-jandaia.png" alt="Previz - Consultoria Previdenciária" class="pure-img" />
       <p class="textoEmpresa"><?php echo $paginaInicial->textochamadajandaia;?></p>
        <span class="leiaMais">+</span>
    </div>
</a>

<a href="grupo" title="Jandaia Atacado de Papelaria">
    <div class="pure-u-6-24">
        <img src="assets/images/front/home/logo-jandaia-atacado.png" alt="Previz - Consultoria Previdenciária" class="pure-img" />
        <p class="textoEmpresa"><?php echo $paginaInicial->textochamadaatacadao;?></p>
        <span class="leiaMais">+</span>
    </div>
</a>

View/Grupo.blade.php

<div id="content0" class="pure-g show empresasjavascript">
    <div class="pure-u-16-24 textoEmpresa">
        {{$grupo->texto}}
        <div class="pure-g-">
            <div class="pure-u-1 linkExterno">
                <a href="http://{{$grupo->link}}" title="{{$grupo->titulo}}" target="_blank">PARA SABER MAIS, VISITE O WEBSITE DA {{$grupo->titulo}}</a>
            </div>
        </div>
    </div>
    <div class="pure-u-8-24 pure-u-sm-8-24">
        <img src="assets/images/grupo/{{$grupo->imagem}}" alt="{{$grupo->titulo}}" class="pure-img imagemEmpresa" title=""/>
    </div>
</div>

<div id="content1" class="pure-g hide empresasjavascript">
        <div class="pure-u-16-24 textoEmpresa">
            {{$grupo->texto}}
            <div class="pure-g-">
                <div class="pure-u-1 linkExterno">
                    <a href="http://{{$grupo->link}}" title="{{$grupo->titulo}}" target="_blank">PARA SABER MAIS, VISITE O WEBSITE DA {{$grupo->titulo}}</a>
                </div>
            </div>
        </div>
        <div class="pure-u-8-24 pure-u-sm-8-24">
            <img src="assets/images/grupo/{{$grupo->imagem}}" alt="{{$grupo->titulo}}" class="pure-img imagemEmpresa" title=""/>
        </div>
 </div>

<div id="content3" class="pure-g hide empresasjavascript">
            <div class="pure-u-16-24 textoEmpresa">
                {{$grupo->texto}}
                <div class="pure-g-">
                    <div class="pure-u-1 linkExterno">
                        <a href="http://{{$grupo->link}}" title="{{$grupo->titulo}}" target="_blank">PARA SABER MAIS, VISITE O WEBSITE DA {{$grupo->titulo}}</a>
                    </div>
                </div>
            </div>
            <div class="pure-u-8-24 pure-u-sm-8-24">
                <img src="assets/images/grupo/{{$grupo->imagem}}" alt="{{$grupo->titulo}}" class="pure-img imagemEmpresa" title=""/>
            </div>
 </div>

<div id="content4" class="pure-g hide empresasjavascript">
            <div class="pure-u-16-24 textoEmpresa">
                {{$grupo->texto}}
                <div class="pure-g-">
                    <div class="pure-u-1 linkExterno">
                        <a href="http://{{$grupo->link}}" title="{{$grupo->titulo}}" target="_blank">PARA SABER MAIS, VISITE O WEBSITE DA {{$grupo->titulo}}</a>
                    </div>
                </div>
            </div>
            <div class="pure-u-8-24 pure-u-sm-8-24">
                <img src="assets/images/grupo/{{$grupo->imagem}}" alt="{{$grupo->titulo}}" class="pure-img imagemEmpresa" title=""/>
            </div>
 </div>

What i want

I don't want to use PHP, but Javascript.Let me give an example: When i click in the link(in view "Home) "title='Jandaia'(the second link) i want the page "Grupo" not show de div with class "content0" but "content1", changing the class "hide" to "show".

Answer 1

If you're not rendering everything onto the page and hiding it first, but utilizing things like Ajax, it becomes a more trivial problem. It goes along these lines:

• Identify the link the user clicked on
• Ajax the parameter to some resource end point that can retrieve the info you want based on the parameter
• The end point that receives the ajax call should provide a data result that can be displayed
• Display the result in a result container

In terms of JS code, using jQuery, you could do something along these lines:

var identificator = $('a').attr('id');
$.ajax({
  type: "POST",
  url: "get-data.php",
  data: { data: identificator }
})
.done(function(response) {
 $('div#response-container').html(response);
});