jquery function not firing using onload event

Question

What am I missing here? My jquery function isn't firing. Here's the HTML:

<div id="sum_income" class="col-sm-3" onload="sumIncome();">                     

</div>

and here's the jquery function:

function sumIncome() {

var cur_month = $('#month option:selected').attr("value");

$.ajax({
        type: "POST",
        url: 'inc/functions.php',
        data: {action: "get_sum_income", cur_month:cur_month},
        success: function(response){
            $('#sum_income').html(response);
            setTimeout(sumIncome, 5000);
                }
    })
};

What error you are getting in your console please write here the exact error of your console. — Neeraj Kumar, Dec 02 '13 at 13:14
try this http://stackoverflow.com/questions/4057236/how-to-add-onload-event-to-a-div — pratim_b, Dec 02 '13 at 13:16
@DontVoteMeDowm i have written the code which will work definetly — Neeraj Kumar, Dec 02 '13 at 13:30

score 3 · Accepted Answer · answered Dec 02 '13 at 13:28

change your jquery code.

 $(document).ready(function(){
            if($("#sum_income").length){
                var cur_month = $('#month option:selected').attr("value");

            $.ajax({
              type: "POST",
              url: 'inc/functions.php',
              data: {action: "get_sum_income", cur_month:cur_month},
              success: function(response){
              $('#sum_income').html(response);
                 setTimeout(sumIncome, 5000);
               }
            })
          }
        });

This will work definetly

score 2 · Answer 2 · answered Dec 02 '13 at 13:18

2

Use $(window).onload(); instead of adding it to any HTML elements.

<script> 
  $(window).onload(function () {
    sumIncome();
  });
</script>

answered Dec 02 '13 at 13:18

Andrew Surzhynskyi

2,726
1
22
32

score 1 · Answer 3 · answered Dec 02 '13 at 13:27

html:

<body onload="sumIncome();">
</body>

js:

function sumIncome() {

    var m = $('#month option').val(); // assuming this is a selected tag

    var request = $.ajax({
        type: "POST",
        url: 'inc/functions.php',
        data: {action: "get_sum_income", cur_month:m},
        dataType: "html"
    });
    request.done(function( response ) {
        $('#sum_income').html(response);
    });
    request.fail(function( jqXHR, textStatus ) {
        alert( "Request failed: " + textStatus );
    });
    request.done(function() {
        setTimeout(sumIncome, 5000);
    })

}

PS: No onload method for divs.

jquery function not firing using onload event

3 Answers3