Set name for a $document ready function

Question

Hi i search and found some info but i cant just cant set a name for this function to call it again in other function to "reload" the data.

Im a noob so i try to wrap from var form to the en in a function myfunction() {} but did not work. any suggestions?

$(document).ready(function (){
  var form = $('#formcomments');
  var submit = $('#comments');

    // send ajax request
    $.ajax({
      url: '<?PHP echo $this->make_base_url("user/comments_all/".$resdata['id']."/");?>',
      type: 'POST',
      cache: false,
      data: form.serialize(), //form serizlize data
      beforeSend: function(){
        // change submit button value text and disabled it
        submit.val('Enviando...').attr('disabled', 'disabled');
      },
      success: function(data){
        // Append with fadeIn see http://stackoverflow.com/a/978731
        var item = $(data).hide().fadeIn(800);
        $('.module').append(item);
var objDiv = document.getElementById("modulecomm");
objDiv.scrollTop = objDiv.scrollHeight;
        // reset form and button
        form.trigger('reset');
        submit.val('Submit Comment').removeAttr('disabled');

      },
      error: function(e){
        alert(e);
      }
    });
});

score 4 · Accepted Answer · answered Nov 15 '13 at 05:18

It’s pretty straightforward to change a function literal into a function declaration. Just move it out, give it a name, and use that variable.

function ready() {
    var form = $('#formcomments');
    var submit = $('#comments');

    // send Ajax request
    $.ajax({
        url: <?= json_encode($this->make_base_url("user/comments_all/{$resdata['id']}/")) ?>,
        type: 'POST',
        data: form.serialize(), //form serizlize data
        beforeSend: function() {
            // change submit button value text and disabled it
            submit.val('Enviando...').prop('disabled', true);
        },
        success: function(data) {
            // Append with fadeIn see http://stackoverflow.com/a/978731
            var item = $(data).hide().fadeIn(800);
            $('.module').append(item);
            var objDiv = document.getElementById("modulecomm");
            objDiv.scrollTop = objDiv.scrollHeight;
            // reset form and button
            form.trigger('reset');
            submit.val('Submit Comment').prop('disabled', false);
        },
        error: function(e) {
            alert(e);
        }
    });
}

$(document).ready(ready);

I also changed your PHP to use json_encode, which handles any escaping for you, in the rare case it’s necessary. (There are some other minor changes, too.)

The function read() is producing an object[Object] error, do yo have any idea why? — Moncho Chavez, Nov 15 '13 at 16:49

score 2 · Answer 2 · answered Nov 15 '13 at 05:20

I would write it like this

(function($){
  var init = function() {
    // ...
  };

  $(init);
})(jQuery);

This anonymous closure keeps the init function out of the global namespace.

Note: $(fn) is a shortcut for $(document).ready(fn);

From the jQuery .ready docs

All three of the following syntaxes are equivalent:

$( document ).ready( handler )
$().ready( handler ) (this is not recommended)
$( handler )

Set name for a $document ready function

2 Answers2