$_POST Werkt niet (blijft niet staan in box)
ik heb een beetje een nare vraag, maar dat moet kunnen op dagen als vandaag ;-)
In navolging van een vorig topic & enkele vorige projectjes heb ik volgend test-script geschreven...
index.php
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
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
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Overzicht prestaties</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://tablesorter.com/__jquery.tablesorter.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#klik").click(function() {
$.ajax({
type: "POST",
url: "melding.php",
data: "tekst=overzicht",
async: false,
success : function(text) {
$('#login').html(text);
}
});
});
</script>
</head>
<body>
<div id="login" style="width: 500px; height: 400px"></div>
<a id="klik" href="">Klik!</a>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title>Overzicht prestaties</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://tablesorter.com/__jquery.tablesorter.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#klik").click(function() {
$.ajax({
type: "POST",
url: "melding.php",
data: "tekst=overzicht",
async: false,
success : function(text) {
$('#login').html(text);
}
});
});
</script>
</head>
<body>
<div id="login" style="width: 500px; height: 400px"></div>
<a id="klik" href="">Klik!</a>
</body>
</html>
melding.php
Nu dit werkt slechts deels, want..... Als ik op de link 'Klik!' druk, dan verschijnt het resultaat slechts tijdelijk (praktische halve seconde) in de box 'login'. Dus het blijft er niet staan zoals ik wel zou willen. Enige persoon die de fout ziet en kan rechtzetten/oplossen?
Vriendelijke groeten,
Olivier
Wat wil je precies bereiken?
Dit lukt wel, zoals aangegeven, maar het resultaat verdwijnt terug uit het divje vanzodra de pagina geladen is (tijden het laden toont dit het resultaat wel). Waarschijnlijk een fout ergens?
Alvast bedankt
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript" src="http://tablesorter.com/__jquery.tablesorter.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#klik").click(function() {
$.ajax({
type: "POST",
url: "melding.php",
data: "tekst=overzicht",
async: false,
success : function(text) {
$('#login').html(text);
}
});
}); // <-- Deze was je vergeten
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#klik").click(function() {
$.ajax({
type: "POST",
url: "melding.php",
data: "tekst=overzicht",
async: false,
success : function(text) {
$('#login').html(text);
}
});
}); // <-- Deze was je vergeten
});
</script>
Ik krijg ook telkens 1 sec maar de waarde terug maar als
je iets beter uitlegd hoe je aan de waarde komt die je mee post
in ajax kan ik je verder helpen
Gewijzigd op 31/10/2012 21:58:06 door Mr Beronne
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript">
$(document).ready(function(){
$("#klik").click(function() {
var overzicht = $("#myTable").html();
$.ajax({
type: "POST",
url: "exemple00.php", // Laad pagina exemple00.php
data: "tekst="+ escape(overzicht), //Data verzenden, met variabele overzicht (ge-escaped omdat deze vrij lang is)
async: false,
success : function(text) {
$('#login').html(text); // = steek tekst als innerHTML van het element met id="login"
}
});
});
});
</script>
$(document).ready(function(){
$("#klik").click(function() {
var overzicht = $("#myTable").html();
$.ajax({
type: "POST",
url: "exemple00.php", // Laad pagina exemple00.php
data: "tekst="+ escape(overzicht), //Data verzenden, met variabele overzicht (ge-escaped omdat deze vrij lang is)
async: false,
success : function(text) {
$('#login').html(text); // = steek tekst als innerHTML van het element met id="login"
}
});
});
});
</script>
De variabele die ik dus wil posten, haal ik via de $().html manier uit een div '#myTable' (zeer lange variabele trouwens, maar dat doet er niet toe)...
Daarna wil ik ze posten, maar dit lukt dus niet om het resultaat vast te houden.
Op andere pagina's/websites waar ik dit gebruik, lukt dit wel dus ik snap het niet (misschien kun jij een voorbeeld posten van een goede POST AJAX?)?
Vriendelijke groeten
het login vak krijg dan een rode achtergrond en heeft een slideDown. Wil je alleen de data hebben moet je
.css("background","red").slideDown("slow"); weglaten + de if else statement en in div id login de display: none weghalen.
Ik heb op index.php een div aangemaakt als voorbeeld waar ik dus zeg maar data uithaal.
deze wordt dan gestuurd naar melding.php die een echt terug doet en in id$login zet.
Hoop dat je weer verder kan.
index.php
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
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
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Overzicht prestaties</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
$("#klik").click(function(){
var overzicht = "overzicht=" + $("#myTable").html();
//alert(overzicht);
$.ajax({
type: "POST",
url: "melding.php",
data: overzicht,
cache: false,
success: function(data){
if($("#login").is(":hidden")){
$("#login").html(data).css("background","red").slideDown("slow");
} else {
$("#login").hide();
}
}
});
});
});
</script>
</head>
<body>
<div id="myTable">Voorbeeld...Voorbeeld...Voorbeeld...</div>
<a href="#" id="klik">Klik!</a>
<div id="login" style="width: 500px; height: 400px; display: none"></div>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title>Overzicht prestaties</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
$("#klik").click(function(){
var overzicht = "overzicht=" + $("#myTable").html();
//alert(overzicht);
$.ajax({
type: "POST",
url: "melding.php",
data: overzicht,
cache: false,
success: function(data){
if($("#login").is(":hidden")){
$("#login").html(data).css("background","red").slideDown("slow");
} else {
$("#login").hide();
}
}
});
});
});
</script>
</head>
<body>
<div id="myTable">Voorbeeld...Voorbeeld...Voorbeeld...</div>
<a href="#" id="klik">Klik!</a>
<div id="login" style="width: 500px; height: 400px; display: none"></div>
</body>
</html>
melding.php
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<?php
// Waarde vanuit ajax
// wordt terug gegeven in div#login
echo $_POST["overzicht"];
[/code]
// Waarde vanuit ajax
// wordt terug gegeven in div#login
echo $_POST["overzicht"];
[/code]
Gewijzigd op 01/11/2012 16:01:02 door Mr Beronne
Super! Het werkt perfect, waarvoor mijn dank ;-)