Hi Leute ich bin noch ziemlich neu in Javascript und Ajax und besonders in jquery.
Ich versuche gerade eine Art Shop zu bauen, wo auf jeder Seite 16 Produkte sind und habe mir nach langem probieren etwas zusammen gebaut. Ob das nun so gut gecodet ist, wage ich zu bezweifeln, aber ich kenne leider niemanden der mir komplett dabei helfen kann.
So nun möchte ich, dass eine Pagination erstellt wird für alle Elemente aus der Datenbank und alle 16 eine Seite ist. Wenn ich nun den Next Button klicke sollen die nächsten 16 ausgelesen werden usw. Nun weiß ich leider nicht, wie ich es anstelle, dass mir die Start Variable, die in die Datenbankabfrage als erster Limit-Wert gesetzt wird, so definiere, dass dieser auch immer herauskommt.
Also ich zeig euch mal die Dateien:
HTML
die PHP
Und zu guter letzt noch das jQuery:
Also in der html klickt man auf next und die ersten 16 Bilder kommen heraus. Wenn ich nun wieder auf Next Klicke sollen die nächsten 16 kommen. Zusätzlich soll die Funktion gleich bei $(document).ready(function() { ausgeführt werden und bei click dann nur noch die funktion. Kann mir einer sagen wie das geht? Also dann würde ich in die Funktion am Anfang gucken, if var get start ="" start= "0", else start = get start, iwie so.
Würde mich über ne Antwort freuen, also eigentlich muss ja nur in der jquery datei was angepasst werden.
Mfg
Ich versuche gerade eine Art Shop zu bauen, wo auf jeder Seite 16 Produkte sind und habe mir nach langem probieren etwas zusammen gebaut. Ob das nun so gut gecodet ist, wage ich zu bezweifeln, aber ich kenne leider niemanden der mir komplett dabei helfen kann.
So nun möchte ich, dass eine Pagination erstellt wird für alle Elemente aus der Datenbank und alle 16 eine Seite ist. Wenn ich nun den Next Button klicke sollen die nächsten 16 ausgelesen werden usw. Nun weiß ich leider nicht, wie ich es anstelle, dass mir die Start Variable, die in die Datenbankabfrage als erster Limit-Wert gesetzt wird, so definiere, dass dieser auch immer herauskommt.
Also ich zeig euch mal die Dateien:
HTML
PHP:
<html>
<head>
<title>The HTML</title>
<script type="text/javascript" src="jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="thejs.js"></script>
<link rel="stylesheet" type="text/css" href="css/getipa.css" />
<link rel="stylesheet" type="text/css" href="css/yui.css" />
</head>
<body>
<div id="custom-doc">
<div id="container"></div>
<div class="spacer"></div>
<input type="submit" id="sendData" name="sendData" value="Next" />
</div>
</body>
</html>die PHP
PHP:
<?php
include("config.php");
$start = htmlspecialchars(trim($_POST['start']));
/*if(isset($_GET["start"]) && $_GET["start"] != "")
{
$start = $_GET["start"];
}
else
{
$start = 0;
}
*/
$query = "SELECT name,bildlink,kat,id FROM Games LIMIT $start,16";
$result = mysql_query($query);
// create a new XML document
$doc = new DomDocument('1.0');
// create root node
$root = $doc->createElement('ajaxcontent');
$root = $doc->appendChild($root);
while($array = mysql_fetch_array($result)) {
//find the newest version of app
$id = $array["id"];
$query2 = "SELECT version FROM versions WHERE FK_app_id=$id ORDER BY version_id DESC LIMIT 1";
$result2 = mysql_query($query2);
while($array2 = mysql_fetch_array($result2)) {
// add node for each row
$occ = $doc->createElement('app');
$occ = $root->appendChild($occ);
$child = $doc->createElement('bildlink');
$child = $occ->appendChild($child);
$value = $doc->createTextNode($array['bildlink']);
$value = $child->appendChild($value);
}}
// get completed xml document
$xml_string = $doc->saveXML();
header('Content-Type: application/xml; charset=ISO-8859-1');
echo $xml_string
?>Und zu guter letzt noch das jQuery:
PHP:
$(document).ready(function() {
$("#sendData").click(function(){
var start ="16";
var persite = "16";
var code = "";
$.ajax({
type: "POST",
url: "thePHP.php",
data: "start="+ start +"",
success:
function(theXML){
$('app',theXML).each(function(i){
var bildlink = $(this).find("bildlink").text();
code += '<div id="latestups"><div class="icon"><img src="' + bildlink + '"/> </div></div>
});
$("#container").html(code);
}
});
});
});Also in der html klickt man auf next und die ersten 16 Bilder kommen heraus. Wenn ich nun wieder auf Next Klicke sollen die nächsten 16 kommen. Zusätzlich soll die Funktion gleich bei $(document).ready(function() { ausgeführt werden und bei click dann nur noch die funktion. Kann mir einer sagen wie das geht? Also dann würde ich in die Funktion am Anfang gucken, if var get start ="" start= "0", else start = get start, iwie so.
Würde mich über ne Antwort freuen, also eigentlich muss ja nur in der jquery datei was angepasst werden.
Mfg
