Jquery, 플러그인이 식별/호출되지 않았습니다.

Question

데이터 정렬을 위해 맞춤 플러그인을 작성하려고합니다. 문제는 데이터 테이블 초기화에 sType을 설정할 때 플러그인이 식별/호출되지 않는다는 것입니다.

나는 첫 번째 열을 정렬 가능으로 만들고 있습니다.

이

플러그인 파일이

/** 
* Custom sort file name jquery.ui.customsort.js 
*/ 

(function($) { 
    jQuery.fn.dataTableExt.oSort['string-case-asc'] = function(x,y) { 
    return ((x < y) ? -1 : ((x > y) ? 1 : 0)); 
    }; 
    jQuery.fn.dataTableExt.oSort['string-case-desc'] = function(x,y) { 
     return ((x < y) ? 1 : ((x > y) ? -1 : 0)); 
    }; 
})(jQuery); 

시일을 추정 초기화 자바 스크립트는 다음과 같습니다 :

/** 
* Initialization the data table 
*/ 

    var oSortTable=null; 
    $(function() { 

/*Creating the html for the table with id 'sort_table'*/ 
var sorttablehtml = "<table id='sort_table'><thead><tr><th>FirstName</th> <th>FamilyName</th></tr></thead><tbody>"; 
sorttablehtml +='<tr class="contactnamedetail"><td>New York</td><td>United States</td></tr>'; 
sorttablehtml +='<tr class="contactnamedetail"><td>Paris</td><td>Paris</td></tr>'; 
sorttablehtml +='<tr class="contactnamedetail"><td>Sydney</td><td>Australia</td></tr>'; 
sorttablehtml +='<tr class="contactnamedetail"><td>Berlin</td><td>Germany</td></tr>'; 
sorttablehtml +="</tbody></table>"; 


$('#sortingtable').html(sorttablehtml); 
/*converting the table to datatable*/ 
oSortTable=$('#sort_table').dataTable({ 
     "aoColumns": [ 
        { "sType": "string-case"}, 
        { "bSortable": false }//Disable sorting on this column 

        ] 
    }); 
}); 

내가 놓치고하고 뭔가에 내가 아니다

다음

코드입니다 알아낼 수있다. 이와 관련하여 도움이 될 것입니다. 콘솔에서

오류는 다음과 같습니다지고 파일의

Timestamp: 3/7/2013 12:52:11 PM 
Error: TypeError: jQuery.fn.dataTableExt is undefined 
Source File: http://myorg:8080/jqueryproject/javascript/jquery/development-bundle/ui/jquery.ui.customsort.js 
Line: 6 

Timestamp: 3/7/2013 12:55:33 PM 
Error: TypeError: oCol is undefined 
Source File: http://myorg:8080/jqueryproject/javascript/datatables/media/js/jquery.dataTables.js 
Line: 784 

순서는 다음과 같습니다 어떤 순서로 당신의 외부 파일을로드에서

<!-- Jquery files used for various plugins and widgets --> 
<link type="text/css" href="/jqueryproject/javascript/jquery/development-bundle/themes /base/jquery.ui.all.css" rel="Stylesheet" /> 
<link type="text/css" href="/jqueryproject/javascript/jquery/development-bundle/demos /demos.css" rel="Stylesheet" /> 

<script type="text/javascript" src="/jqueryproject/javascript/jquery/js/jquery- 1.7.2.min.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development- bundle/ui/jquery.ui.core.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development- bundle/ui/jquery.ui.widget.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.ui.datepicker.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.ui.tabs.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.effects.core.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.effects.fade.js"></script> 

<script type="text/javascript" src="/jqueryproject/javascript/datatables/media/js/jquery.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/datatables/media/js/jquery.dataTables.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/datatables/media/js/jquery.jeditable.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/datatables/media/js/jquery.validate.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/datatables/media/js/jquery.dataTables.editable.js"></script> 


<link type="text/css" href="/jqueryproject/javascript/datatables/media/css/demo_page.css" rel="Stylesheet" /> 
<link type="text/css" href="/jqueryproject/javascript/datatables/media/css/demo_table_jui.css" rel="Stylesheet" /> 
<link type="text/css" href="/jqueryproject/javascript/datatables/media/css/demo_table.css" rel="Stylesheet" /> 
<link type="text/css" href="/jqueryproject/javascript/datatables/media/css/jquery.dataTables_themeroller.css" rel="Stylesheet" /> 
<link type="text/css" href="/jqueryproject/javascript/datatables/media/css/jquery.dataTables.css" rel="Stylesheet" /> 

<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.ui.customsort.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/jquery/development-bundle/ui/jquery.ui.fixedwidth.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/custom/jqueryproject.js"></script> 
<script type="text/javascript" src="/jqueryproject/javascript/custom /sortingtable.js"></script> 

Answer 1

?

보다 먼저을 데이터 테이블 .js 파일에 추가 하시겠습니까? 그렇다면 오류의 원인 일 수 있습니다.

유사한 문제가 datatables 포럼에 이전에 도달했습니다 : http://www.datatables.net/forums/discussion/9661/.fn.datatableext-is-undefined/p1

을 또한, 나는 당신의 코드 샘플, 중 바이올린을 만들기 위해 시도하고 문제를 발견하지 않았습니다. 당신이 바이올린의 HTML의 프레임 소스를 볼 경우 플러그인 코드가 dataTables JS 파일 뒤에 오는 방법

http://jsfiddle.net/r4FBQ/

, 당신은 볼 수 있습니다.

<script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script> 
<script type='text/javascript'> 
// your plugin code... 
</script>