Show items according to click

Question

Show items according to click

Navigation

#1 by (1 votes)

0

In my view I have 5 partials that must be rendered. I needed that clicking one is shown and the others are hidden ...

It's in this structure:

<ul class="nav nav-tabs">
            <li class="active"><a href="#cliente">Cliente</a></li>
            <li><a href="#anamnese">Anamnese</a></li>
            <li><a href="#recordatorio">Recordatorio</a></li>
        </ul>

        <div id="cliente">
            @Html.Partial("_PartialCliente", Model)
        </div>

        <div id="anamnese">
            @Html.Partial("_PartialAnaminese", Model)
        </div>

        <div id="recordatorio">
            @Html.Partial("_PartialRecordatorio", Model)
            @Html.Partial("_PartialRefeicao", Model)
            @Html.Partial("_PartialQuestionarioFrequenciaAlimentar", Model)
        </div>

How could I do this? That is, how could I click on the client tab and show only the partial referent and the others are hidden and in the same way for the others?

javascript asp.net-mvc razor

asked by anonymous 30.05.2016 / 04:28

1 answer

How to get data from a text file with java? get the values of the combo fields before recording

score 1 · Accepted Answer

Well, you can always use hide class together with partial , <div id="recordatorio" class="partial hide"> then anything like (pseudo-code):

document.querySelectorAll('.partial').map(function() { this.onClick = function() {
        this.classname.slice(this.classname.indexOf('hide'),1);
        // ... e o codigo para adicionar o 'hide' a todos os outros
    }; 
});

Basically, with each click on partial it would take the hide of the element itself and apply it to all others that do not have hide but are partial s.