Tweet
jQuery Accordion funktioniert nicht in externe PHP Datei
Hallo Leute,
ich komme da an einer Stelle nicht weiter. Kurz vorweg, ich entwickle gerade ein minimales CMS in dem ich Artikel anlegen editieren etc kann. Die Artikel werden mit jQuery Accordion hübsch aufgelistet.
Das funktioniert auch, jetzt habe ich das soweit geändert das man die Artikelkategorie auswählen kann und über Ajax das Accordion in einer externen Seite geladen wird. Funktionieren tut das ganze auch, nur werden die Artikel einfach untereinander gelistet ohne das Accordion. Vielleicht habt ihr ja eine Idee.
Mein Code: artikellisten.php
Und die ladeartikel.php:
ich komme da an einer Stelle nicht weiter. Kurz vorweg, ich entwickle gerade ein minimales CMS in dem ich Artikel anlegen editieren etc kann. Die Artikel werden mit jQuery Accordion hübsch aufgelistet.
Das funktioniert auch, jetzt habe ich das soweit geändert das man die Artikelkategorie auswählen kann und über Ajax das Accordion in einer externen Seite geladen wird. Funktionieren tut das ganze auch, nur werden die Artikel einfach untereinander gelistet ohne das Accordion. Vielleicht habt ihr ja eine Idee.
Mein Code: artikellisten.php
PHP Code:
<!DOCTYPE html>
<html lang="de">
<head>
<?php
include_once 'includes/db_connect.php';
include_once 'includes/functions.php';
sec_session_start();
/* Beginn Scripte laden */
Include ('scripte.php');
/* Ende Scripte laden */
$rwname ="Artikel"; $rwtext1="den Artikel"; $rwziel ="artikellisten.php";
?>
<script>
$( function() {
var icons = {
header: "ui-icon-circle-arrow-e",
activeHeader: "ui-icon-circle-arrow-s"
};
$( "#accordion" ).accordion({collapsible: true}, { icons: icons }, {active: false});
$( "#toggle" ).button().on( "click", function() {
if ( $( "#accordion" ).accordion( "option", "icons" ) ) {
$( "#accordion" ).accordion( "option", "icons", null );
} else {
$( "#accordion" ).accordion( "option", "icons", icons );
}
});
} );
function ArtikelAuswahl()
{
var x = document.getElementById("Kategorien").value;
if (window.XMLHttpRequest)
{
// AJAX nutzen mit IE7+, Chrome, Firefox, Safari, Opera
xmlhttp=new XMLHttpRequest();
}
else
{
// AJAX mit IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("AuflistungArtikel").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ladeartikel.php?q="+x,true);
xmlhttp.send();
}
</script>
</head>
<body id="scroll" >
<?php
if(isset($_POST['neu'])){
header('Location: neuerartikel.php');
}
?>
<!-- Beginn Header (Menü) -->
<header id="header">
<div class="inside">
<?php Include ('mainsite.php'); ?>
</div>
</header>
<!-- Ende Header (Menü) -->
<!-- Beginn Content -->
<div id="wrapper"><div id="container"><div id="container-inside" class="inside">
<section id="main">
<form method="post" action ="artikellisten.php">
<?php
if (login_check($mysqli) == true ) {
$ergebnis = $mysqli->query("SELECT Distinct Kat from Artikel order by Kat ASC");
echo '<table><tr><td>
<label for="Produkt" >Kategorien</td><td>
<select id="Kategorien" onchange="ArtikelAuswahl()">
<option selected="selected">Alle</option>';
while ($row = $ergebnis->fetch_assoc()) {
echo '<option>' . $row['Kat'] . '</option>';
}
echo '</select></td></label></tr></table>';
echo "<script type='text/javascript'>ArtikelAuswahl();</script>";
} else {
header('Location: login.php');
}
?>
<p id="AuflistungArtikel"></p>
<table border="0" width="100%" class="contentText" >
<tr><td><div id="buttonpos">
<input class="buttonStyle" style="height: 60px; width: 280px; font-size:20px; text-align:center;" type="submit" value="Neuen Artikel anlegen" name="neu">
</div></td></tr></table>
</form>
</section>
</div></div></div>
<!-- Beginn Footer -->
<?php Include ('footer.php'); ?>
<!-- Ende Footer -->
<script src="scripte/jpanelmenu.js"></script>
<script src="scripte/scripts.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>
PHP Code:
<?php
include_once 'includes/db_connect.php';
include_once 'includes/functions.php';
sec_session_start();
if (login_check($mysqli) == true ) {
$gesamt = readfromDB("Select Count(*) from Artikel");
echo '<p style="font-size:24px;">Artikelliste (' .$gesamt[0].' Datensätze in der Datenbank)</p>';
if ($_GET['q'] == "Alle") {
$ergebnis = $mysqli->query("SELECT * from Artikel order by ID ASC");
} else {
$ergebnis = $mysqli->query("SELECT * from Artikel Where Kat ='".$_GET['q'] . "' order by ID ASC");
}
// Hier jQuery Accordiion mit Daten füllen
echo '<div id="accordion" >';
while ($row = $ergebnis->fetch_array()) {
echo '<p style="font-size:16px;">'.$row['Titel'] .'</p>
<div>
<table width="100%" >
<colgroup><col width="90%"><col width="5%"><col width="5%"></colgroup>
<tr><td>
<p style="font-size:20px;">Inhalt:</p>
</td><td><p style="font-size:14px; text-align:right;"><a href="artikeledit.php?q='. $row['ID'].'"><div class="tooltip2"><img src="images/edit.png" alt="Bearbeiten" width="32" height="32"/><span class="tooltiptext">News ändern</span></a></div></p></td>';
if ($row['Titel'] =="Startseite") {
echo '<td><p style="font-size:14px;"><div class="tooltip2"><img src="images/deletegrey.png" alt="Löschen" width="32" height="32" style="cursor: pointer"><span class="tooltiptext" style="cursor: pointer">Startseite kann nichtgelöscht werden.</span></div></p></td>';
} else {
echo '<td><p style="font-size:14px;"><div class="tooltip2"><img src="images/delete.png" alt="Löschen" width="32" height="32" onclick="doConfirm(\''.$row['ID'].'\',\''.$row['Titel'].'\',\''.$rwname.'\',\''.$rwtext1.'\',\''.$rwziel.'\');" style="cursor: pointer"><span class="tooltiptext" style="cursor: pointer">News '.$row['Produkt'].' löschen</span></div></p></td>';
}
echo '</tr></table>
<table width="100%" >
<colgroup><col width="20%"><col width="80%"></colgroup>
<tr><td><p style="font-size:16px;">ID : </p></td><td><p style="font-size:16px;">'.$row['ID'].'</p></td></tr>
<tr><td><p style="font-size:16px;">Titel : </p></td><td><p style="font-size:16px;">'.$row['Titel'].'</p></td></tr>';
if ($row['Hflag'] == 0) {
echo '<tr><td><p style="font-size:16px;">Header : </p></td><td><p style="font-size:16px;">Nein</p></td></tr>';
} else {
echo '<tr><td><p style="font-size:16px;">Header : </p></td><td><p style="font-size:16px;">Ja</p></td></tr>';
}
if ($row['Uflag'] == 0) {
echo '<tr><td><p style="font-size:16px;">U-Flag : </p></td><td><p style="font-size:16px;">Nein</p></td></tr>';
} else {
echo '<tr><td><p style="font-size:16px;">U-Flag : </p></td><td><p style="font-size:16px;">Ja</p></td></tr>';
}
if ($row['Sflag'] == 0) {
echo '<tr><td><p style="font-size:16px;">Subheader : </p></td><td><p style="font-size:16px;">Nein</p></td></tr>';
} else {
echo '<tr><td><p style="font-size:16px;">Subheader : </p></td><td><p style="font-size:16px;">Ja</p></td></tr>';
}
echo '<tr><td><p style="font-size:16px;">Überschrift : </p></td><td><p style="font-size:16px;">'.$row['Ueberschrift'].'</p></td></tr>';
if ($row['Gallery'] == "n") {
echo '<tr><td><p style="font-size:16px;">Gallerie : </p></td><td><p style="font-size:16px;">Nein</p></td></tr>';
} else {
echo '<tr><td><p style="font-size:16px;">Gallerie : </p></td><td><p style="font-size:16px;">Ja</p></td></tr>';
}
echo '<tr><td><p style="font-size:16px;">Erstellt : </p></td><td><p style="font-size:16px;">'.date("d.m.Y",$row['ArtErstellt']) . " ". date("H:i:s",$row['ArtErstellt']).'</p></td></tr>
<tr><td><p style="font-size:16px;">Kategorie : </p></td><td><p style="font-size:16px;">'.$row['Kat'].'</p></td></tr>
<tr><td><p style="font-size:16px;">Inhalt : </p></td><td><p style="font-size:16px;">'. $row['Inhalt'] . '</p></td></tr>
</tr></table>
</div>';
}
echo '</div>';
} else {
header('Location: login.php');
}
?>
Comment