Notities toevoegen zonder refresh
Ik ben bezig met een systeem en ik wil bij clienten notities kunnen toevoegen dit normaal gesproken geen propleem, maar ik wil niet dat de pagina niet refresht maar wel dat de info wordt weg geschreven naar de database en direct ook wordt ingeladen bij de overige notities, zijn hier al bestaande scripts voor?
Zoals bijvoorbeeld op hyves...
Groet,
Jeroen
Gewijzigd op 01/01/1970 01:00:00 door Jeroen Spaans
Misschien schiet je hier iets mee op => http://woork.blogspot.com/2008/02/using-prototypejs-to-add-record-into.html
ik heb geen idee of dit is wat je zoekt...
Anders als dit het niet is, Kan je op www.google.nl even zoeken.
Je kent de hyves krabbels tog wel?,, je wanneer je een krabbel verzend, wordt de krabbel direct in de lijst erbij gezet zonderdat de pagina, refresht
Quote:
Je kent de hyves krabbels tog wel?
Om eerlijk te zijn nee. Ik ben niet zo weg van dat hyven etc...
Waarom zou je geen refresh willen hebben? Is toch niks mis mee?
ik werk met tabs, en als ik dan refresh komt hij weer helemaal bij de eerste tab te staan...
http://nettuts.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/
http://www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/
Hier moet je vast wel iets mee kunnen.
Ajax is inderdaad de manier om dit te doen. Je verstuurt de ingevulde data als POST of GET (via Ajax) naar een PHP script. Vervolgens verwerkt dit script de input, en geeft een respons terug in bijvoorbeeld XML, JSON of gewoon platte tekst. Met javascript kan je dit vervolgens weer verwerken en zo kan je een hele pagina veranderen zonder één enkele refresh.
Heb jij hiervoor toevallig een voorbeeld scriptje??
Heey dankje!
Helaas,, hij doet et niet,, ik krijg netjes de invul pagina,, maar als je wegklikt of op tab drukt doet hij het niet:(
Json is not defined
http://nettuts.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery
Nu wil ik na dat hij hem heeft verzonden en is goedgekeurt een andere pagina in laden, ik heb nu het volgende, maaar dat werkt niet, want dan krijg ik alleen het woordje test met het plaatje tezien, de link url is goed...
Ik heb die van Nu wil ik na dat hij hem heeft verzonden en is goedgekeurt een andere pagina in laden, ik heb nu het volgende, maaar dat werkt niet, want dan krijg ik alleen het woordje test met het plaatje tezien, de link url is goed...
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
52
53
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
52
53
$(function() {
$('.error').hide();
$('input.text-input').css({backgroundColor:"#FFFFFF"});
$('input.text-input').focus(function(){
$(this).css({backgroundColor:"#FFDDAA"});
});
$('input.text-input').blur(function(){
$(this).css({backgroundColor:"#FFFFFF"});
});
$(".button").click(function() {
// validate and process form
// first hide any error messages
$('.error').hide();
var name = $("input#name").val();
if (name == "") {
$("label#name_error").show();
$("input#name").focus();
return false;
}
var email = $("input#email").val();
if (email == "") {
$("label#email_error").show();
$("input#email").focus();
return false;
}
var dataString = 'name='+ name + '&email=' + email;
var clientnr = $("input#clientnr").val();
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
success: function() {
$('#contact_form').html("<div id='message'></div>");
$('#message').load("../notitie_toevoegen.php&clientnr=" + clientnr + "")
.append("<p>test</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='checkmark' src='images/check.png' />");
});
}
});
return false;
});
});
runOnLoad(function(){
$("input#name").select().focus();
});
$('.error').hide();
$('input.text-input').css({backgroundColor:"#FFFFFF"});
$('input.text-input').focus(function(){
$(this).css({backgroundColor:"#FFDDAA"});
});
$('input.text-input').blur(function(){
$(this).css({backgroundColor:"#FFFFFF"});
});
$(".button").click(function() {
// validate and process form
// first hide any error messages
$('.error').hide();
var name = $("input#name").val();
if (name == "") {
$("label#name_error").show();
$("input#name").focus();
return false;
}
var email = $("input#email").val();
if (email == "") {
$("label#email_error").show();
$("input#email").focus();
return false;
}
var dataString = 'name='+ name + '&email=' + email;
var clientnr = $("input#clientnr").val();
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
success: function() {
$('#contact_form').html("<div id='message'></div>");
$('#message').load("../notitie_toevoegen.php&clientnr=" + clientnr + "")
.append("<p>test</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='checkmark' src='images/check.png' />");
});
}
});
return false;
});
});
runOnLoad(function(){
$("input#name").select().focus();
});
Gewijzigd op 01/01/1970 01:00:00 door Jeroen Spaans
http://docs.jquery.com/Ajax/jQuery.get
Je doet niets met de geladen data... Gewijzigd op 01/01/1970 01:00:00 door Martijn Versluis
maar hoe kan ik die complete pagina, inladen?