title: How to call function after drop - jquery sortable
body: <p>I am using the jquery sortable library. And my list is sortable (as in I can drag and drop the items in the list like I want to be able to do). But I cannot seem to get a function to trigger after the item is dropped.</p>
  
  <p>Also, .sortable() works fine, but I get an error when I try to use .disableSelection();</p>
  
  <p>Here is the sample code:</p>
  
  <pre><code>o.onload = function () {
          data = _customization.data;
          for (id in data) {
              li = o.document.createElement("li");
              a = o.document.createElement("a");
              a.className = "module-customization";
              for (id2 in data[id]) {
                  if (id2.indexOf("look") &gt; -1) {
                      var temp = data[id][id2];
                      temp = temp.replace(_customization.pageOrigin, "");
                      temp = temp.replace(/([A-Z])/g, ' $1').trim()
                      a.innerHTML = temp;
                      if (a.getAttribute("Visible") != null) {
                          if (a.getAttribute("Visible") == "True") {
                              a.innerHTML = "&lt;strong style=\"color:white\"&gt;" +a.innerHTML + "&lt;/strong&gt;&lt;strong class=\"pull-right\" style=\"color:#d9534f;\" onClick=\"swapVisible(this)\"&gt;Hide&lt;/strong&gt;";
                          }
                          else {
                              a.innerHTML = "&lt;strong style=\"color:grey\"&gt;" + a.innerHTML + "&lt;/strong&gt;&lt;strong class=\"pull-right\" style=\"color:#5cb85c;\" onClick=\"swapVisible(this)\"&gt;Show&lt;/strong&gt;";
                              a.childNodes[0].style.setProperty("text-decoration", "line-through");
                          }
                      }
                  } else if (id2.indexOf("Order") &gt; -1) {
                      a.setAttribute("Order", data[id][id2]);
                  }
                  else if (id2.indexOf("Visible") &gt; -1) {
                      a.setAttribute("Visible", data[id][id2]);
                  }
                  else {
                      a.setAttribute("rowID", data[id][id2]);
                  }
              }
              a.Tag = data[id];
              a.id = id;
              li.appendChild(a);
              $(o.document.getElementById(_customization.pageSide)).sortable({
                  receive: function (event, ui) {
                      alert("here");
                  }
              });
              $(o.document.getElementById(_customization.pageSide)).disableSelection();
  
              o.document.getElementById(_customization.pageSide).appendChild(li);
          }
      }
  </code></pre>
  
  <p>For a little bit of context, "o" is a window that has been opened. And I am dynamically creating li elements based on an array - data. All of that works fine, I just thought I would include it all. </p>
  
  <p>Like I said, .sortable() is apparently working because I can drag and drop the items, but .disableSelection() gives me:</p>
  
  <p>$(...).disableSelection is not a function</p>
  
  <p>Any ideas why I cant get that function to trigger the alert("here")?</p>
  
  <p>Thanks!</p>