jQuery - TypeError:$(...)。sortable不是一个函数

时间:2014-08-17 00:14:54

标签: jquery serialization jquery-ui-sortable

我有这个代码但它还没有用。几天前它起作用了,但现在不行了。而且我不记得我能改变什么......

 $( ".guardarorden" ).click(function( event ) {
  event.preventDefault();
});

$(document).ready(function(){


    $(function() {
        $( "#ordename" ).sortable({
          placeholder: "ui-state-highlight",
          cursor: 'move',
          opacity: 0.5,
          activate: function( event, ui ) {
            $('.guardarorden').removeClass('hidden');
          },
          update: function(event, ui){
            var nuevoOrden = $(this).sortable("serialize"); // Here is my problem!!!
            alert(nuevoOrden);

            $(window).on('beforeunload', function(){
              return 'Si has realizado cambios, asegurate de guardarlos antes de abandonar la página...';
            });
            $( ".guardarorden" ).click(function( event ) {
                event.preventDefault();

              $.post('guardaorden/'+nuevoOrden, {list: nuevoOrden},function(data){

                    }, 'json');
              $(window).off('beforeunload');
              alert("Orden guardado correctamente. Aunque esto sería mejor con un mensaje de error típico");
              location.reload();
              //alert("guardado con éxito!")             
            });         
          }
        });
        $( "#ordename" ).disableSelection();
      });
});

我不知道为什么var nuevoOrden = $(this).sortable("serialize");不是函数。有什么想法吗?

EDITED

我认为这是关于jquery-ui的。我在主页中加载每个脚本,如下所示:

{{ HTML::script('//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js')}}
{{ HTML::script('js/jquery-1.11.1.min.js') }}
{{ HTML::script('js/bootstrap-multiselect.js') }}
{{ HTML::script('js/bootstrap-slider.js') }}
{{ HTML::script('js/sisyphus.min.js') }}
{{ HTML::script('//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js')}}
{{ HTML::script('/js/ckeditor/ckeditor.js')}}
{{ HTML::script('/js/ckeditor/adapters/jquery.js')}}
{{ HTML::script('//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js')}}

但是我已经尝试手动加载我遇到问题的页面中的最后一个并且它有效......但有时只是(我不明白)。它第一次运行良好,但后来我有错误信息。

如果我从我的页面中删除{{ HTML::script('//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js')}}并在浏览器中重新加载页面,然后我再次将{{ HTML::script('//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js')}}放入我的页面并重新加载,则可以正常运行。直到我改变页面。当我回来时,它不再起作用...... :(

编辑2

jQuery-ui和CKEditor之间是否有任何不兼容性?如果我删除{{ HTML::script('/js/ckeditor/ckeditor.js')}}{{ HTML::script('/js/ckeditor/adapters/jquery.js')}}则没有问题!!

1 个答案:

答案 0 :(得分:1)

加载Jquery和Jquery-UI的顺序很可能是错误的。首先尝试加载Jquery然后再加载Jquery-UI。