Include php in bootstrap takes me to the top

Question

Include php in bootstrap takes me to the top

Navigation

#1 by (2 votes)

0

As the title says, adding an include in a bootstrap template and pressing the "calculate" button takes me back to the top of the page.

The include is a calculator and the codes that fail can be:

<section id="calcular">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2>Calculadora</h2>
                    <hr>
<?php include 'calculator.php'?>
                </div>

            </div>

and the form is:

    <form method="post">
    <div class="calculator_div">
        <div>
<input type="radio" value="metric" name="system" <?php if($_SESSION['bmi_calc_system']!='' and $_SESSION['bmi_calc_system']=='metric') ;?> onclick="changeSystem('metric');"> Metrico &nbsp;
<input type="radio" value="english" name="system" <?php if($_SESSION['bmi_calc_system']=="" or $_SESSION['bmi_calc_system']=='english') ;?> onclick="changeSystem('english');"> Ingles


</div>
        <div><label>Tu peso:</label>
            <span id="englishWeight" style="display:<?php echo ($_SESSION['bmi_calc_system']=='' or $_SESSION['bmi_calc_system']=='english')?'block':'none'?>;"><input type="text" name="weight_en" size="6" value="<?php echo !empty($_SESSION['bmi_calc_weight_en'])?$_SESSION['bmi_calc_weight_en']:""?>"> lbs</span>
            <span id="metricWeight" style="display:<?php echo (($_SESSION['bmi_calc_system']=="" or $_SESSION['bmi_calc_system']=='english'))?'none':'block'?>;"><input type="text" name="weight_met" size="6" value="<?php echo !empty($_SESSION['bmi_calc_weight_met'])?$_SESSION['bmi_calc_weight_met']:""?>"> kg</span>
        </div>   
        <div><label>Tu altura:</label>
            <span id="englishHeight" style="display:<?php echo (($_SESSION['bmi_calc_system']=='' or $_SESSION['bmi_calc_system']=='english'))?'block':'none'?>;"><input type="text" size="6" name="height_ft_en" value="<?php echo !empty($_SESSION['bmi_calc_height_ft_en'])?$_SESSION['bmi_calc_height_ft_en']:""?>"> ft
            &nbsp; <input type="text" size="6" name="height_in_en" value="<?php echo ($_SESSION['bmi_calc_height_in_en']!='')?$_SESSION['bmi_calc_height_in_en']:""?>"> in</span>
            <span id="metricHeight" style="display:<?php echo ($_SESSION['bmi_calc_system']=='' or $_SESSION['bmi_calc_system']=='english')?'none':'block'?>;">
            <input type="text" name="height_met" size="6" value="<?php echo ($_SESSION['bmi_calc_height_met']!='')?$_SESSION['bmi_calc_height_met']:""?>"> cm
            </span>
        </div>
        <div align="center">
            <input type="hidden" name="calculator_ok" value="ok">
<br><br>

<button type="submit" class="btn btn-success btn-lg">Calcular !!!</button>

        </div>

    </div>    
    </form>

If I need to add any information tell me, and thanks for taking the time to help

php bootstrap

asked by Matt 29.01.2017 в 13:53

source

1 answer

Update a selectbox using ajax What would be the optimal way to do this?

score 2 · Accepted Answer

The problem is that you are clicking on the calculate button, sub-submitting the formula, as you did not specify the attribute action is redirecting sending the information to the same page.

Therefore, it is not taking you to the top, you are reloading the page. If you want to avoid this problem you could put a button like this

<button type="button" class="btn btn-success btn-lg">Calcular !!!</button>

Declaring the type="button" will not make a submit of the form when it is clicked, therefore you will not send the information you need to do the calculation. I think a solution with javascript will be more convenient if you want to remove the scroll to the automatic top.