F.A
F.A

Reputation: 45

Jquery to auto submit form, after receive value from ajax

I am trying here give value = 1 to input and submit manually.

Then each time jquery get value from ajax response value+1 and resubmit it. And make a loop to 1000. With this code I successfully get new value to input but failed to submit automatically.

HTML

<input type="number" name="imdo" id="name" value=""/>
<input type="submit" id="submit"/>
<div class="output"></div>

JS

jQuery(document).ready(function($){
$('#submit').on('click',function(event){
 event.preventDefault();
 $('#output').empty();
 var imdo=$("#name").val();
 var ajaxurl='admin-ajax;
$.ajax({
 url:ajaxurl,
 type:'post',
 dataType:'html',
data:{
 action:'wpse_2900_call',
 imdo:imdo,
},
success: function(result){
 $('#output').append(result);
 $('#name').val(result);
 $('#submit').submit(function(){return true;});
}
});
});
});

How can I submit automatically for 1000 time?

Upvotes: 0

Views: 1005

Answers (2)

Twisty
Twisty

Reputation: 30893

I strongly do not advise using this code.

Here is an example based on what you suggested you wanted to do.

var i = 0;
jQuery(document).ready(function($) {
  $('form').on('submit', function(e) {
    e.preventDefault();
    $('#output').empty();
    var imdo = $("#name").val();
    var ajaxurl = 'admin-ajax';
    for (i; i < 1000; i++) {
      console.log(i + ": Call " + ajaxurl + ", " + imdo);
      $.ajax({
        url: ajaxurl,
        type: 'post',
        dataType: 'html',
        data: {
          action: 'wpse_2900_call',
          imdo: imdo,
        },
        success: function(result) {
          console.log(i + ": Result", result);
          $('#output').append(result);
          $('#name').val(result);
          $('form').trigger("submit");
        }
      });
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <input type="number" name="imdo" id="name" value="" />
  <input type="submit" id="submit" />
</form>
<div class="output"></div>

When the form is submitted (either by click or Enter) the form is submitted and it will process until i is 1000.

Warning

You may DOS your web server. Or you may make a recursive loop that causes the browser to lock up. Again, I do not advise using this code.

Upvotes: 1

KHansen
KHansen

Reputation: 930

You could use .trigger( "click" ); as long result is < 1000 (untested):

jQuery(document).ready(function($){
  $('#submit').on('click',function(event){
    event.preventDefault();
    $('#output').empty();
    var imdo=$("#name").val();
    var initialValue=$("#name").attr("data-initial");
    var ajaxurl='admin-ajax;
    $.ajax({
      url:ajaxurl,
      type:'post',
      dataType:'html',
      data:{
        action:'wpse_2900_call',
        imdo:imdo,
      },
      success: function(result){
        $('#output').append(result);
        $('#name').val(result);
        if (initialValue == '') {
          $("#name").attr("data-initial", imdo);
          initialValue = imdo;
        }
        var maxRuns = 1000 + parseInt(initialValue);
        if (result < maxRuns) {
          $('#submit').trigger("click");
        }
      }
    });
  });
});

Edit: You need to add data-initial="" to #name. Also you can test the code without parseInt() (still untested).

Upvotes: 1

Related Questions