Показать скрытый Div остается скрытым при отправке - PullRequest
Новая
       16

Показать скрытый Div остается скрытым при отправке

0 голосов
/ 07 апреля 2020

Здравствуйте, у меня есть форма в модале. В этой форме есть кнопка отправки. У меня есть результаты, которые я хочу показать только при нажатии этой кнопки. Эти результаты находятся за пределами модальных и должны быть раскрыты после нажатия кнопки отправки. Мне удалось скрыть результаты, но я не могу их раскрыть. Вот что я получил: 

function onSubmit(){
    document.getElementById('submitButton').style.display = "none";
    document.getElementById('revealProgress').style.display = "block";
    return true;
}
#revealProgress{
    display: none;
}
    <button onclick =" window.location.href = '#close'; deleteData();  getData();;" href="#close" id="submitButton" class="tester2"  > Submit </button>
<div id = "revealProgress">

    <p>Exercise: <strong id="exerciseList"></strong></p></strong></p><br>
    <p>Sets: <strong id="setList"></strong></p></strong></p><br>
    <p>Reps: <strong id="repList"></strong></p></strong></p><br>
    <p>Weight: <strong id="weightList"></strong></p></strong></p><br>
    <p>total: <strong id="totalList"></strong></p></strong></p><br>

    <div id="progress_bar"></div>
</div>

Понимаете, что я делаю не так?

1 Ответ

1 голос
/ 07 апреля 2020

Вы вообще не использовали функцию JS, поэтому ничего не происходит!

Самое простое решение в вашем случае - заменить это: 

onclick =" window.location.href = '#close'; deleteData();  getData();;"

этим: 

onclick = "onSubmit()"

Вот рабочий фрагмент после этого: 

function onSubmit(){
    document.getElementById('submitButton').style.display = "none";
    document.getElementById('revealProgress').style.display = "block";
    return true;
}
#revealProgress{
    display: none;
}
    <button onclick = "onSubmit()" href="#close" id="submitButton" class="tester2"  > Submit </button>
<div id = "revealProgress">

    <p>Exercise: <strong id="exerciseList"></strong></p></strong></p><br>
    <p>Sets: <strong id="setList"></strong></p></strong></p><br>
    <p>Reps: <strong id="repList"></strong></p></strong></p><br>
    <p>Weight: <strong id="weightList"></strong></p></strong></p><br>
    <p>total: <strong id="totalList"></strong></p></strong></p><br>

    <div id="progress_bar"></div>
</div>
...