Ich habe eine Ruby on Rails App auf Heroku gehostet. Ich habe Datatable in einer meiner Seiten verwendet. Und ich habe es reaktionsfähig gemacht, so dass in Mobilgeräten mit geringerer Breite einige der Spalten mit einer grünen kreisförmigen Plus-Schaltfläche auf der linken Seite jeder Zeile sichtbar sind. Wenn Sie auf diese Schaltfläche klicken, werden alle anderen Spalten für die Zeile sichtbar. Und es funktioniert gut in meinem localhost. Aber wenn ich es auf Heroku bereitstellen werde, funktionieren alle diese Funktionen gut, außer die grüne kreisförmige Plus-Schaltfläche ist nicht sichtbar. Wenn Sie jedoch auf das Feld klicken, in dem der grüne runde Plus-Button erschienen sein soll, werden andere Spalten sichtbar. Also auf Heroku funktioniert es gut, außer der grüne Plus-Knopf ist nicht sichtbar.Problem in Bezug auf responsive Datatable auf Heroku
Ich habe den Befehl ausgeführt:
bundle exec assets:precomplile
Aber immer noch nicht funktioniert.
Mein Code für diese bestimmte Seite lautet:
<html>
<head>
<title>Tables - PixelAdmin</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"/>
<link rel="stylesheet" href="http://cdn.datatables.net/plug-ins/a5734b29083/integration/bootstrap/3/dataTables.bootstrap.css"/>
<link rel="stylesheet" href="http://cdn.datatables.net/responsive/1.0.2/css/dataTables.responsive.css"/>
<style>
body {
font-size: 140%;
}
table.dataTable th,
table.dataTable td {
white-space: nowrap;
}
</style>
</head>
<body class="theme-default main-menu-animated" style="padding-top: 40px;">
<table id="example" class="table table-striped table-hover dt-responsive display nowrap" cellspacing="0"
width="100%">
<thead>
<tr>
<th>Serial No.</th>
<th>Title</th>
<th>Text</th>
<th>Creation Time</th>
<th>Updation Time</th>
<th>Details</th>
</tr>
</thead>
<% @articles.each do |article| %>
<tr>
<td><%= article.id %></td>
<td> <%= article.title %></td>
<td><%= article.text %></td>
<td><%= article.created_at %> </td>
<td><%= article.updated_at %></td>
<td><%= link_to 'Show', article_path(article) %></td>
</tr>
<% end %>
</table>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/1.10.3/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/responsive/1.0.2/js/dataTables.responsive.js"> </script>
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/plug-ins/a5734b29083/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script>
$(document).ready(function() {
$('#example')
.dataTable({
"responsive": true,
"dom": '<"top"lf>t<"bottom"pi><"clear">'
});
});
</script>
</body>
</html>
Bitte helfen Sie mir, dieses Problem zu beheben. Danke im Voraus!!
https://workerq.herokuapp.com/articles
Und mein localhost Screenshot ist:
Der Link dieser Seite auf meiner Heroku App ist auf den Fehler in Ihrer Seite
Ihre default.js und default.css wurden nicht in die Webseite geladen. Bitte führen Sie den Test ordnungsgemäß aus, indem Sie die Webkonsole öffnen. Und wenn immer noch nicht gelöst, dann können Sie die Anwendung localhost im Produktionsmodus ausführen. Das wird Ihnen helfen, das eigentliche Problem herauszufinden. –
Wie füge ich default.js und default.css auf herokuapp hinzu? Da diese beiden Dateien bereits in meinem lokalen Verzeichnis sind. Also, wenn ich es nach Heroku schiebe, warum wird es nicht auf Heroku hochgeladen? @Bharatsoni – Abhradip
Das müssen Sie überprüfen. –