CODEWITHSUNDEEP
javascriptphpforms
ginette
ginette

Reputation: 55

auto submit form refresh every second

I have a little problem with this code :

          <form class="form-horizontal" method="post" action="{{ route('bilan.resultat.add', ['bilanId' => $bilan->id] )}}" id="form" name="formu">
        {{ csrf_field() }}
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Sexe</th>
            <th>Age</th>
            <th>Taille</th>
            <th>Poids</th>
          </tr>
        </thead>
        <tbody class="text-primary">
          <tr>
            <td><input id="age" size="7" maxlenght="3" name="valage" value="{{ $bilan->age }}" readonly></td>
            <td><input size="7" maxlenght="3" name="valtaille" value="{{ $bilan->Taille_cm }}" readonly></td>
            <td><input type="hidden" size="2" maxlenght="3" id="anc_id" name="anc_id" value="{{ $bilan->resultat->anc_id }}" readonly></td>
            <td><a href="/bilans" class="btn btn-outline-primary pull-right" role="button">Retour</a></td>
          </tr>
        </tbody>
      </table>
      <table class="table table-responsive">
        <tr>
          <td><p class="text-primary">Indice de masse corporelle (IMC)</p></td>
          <td><input name="imc" size="5" value="@if($bilan->resultat !== null) {{ $bilan->resultat->imc }} @endif"/></td>
          <td><p hidden class="text-primary">Fréquence cardiaque maximale</p></td>
          <td><input type="hidden" name="fcm" size="5" value="@if($bilan->resultat !== null) {{ $bilan->resultat->fcm }} @endif"/><a hidden>  b/min</a></td>
        </tr>
        <tr>
          <td><p class="text-primary">Distance minimale normale</p></td>
          <td><input name="dmn" size="5" value="@if($bilan->resultat !== null) {{ $bilan->resultat->dmn }} @endif"/><a> m</a></td>
          <td><p hidden class="text-primary">Fréquence cardiaque de travail 50%</p></td>
          <td><input type="hidden" name="fct50" size="5" value="@if($bilan->resultat !== null) {{ $bilan->resultat->fct50 }} @endif"/><a hidden> b/min</a></td>
        </tr>
      </table>
      <a href="/bilans" class="btn btn-outline-primary pull-right" role="button">Retour</a>
    </form>

I want to auto load the form when the page is loaded so i add the script :

<script>
window.onload = function() { ancrecupid(); calculerIMC(); calculerDMN(); document.getElementById('form').submit(); };
</script>

It works but the page is reloaded every second, and i just want the form to be loaded once... I have several functions to load that's why i put function() { ancrecupid(); calculerIMC();....

What's wrong in my code ?

Upvotes: 0

Views: 1017

Answers (2)

Emmanuel Delay
Emmanuel Delay

Reputation: 3679

With jQuery, something like this is the idea. Not sure if you need those other functions anymore 

$(document)ready(function() {
  var myform = $('#form'); 
  // every 1 second:
  setInterval(function() {
    // send Ajax request, with form data
    $.ajax({
      type: 'post',
      url: myform.attr('action'),
      data: myform.serialize(),   // this reads all the inputs/select, ... puts it all in the correct format...
      success: function(response) {
        // response holds whatever you echoed with php.  For example you can show that response in a div <div id="response"></div>
        $('#response').html(response);
      }
    });

  }, 1000);
})

Upvotes: 0

Vipin Kumar
Vipin Kumar

Reputation: 6546

There is nothing wrong in your code. It is working as written. What you need is a flag that denotes whether your page is loaded via get request or via post request. Currently, your JS code is not able to distinguish between them, that is why it is doing infinite redirection. To fix this you have to return a flag from your backend code and use that flag in your JS code. You can take help from following link

Checking if request is post back in PHP

OR

You can use ajax for this.

Link: http://api.jquery.com/jquery.ajax/

Upvotes: 1

Related Questions