dynamisch met ajax maar menubalk kan ik niet meer aanpassen
Ik heb een website waarbij de pagina's dynamisch laden met ajax waardoor het veel sneller werkt. Maar de menubalk wordt nu niet meer geladen. Ik heb daar echter een link "berichten" en daar moet het "aantal" zich aanpassen, dit gebeurt nu niet meer. Is daar een oplossing voor?
Ik heb:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
<li><a class="laad_pagina" href="inbox4.php">Berichten><?php
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
Een paar opmerkingen:
- Spring je code goed in
- Pas goede foutafhandeling toe op je query.
- Waarom een while, als je toch maar één result krijgt?
Gewijzigd op 06/04/2012 16:02:08 door - Ariën -
Bedankt voor de andere tips.
Kurtik watson op 06/04/2012 16:08:27:
Ik wil niet dat de menubalk zich telkens laad met ajax..
Dan is het simpele antwoord: nee.
Je zal op de een of andere manier de gegevens van de server naar de browser moeten krijgen. Dat kan via het herladen van de pagina (volledig), het herladen van een deel van de pagina via Ajax, of via een open verbinding. Maar als je al geen Ajax wil gebruiken dan lijkt het laatste me helemaal een stap te ver.
Overigens hoef je met Ajax natuurlijk niet de hele menubalk te herladen, je kan ook alleen het getal laden, wat opzich snel en licht zou moeten zijn.
Mvg
Toevoeging op 06/04/2012 17:20:15:
en ik heb nu gezocht, maar kan het topic niet meer vinden. Kan ook van iemand anders zijn geweest. In dat topic ging het erom dat een bepaalde score oid continu geupdate moest worden en dat alleen dat getal dus continu ververst moest worden, zonder de hele pagina te laden. De techniek die ik toen heb voorgesteld is dezelfde die ik aan jou heb voorgesteld: load() functie van JQuery.
Net zoals je nu een deel van de pagina via een Ajax connectie met load ophaalt, zo kan je ook het span (of div) waar dat aantal in staat verversen met load(). Aangezien je weet hoe het met die pagina's gaat, zou je dit ook moeten kunnen oplossen.
Je had mij het systeem uitgelegd dat met AJAX enkel een deel van pagina telkens geladen kan worden en dit werkt super! Maar mijn menubalk staat niet in de div van AJAX (laad_pagina). Dus indien ik de query waarmee ik het getal van berichten ophaal, in de div "laad_pagina" zet wordt het wel telkens opnieuw geladen maar staat het niet mooi langs berichten in de menubalk? Want deze menubalk wordt niet opnieuw geladen.
groeten,
Kurt
Wordt bij de pagina laden een .html bericht of een .json of een .xml bestand opgehaald middels ajax?
Als het 1van de laatste 2 is kun je bij de success afhandeling je menu gewoon met javascript vullen met de waardes welke je vanaf de server mee stuurd.
Dus eigenlijk is de vraag, hoe handel je ajaxcall af.
Gewijzigd op 09/04/2012 23:33:06 door Erwin Goossen
Ik werk gewoon met een div en jquery:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<?php
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
session_start();
?>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<?php
}
else{
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<?php session_start(); ?>
<link rel="stylesheet" type="text/css" href="css1/scroll.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
});
});
</script>
</head>
<body>
<ul id="thicktabs">
<li><a class="laad_pagina" href="index053.php">Wijzigen</a></li>
<li><a class="laad_pagina" href="inbox4.php">Berichten><?php
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
</ul>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<a class="laad_pagina" href="index053.php">Laad pagina 1</a>
</body>
</html>
<?php
}
?>
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
session_start();
?>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<?php
}
else{
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<?php session_start(); ?>
<link rel="stylesheet" type="text/css" href="css1/scroll.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
});
});
</script>
</head>
<body>
<ul id="thicktabs">
<li><a class="laad_pagina" href="index053.php">Wijzigen</a></li>
<li><a class="laad_pagina" href="inbox4.php">Berichten><?php
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
</ul>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<a class="laad_pagina" href="index053.php">Laad pagina 1</a>
</body>
</html>
<?php
}
?>
Gewijzigd op 10/04/2012 00:27:12 door Pieter Jansen
Kurtik watson op 09/04/2012 18:49:40:
Hallo Erwin,
Je had mij het systeem uitgelegd dat met AJAX enkel een deel van pagina telkens geladen kan worden en dit werkt super! Maar mijn menubalk staat niet in de div van AJAX (laad_pagina). Dus indien ik de query waarmee ik het getal van berichten ophaal, in de div "laad_pagina" zet wordt het wel telkens opnieuw geladen maar staat het niet mooi langs berichten in de menubalk? Want deze menubalk wordt niet opnieuw geladen.
groeten,
Kurt
Je had mij het systeem uitgelegd dat met AJAX enkel een deel van pagina telkens geladen kan worden en dit werkt super! Maar mijn menubalk staat niet in de div van AJAX (laad_pagina). Dus indien ik de query waarmee ik het getal van berichten ophaal, in de div "laad_pagina" zet wordt het wel telkens opnieuw geladen maar staat het niet mooi langs berichten in de menubalk? Want deze menubalk wordt niet opnieuw geladen.
groeten,
Kurt
Wat let je om precies hetzelfde te doen, maar dan voor een andere div? Met dus een andere functie en een andere url die je aanroept.
Zo moet in de onderstaande code de php code langs berichten dynamisch worden:wil er wel een vergoeding voor betalen, dan moet ik ergens anders dit posten zeker?
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<?php
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
session_start();
?>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<?php
}
else{
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<?php session_start(); ?>
<link rel="stylesheet" type="text/css" href="css1/scroll.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
});
});
</script>
</head>
<body>
<ul id="thicktabs">
<li><a class="laad_pagina" href="index053.php">Wijzigen</a></li>
<li><a class="laad_pagina" href="inbox4.php">Berichten><?php
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
</ul>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<a class="laad_pagina" href="index053.php">Laad pagina 1</a>
</body>
</html>
<?php
}
?>
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
session_start();
?>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<?php
}
else{
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<?php session_start(); ?>
<link rel="stylesheet" type="text/css" href="css1/scroll.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
});
});
</script>
</head>
<body>
<ul id="thicktabs">
<li><a class="laad_pagina" href="index053.php">Wijzigen</a></li>
<li><a class="laad_pagina" href="inbox4.php">Berichten><?php
$query = "SELECT COUNT(*) AS aantal
FROM yabg3_inhoud WHERE naam= '" . $_SESSION['username'] . "' AND status='ongelezen' ";
$result=mysql_query($query);
while($rows=mysql_fetch_array($result)){
if($rows['aantal'] != 0)
{
echo $rows['aantal'];
}
}
?> </a></li>
</ul>
<div id="target"><img src="afbeeldingen/lounge4.jpg"></div>
<a class="laad_pagina" href="index053.php">Laad pagina 1</a>
</body>
</html>
<?php
}
?>
Gewijzigd op 10/04/2012 22:35:46 door kurtik watson
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<script>
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
//dit is dus nieuw!!
$('#berichten').load('berichten.php');
});
});
$(document).ready(function(){
$('body').on('click','.laad_pagina',function(e){
e.preventDefault();
$('#target').load($(this).attr('href'), function() {
});
//dit is dus nieuw!!
$('#berichten').load('berichten.php');
});
});
Regel 32 (en waar nu 100 staat kan je natuurlijk nog gewoon de code gebruiken die je boven hebt staan zodat je ook direct bij het laden van de pagina het juiste aantal hebt):
Code (php)
1
<li>Berichten <span id="berichten">100</span></li>
En dan de berichten.php daarin haal je het aantal berichten op uit je database en echo'ed dat naar het scherm.
Gewijzigd op 13/04/2012 10:50:21 door Erwin H
Maar op de plaats waar je de 100 zet, daar moet ik dan niks zetten en alles in de berichten.php? In de berichten.php komt dan de query waar ik het aantal ophaal en dit echo ik dan zoals je hierboven aangeeft ook in de pagina berichten.php.
Kurt
Gewijzigd op 13/04/2012 22:19:04 door kurtik watson