2013-10-11 2 views
0

Я планирую использовать плагин footable jQuery для своих таблиц, чтобы сделать их отзывчивыми, но я не могу интегрировать его в свой сайт. Это мой CSS:Объект [object Object] не имеет метода «footable»

<link href="FooTable-2/css/footable.core.css?v=2-0-1" rel="stylesheet" type="text/css"/> 
<link href="FooTable-2/css/footable.metro.css" rel="stylesheet" type="text/css"/> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.sort.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.filter.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.paginate.js?v=2-0-1" type="text/javascript"></script> 
<script src="build/javascripts/application.js" type="text/javascript"></script> 

JS:

<script type="text/javascript"> 
    $(function() { 
     $('.footable').footable(); 
    }); 
</script>  

HTML:

<table class="footable"> 
<thead> 
<tr> 
    <th></th> 
    <th data-hide="phone,tablet">Nummer</th> 
    <th>Vorname</th> 
    <th>Nachname</th> 
    <th>Adresse</th> 
    <th data-hide="phone,tablet">Telefon</th> 
    <th>E-Mail</th> 
    <th data-hide="phone,tablet">Geburtstag</th> 
    <th>Kundentyp</th> 
</tr> 
</thead> 
<tbody> 

Ошибка:

$('.footable').footable(); 
Uncaught TypeError: Object [object Object] has no method 'footable' 

консоли: enter image description here

Как это исправить?

+1

Убедитесь, что ссылки на скрипт верны. Проверьте сетевую вкладку инструментов вашего браузера для 404 ошибок. –

+0

Очевидно, что плагин не загружается. У вас должны быть другие ошибки в консоли, объясняющие почему. –

+0

Ошибка 404. Я проверил это раньше. – doonot

ответ

0

Похоже, что существует какой-то конфликт между application.js (Bootstrap 3.0) и footable.js. Я переставить порядок из включает в себя и был в состоянии решить эту проблему:

application.js теперь включен в качестве первого сценария:

<script src="build/javascripts/application.js" type="text/javascript"></script> 

После этого я включил все FooTable скрипты и CSS файлы:

<link href="FooTable-2/css/footable.core.css?v=2-0-1" rel="stylesheet" type="text/css"/> 
<link href="FooTable-2/css/footable.metro.css" rel="stylesheet" type="text/css"/> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.sort.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.filter.js?v=2-0-1" type="text/javascript"></script> 
<script src="FooTable-2/js/footable.paginate.js?v=2-0-1" type="text/javascript"></script>