0
votes

Hello the javascript code below allows you to change the display of a container or not in javascript, to do it I use the js code below that allows you to change the display of the css containers, but the code does not show me container 2 or container 1 but it displays a blank page what is it for?

PHP CODE:

<?php


defined('_JEXEC') or die();
header('Content-type: text/css; charset: UTF-8');
$required_new = 'required';
if (
    $account['id']['value'] != null &&
    strcmp($account['id']['value'], '') != 0
) {
    $required_new = '';
}
?>
<style>
    .container {
        background-color: white;
        color: white;
        visibility: hidden;
        display: none;
    }

    .container2 {
        background-color: white;
        color: white;
        visibility: visible;
        margin-bottom: 100px;
        display: contents;
    }

    .container3 {
        background-color: white;
        color: white;
        visibility: hidden;
        margin-bottom: 100px;
        display: none;
    }
</style>
<div class="jsn-bootstrap3">
    <!-- Tab links -->
    <div class="tab">
        <button class="tablinks" onclick="onclick1()">Descrizione Azienda</button>
        <button class="tablinks" onclick="onclick2()">Dati Aziendali</button>
        <button class="tablinks" onclick="onclick3()">Procurement Code</button>
        <button name="goto" id="goto" class="tablinks">Salva e Invia</button>
    </div>

    <div class="row" id="descrizioneazienda">

        <div class="col-lg-12">

            <div class="row">
                <div class="col-lg-8 col-lg-offset-2">
                    <div class="row">

                        <!-- Form dati azienda-->
                        <form id="new_auction" action="<?php echo htmlspecialchars(
                            JUri::current(),
                            ENT_COMPAT,
                            'UTF-8'
                        ); ?>" method="POST" enctype="multipart/form-data" class="container2">
                            <input type="hidden" id="account_id" name="account_id" value="<?php echo $account[
                                'id'
                            ]['value']; ?>">
                            <input type="hidden" id="contact_id" name="contact_id" value="<?php echo $account[
                                'ilo_contact'
                            ]['id']['value']; ?>">

                            <div class="form-group">
                                <label for="name">Nome</label>
                                <input type="text" class="form-control" id="name" name="name" value="<?php echo $account[
                                    'name'
                                ][
                                    'value'
                                ]; ?>" placeholder="" maxlength="70" required>
                            </div>
                            <div class="form-group">
                                <label for="showcase_description_c">Principali attività aziendali</label>
                                <textarea class="form-control" name="showcase_description_c" id="showcase_description_c" rows="3" required><?php echo $account[
                                    'showcase_description_c'
                                ]['value']; ?></textarea>
                            </div>

                            <div class="form-group text-center">
                                <h4>Oggetto delle forniture industriali</h4>
                            </div>
                            <div class="form-group">
                                <label for="products_c">Prodotti</label>
                                <textarea class="form-control" name="products_c" id="products_c" rows="6"><?php echo $account[
                                    'products_c'
                                ]['value']; ?></textarea>
                            </div>
                            <div class="form-group">
                                <label for="services_c">Servizi</label>
                                <textarea class="form-control" name="services_c" id="services_c" rows="6"><?php echo $account[
                                    'services_c'
                                ]['value']; ?></textarea>
                            </div>

                            <div class="form-group">
                                <label for="competitive_edge_c">Ciò che rende speciale l'azienda rispetto ai competitors</label>
                                <textarea class="form-control" name="competitive_edge_c" id="competitive_edge_c" rows="3" required><?php echo $account[
                                    'competitive_edge_c'
                                ]['value']; ?></textarea>
                            </div>

                            <div class="form-group">
                                <label for="foundation_year_c">Fondata l'anno</label>
                                <input type="number" class="form-control" id="foundation_year_c" name="foundation_year_c" value="<?php echo $account[
                                    'foundation_year_c'
                                ][
                                    'value'
                                ]; ?>" placeholder="1990" maxlength="4" required>
                            </div>
                            <div class="form-group">
                                <label for="employees">Numero dipendenti</label>
                                <?php echo $employees; ?>
                            </div>
                            <div class="form-group">
                                <label for="main_locations_c">Sede principale</label>
                                <input type="text" class="form-control" id="main_locations_c" name="main_locations_c" value="<?php echo $account[
                                    'main_locations_c'
                                ]['value']; ?>" placeholder="" required>
                            </div>
                            <div class="form-group">
                                <label for="company_size_c">Grandezza azienda</label>
                                <?php echo $company_size_c; ?>
                            </div>
                            <div class="form-group">
                                <label for="revenues_c">Turnover</label>
                                <?php echo $revenues_c; ?>
                            </div>
                            <div class="form-group">
                                <label for="revenue_period_c">Anno di riferimento turnover</label>
                                <input type="number" class="form-control" id="revenue_period_c" name="revenue_period_c" value="<?php echo $account[
                                    'revenue_period_c'
                                ][
                                    'value'
                                ]; ?>" placeholder="1990" maxlength="4">
                            </div>

                            <div class="form-group">
                                <label for="logo">Logo</label>
                                <input type="file" id="logo" name="logo" <?php echo $required_new; ?>>
                                <!--p class="help-block">Example block-level help text here.</p-->
                            </div>

                            <div class="form-group text-center">
                                <h4>Contatto</h4>
                            </div>
                            <div class="form-group">
                                <label for="contact_first_name">Nome</label>
                                <input type="text" class="form-control" id="contact_first_name" name="contact_first_name" value="<?php echo $account[
                                    'ilo_contact'
                                ]['first_name'][
                                    'value'
                                ]; ?>" placeholder="" required>
                            </div>
                            <div class="form-group">
                                <label for="contact_last_name">Cognome</label>
                                <input type="text" class="form-control" id="contact_last_name" name="contact_last_name" value="<?php echo $account[
                                    'ilo_contact'
                                ]['last_name'][
                                    'value'
                                ]; ?>" placeholder="" required>
                            </div>
                            <div class="form-group">
                                <label for="contact_phone_work">Telefono</label>
                                <input type="text" class="form-control" id="contact_phone_work" name="contact_phone_work" value="<?php echo $account[
                                    'ilo_contact'
                                ]['phone_work'][
                                    'value'
                                ]; ?>" placeholder="+3902123456" required>
                            </div>
                            <div class="form-group">
                                <label for="contact_email">Email</label>
                                <input type="email" class="form-control" id="contact_email" name="contact_email" value="<?php echo $account[
                                    'ilo_contact'
                                ]['email1'][
                                    'value'
                                ]; ?>" placeholder="[email protected]" required>
                            </div>


                            <div class="form-group">
                                <label for="competences_c">Competenze Significative dell'azienda</label>
                                <textarea class="form-control" name="competences_c" id="competences_c" rows="6" required><?php echo $account[
                                    'competences_c'
                                ]['value']; ?></textarea>
                            </div>
                            <div class="form-group">
                                <label for="key_equipment_c">Dotazioni Significative dell'azienda (attrezzature/macchinari)</label>
                                <textarea class="form-control" name="key_equipment_c" id="key_equipment_c" rows="6" required><?php echo $account[
                                    'key_equipment_c'
                                ]['value']; ?></textarea>
                            </div>

                            <div class="form-group">
                                <label for="markets_c">Mercati di riferimento</label>
                                <textarea class="form-control" name="markets_c" id="markets_c" rows="6" required><?php echo $account[
                                    'markets_c'
                                ]['value']; ?></textarea>
                            </div>
                            <div class="form-group">
                                <label for="assignments_c">Principali clienti/referenze</label>
                                <textarea class="form-control" name="assignments_c" id="assignments_c" rows="6" required><?php echo $account[
                                    'assignments_c'
                                ]['value']; ?></textarea>
                            </div>
                            <div class="form-group">
                                <label for="certifications_c">Certificazioni</label>
                                <textarea class="form-control" name="certifications_c" id="certifications_c" rows="3" required><?php echo $account[
                                    'certifications_c'
                                ]['value']; ?></textarea>
                            </div>

                            <div class="form-group">
                                <label for="photo">Foto significativa dei propri prodotti o servizi</label>
                                <input type="file" id="photo" name="photo" <?php echo $required_new; ?>>
                                <!--p class="help-block">Formato quadrato, tra i 300x300 ed i 2000x2000 pixel</p-->
                            </div>




                        </form>

                    </div>


                </div>


                <!-- Form dati azienda-->
                <form id="new_auction" action="<?php echo htmlspecialchars(
                    JUri::current(),
                    ENT_COMPAT,
                    'UTF-8'
                ); ?>" method="POST" enctype="multipart/form-data" class="container3">
                    <div class="form-group">
                        <label for="ragionesociale_c">Ragione Sociale</label>
                        <textarea class="form-control" name="ragionesociale_c" id="ragionesociale_c" rows="3" required><?php echo $account[
                            'ragioneosociale_c'
                        ]['value']; ?></textarea>
                    </div>
                   <!-- <div class="form-group text-center">
                        <button type="submit" name="goto" id="goto" class="btn btn-primary">INVIA</button>
                    </div>-->
                </form>
                <!-- Form dati azienda-->
                <form id="new_auction" action="<?php echo htmlspecialchars(
                    JUri::current(),
                    ENT_COMPAT,
                    'UTF-8'
                ); ?>" method="POST" enctype="multipart/form-data" class="container">
                    <div class="form-group">
                        <label for="ragionesociale_c">Ragione Sociale</label>
                        <textarea class="form-control" name="ragionesociale_c" id="ragionesociale_c" rows="3" required><?php echo $account[
                            'ragioneosociale_c'
                        ]['value']; ?></textarea>
                    </div>
                    <label for="partitaiva_c">Partita IVA:</label>
                    <p></p>
                    <textarea class="form-control" name="partitaiva_c" id="partitaiva_c" rows="3" required></textarea>
            </div>

            </form>

        </div>
    </div>
</div>


</div>


<script type="text/javascript">
    function onclick1() {
        //Visualizzo i dati aziendali
        element = document.querySelector('.container');
        element.style.visibility = 'visible';
        element.style.display = 'contents';
        element2 = document.querySelector('.container2');
        element2.style.visibility = 'hidden';
        element2.style.display = 'none';
        element2.remove();
        element3 = document.querySelector('.container3');
        element3.style.visibility = 'hidden';
        element3.style.display = 'none';

    }

    function onclick2() {
        element = document.querySelector('.container');
        element.style.visibility = 'hidden';
        element.style.display = 'none';
        element2 = document.querySelector('.container2');
        element2.style.visibility = 'visible';
        element2.style.display = 'contents';
        element3 = document.querySelector('.container3');
        element3.style.visibility = 'hidden';
        element3.style.display = 'none';
    }

    function onclick3() {
        element = document.querySelector('.container');
        element.style.visibility = 'hidden';
        element.style.display = 'none';
        element2 = document.querySelector('.container2');
        element2.style.visibility = 'hidden';
        element2.style.display = 'none';
        element3 = document.querySelector('.container3');
        element3.style.visibility = 'visible';
        element3.style.display = 'contents';
    }

    function onsave() {

    }