js - how to namespace this code?

Question

I'm trying to use namespacing but can;t get it to work. I've tried wrapping all the code with a mdd = {} and I've tried wrapping everything within $(document).ready( with var MDD = {} but neither worked.

How can I add a namespacing for this code?

<script type="text/javascript">
  $(document).ready( function() {
    $("#categories").sortable({
      revert: true,
      receive: function(evt, ui) {
        ui.item.remove();
        if ( $('#list_to_process li').length == 0) {
          $('#list_to_process').remove();
        }
      }
    });
    $("li.to_process").draggable( {
      connectToSortable: "#categories",
      helper: "clone",
      revert: "invalid"
    });
  });
</script>

What do you want to add to the namespace? I see no exported methods or properties, just 2 function calls ... — Sirko, Apr 14 '13 at 14:24

score 1 · Accepted Answer · edited May 23 '17 at 12:18

If organising your code is what you are trying to achieve, I would suggest the following:

Create your namespace outside $(document).ready (used Revealing module pattern in my example).
On $(document).ready you call your code.

Example:

$(function(){
    MDD.init();
});

var MDD = function () {
  var init = function () {
    $("#categories").sortable({
      revert: true,
      receive: function(evt, ui) {
        ui.item.remove();
        if ( $('#list_to_process li').length == 0) {
          $('#list_to_process').remove();
        }
      }
    });
    $("li.to_process").draggable( {
      connectToSortable: "#categories",
      helper: "clone",
      revert: "invalid"
    });
  };
  return {
    init : init
  }
}();

score 0 · Answer 2 · answered Apr 14 '13 at 14:28

0

JQuery's .sortable and .draggable calls are methods, not event handlers. As far as I know, they cannot be namespaced.

However, jQuery's $(document).ready(... is an event handler, so you may be able to namespace it, but only if it works with the .on method. Note that I have not tested this, before, but if it is feasible, then the below should work:

$(document).on("ready.namespace", function() {
    ...
});

answered Apr 14 '13 at 14:28

Zachary Kniebel

4,686
3
29
53

Why anyone would need to namespace the document ready event is another matter. – JJJ Apr 14 '13 at 14:30
@Juhana - I don't know, and I really don't care. It was the question in the OP. – Zachary Kniebel Apr 14 '13 at 14:33

js - how to namespace this code?

2 Answers2