Omzetten AJAX functies naar normaal formulier

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Pagina: 1 2 volgende »

Sebas V

Sebas V

20/08/2012 11:05:47
Quote Anchor link
Goedemorgen,

Ik ben verschillende issue's tegengekomen met mijn AJAX gebaseerde formulier en zou deze graag willen omzetten naar een normaal formulier.

Echter, dient deze wel de functies te behouden, namelijk:
- form validatie
- email versturen
- data toevoegen aan de database
- data tonen op RESULT.php

Kan iemand mij tonen waar ik wijzigingen moet brengen zodat de javascript bestand niet meer gebruikt wordt en de functies blijven werken. Er is mij verteld dat dit niet al teveel moeite moet zijn..

Ps. ik heb de titel en inhoud van deze post gewijzigd, dus onderstaande reacties zijn gebaseerd op de vorige titel..

VOORBEELD FORMULIER
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<table width="675px" cellpadding="0" cellspacing="0">
                                                <form id="ContactForm" action="">

                                                <tr class="rij_contactpersoon">
                                                    <td class="left_td">Contactpersoon</td><td><input id="contactpersoon" name="contactpersoon" class="inplaceError" maxlength="120" type="text" class="error" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
                                                </tr>

                                                <tr class="rij_bedrijf">
                                                    <td class="left_td">Bedrijfsnaam</td><td><input id="bedrijfsnaam" name="bedrijfsnaam" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
                                                </tr>

                                                <tr>
                                                    <td class="left_td">E-mail</td><td><input id="email" name="email" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
                                                </tr>
                                                <tr>
                                                    <td class="left_td">Telefoonnummer</td><td><input id="telefoon" name="telefoon" class="inplaceError" maxlength="120" type="text" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
                                                </tr>
                                                <tr>
                                                    <td class="left_td">Question 1</td><td><div class="sizer"><label class="label_radio" for="vraag1_A"><input name="vraag1_antwoorden" id="vraag1_A" value="A" type="radio" />A) 10 Ohm</label><label class="label_radio" for="vraag1_B"><input name="vraag1_antwoorden" id="vraag1_B" value="B" type="radio" />B) 1 Ohm</label><label class="label_radio" for="vraag1_C"><input name="vraag1_antwoorden" id="vraag1_C" value="C" type="radio" />C) 0,1 Ohm</label><label class="label_radio" for="vraag1_D"><input name="vraag1_antwoorden" id="vraag1_D" value="D" type="radio" />D) Geen eis</label></div><span id="vraag1_antwoorden" class="foutmelding_quiz" style="display:none;"></span></td>
                                                </tr>
                                                <tr>
                                                    <td class="left_td">Question 2</td><td><div class="sizer"><label class="label_radio" for="vraag2_A"><input name="vraag2_antwoorden" id="vraag2_A" value="A" type="radio" />A) 10 Ohm</label><label class="label_radio" for="vraag2_B"><input name="vraag2_antwoorden" id="vraag2_B" value="B" type="radio" />B) 1 Ohm</label><label class="label_radio" for="vraag2_C"><input name="vraag2_antwoorden" id="vraag2_C" value="C" type="radio" />C) 0,1 Ohm</label><label class="label_radio" for="vraag2_D"><input name="vraag2_antwoorden" id="vraag2_D" value="D" type="radio" />D) Geen eis</label></div><span id="vraag2_antwoorden" class="foutmelding_quiz" style="display:none;"></span></td>
                                                </tr>
                                                <tr>
                                                    <td class="left_td"></td><td><input type="button" class="button_verzenden black" id="send" value="VERSTUUR" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input></form>
</td>
                                                </tr>
                                            </table>





Het oude javascript bestand, deze dient niet meer gebruikt te worden, maar is voor jullie handig om te zien wat eruit werd opgeroepen.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
$(document).ready(function() {
contact.initEventHandlers();
});
var contact = {
    initEventHandlers   : function() {
        /* clicking the submit form */
        $('#send').bind('click',function(event){
            $('#loader').show();
            setTimeout('contact.ContactFormSubmit()',500);
        });
        /* remove messages when user wants to correct (focus on the input) */


$('.inplaceError,.foutmelding_antwoorden',$('#ContactForm')).bind('focus',function(){
            var $this       = $(this);
            var $error_elem = $this.next();
            if($error_elem.length)
                $error_elem.fadeOut(function(){$(this).empty()});
            $('#success_message').empty();  
        });
        /* user presses enter - submits form */
        $('#ContactForm input,#ContactForm textarea').keypress(function (e) {
            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {  


$("#send").click();
                return false;  
            }
            else  
                return true;  
        });
    },
    ContactFormSubmit   : function() {
        $.ajax({
               type     : 'POST',
               url      : 'php/contact.php?ts='+new Date().getTime(),
               dataType : 'json',
               data     : $('#ContactForm').serialize(),
               success  : function(data,textStatus){
                              //hide the ajax loader
                              $('#loader').hide();
                              if(data.result == '1'){
window.location = 'result.php';
                                   //show success message
                                   $('#midden').remove();
                                   var tekst = $('input[name=vraag1_antwoorden]:checked').val();
                                   $('#succes_A_div span').html(tekst);

                                   var tekst = $('input[name=vraag2_antwoorden]:checked').val();
                                   $('#succes_B_div span').html(tekst);

                                   //ook nog nodig om het echt te tonen?
                                   $('#succes_A_div').show();
                                   $('#succes_B_div').show();

                                }
                              else if(data.result == '-1'){
                                  for(var i=0; i < data.errors.length; ++i ){
                                      if(data.errors[i].value!='') {
                                        var elm = $("#"+data.errors[i].name);
                                        // we gaan kijken welk soort element elm is.
                                        // wanneer dat element een span is, moeten we geen nieuwe span meer aanmaken...
                                        switch (elm[0].tagName.toLowerCase()) {
                                          case 'span':
                                            elm.html(data.errors[i].value).fadeIn();
                                            break;
                                          default:
                                            elm.next().html('<span class="foutmelding_quiz">'+data.errors[i].value+'</span>').fadeIn();
                                            break;
                                        }
                                      }

                                          $("#"+data.errors[i].name).next().html('<span class="foutmelding_antwoorden">'+data.errors[i].value+'</span>').fadeIn();
                                  }
                              }                      
                          },
               error    : function(data,textStatus){}
        });
    }  
};





CONTACT.PHP (wat moet ik hierin toevoegen, verwijderen?)
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<?php
require_once("db.php");                 /* Database Class */
require_once('utils/is_email.php');     /* Email Validation Script */

/* Handle Ajax Request */

if(isset($_POST['newcontact'])){
    $contact = new Contact();
    unset($contact);
}

else{
    header('Location: ../result.php');
}


/* Class Contact */
class Contact{

private $db;                        /* the database obj */

private $errors         = array();  /* holds error messages */
private $num_errors;                /* number of errors in submitted form */

public function __construct(){
    $this->db = new DB();
    if(isset($_POST['newcontact']))
        $this->processNewMessage();
    else
        header("Location: ../result.php");
}


public function processNewMessage(){

    $contactpersoon     = $_POST['contactpersoon'];    
    $bedrijfsnaam       = $_POST['bedrijfsnaam'];
    $telefoon           = $_POST['telefoon'];
    $email              = $_POST['email'];
    $vraag1_antwoorden  = $_POST['vraag1_antwoorden'];
    $vraag2_antwoorden  = $_POST['vraag2_antwoorden'];


    /* Server Side Data Validation */

    /* Contactpersoon Validation */

    if(!$contactpersoon || mb_strlen($contactpersoon = trim($contactpersoon)) == 0)
        $this->setError('contactpersoon', 'Vul uw contactpersoon in');
    else if(mb_strlen(trim($contactpersoon)) > 120)
        $this->setError('contactpersoon', 'Te lang! 120 karakters max.');

    /* Bedrijfsnaam Validation */
        if(!$bedrijfsnaam || mb_strlen($bedrijfsnaam = trim($bedrijfsnaam)) == 0)
        $this->setError('bedrijfsnaam', 'Vul uw bedrijfsnaam in');
    else if(mb_strlen(trim($bedrijfsnaam)) > 120)
        $this->setError('bedrijfsnaam', 'Te lang! 120 karakters max.');

        /* Telefoon Validation */
        if(!$telefoon || mb_strlen($telefoon = trim($telefoon)) == 0)
        $this->setError('telefoon', 'Vul uw telefoonnummer in');
    else if(mb_strlen(trim($telefoon)) > 120)
        $this->setError('telefoon', 'Te lang! 120 karakters max.');

        /* Vraag 1 Validation */
        if(!$vraag1_antwoorden || mb_strlen($vraag1_antwoorden = trim($vraag1_antwoorden)) == 0)
        $this->setError('vraag1_antwoorden', 'Selecteer een antwoord a.u.b.');

        /* Vraag 2 Validation */
        if(!$vraag2_antwoorden || mb_strlen($vraag2_antwoorden = trim($vraag2_antwoorden)) == 0)
        $this->setError('vraag2_antwoorden', 'Selecteer een antwoord a.u.b.');

        /* Email Validation */
    if(!$email || mb_strlen($email = trim($email)) == 0)
        $this->setError('email','Vul uw e-mail in');
    else{
        if(!is_email($email))
            $this->setError('email', 'Vul een correct email adres in');
        else if(mb_strlen($email) > 120)
            $this->setError('email', 'Te lang! 120 karakters max.');
    }


    /* Errors exist */
    if($this->countErrors() > 0){
        $json = array(
            'result' => -1,
            'errors' => array(
                            array('name' => 'contactpersoon'    ,'value' => $this->error_value('contactpersoon')),
                            array('name' => 'bedrijfsnaam'  ,'value' => $this->error_value('bedrijfsnaam')),
                            array('name' => 'email'     ,'value' => $this->error_value('email')),                              
                            array('name' => 'telefoon'  ,'value' => $this->error_value('telefoon')),
                            array('name' => 'vraag1_antwoorden' ,'value' => $this->error_value('vraag1_antwoorden')),
                            array('name' => 'vraag2_antwoorden' ,'value' => $this->error_value('vraag2_antwoorden')),
                        )
            );
              
        $encoded = json_encode($json);
        echo $encoded;
        unset($encoded);
    }

    /* No errors, insert in db*/
    else{
        if(($ret = $this->db->dbNewMessage($contactpersoon, $bedrijfsnaam, $email, $telefoon, $vraag1_antwoorden, $vraag2_antwoorden)) > 0){
            $json = array('result'      => 1);
            if(SEND_EMAIL)
                $this->sendEmail($contactpersoon,$bedrijfsnaam,$email,$telefoon,$vraag1_antwoorden,$vraag2_antwoorden);
        }
  
        else
            $json = array('result'      => -2); /* something went wrong in database insertion  */
        $encoded = json_encode($json);
        echo $encoded;
        unset($encoded);
    }
}


public function sendEmail($contactpersoon,$bedrijfsnaam,$email,$telefoon,$vraag1_antwoorden,$vraag2_antwoorden){
    /* Just format the email text the way you want ... */
    $message_body   = "<div style=\"font-size:12px; font-weight:normal;\">Hallo,<br><br>"
                                ."Het volgende bedrijf heeft zich zojuist aangemeld:</div><br>"
                                ."<table cellpadding=\"1\" cellspacing=\"1\" width=\"550px\"><tr><td style=\"font-size:12px; color:#000000\">Bedrijfsnaam:</td><td style=\"font-size:12px; color:#000000\">".$bedrijfsnaam."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Contactpersoon:</td><td style=\"font-size:12px; color:#000000\">".$contactpersoon."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Telefoonnummer:</td><td style=\"font-size:12px; color:#000000\">".$telefoon."</td></tr><tr><td style=\"font-size:12px; color:#000000\">E-mail:</td><td style=\"font-size:12px; color:#000000\">".$email."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Antwoord vraag 1:</td><td style=\"font-size:12px; color:#000000\">".$vraag1_antwoorden."</td></tr><tr><td style=\"font-size:12px; color:#000000\">Antwoord vraag 2:</td><td style=\"font-size:12px; color:#000000\">".$vraag2_antwoorden."</td></tr></table><br>";

        // Geef GELDIGE adressen op
        // Een korte benaming voor jouw website

        $website_naam = 'Aanmelding';
        // Jouw eigen geldige emailadres
        $eigen_emailadres = 'EMAIL';
        // Een geldig emailadres voor errors
        $error_emailadres = 'EMAIL';
        // De naam van de verzender
        $naam_verzender = ''.$bedrijfsnaam.'';
        // Het geldige emailadres van de afzender
        $email_verzender = ''.$email.'';
        // Een geldig emailadres of helemaal leeg laten
        $bcc_emailadres = '';
        // HTML mail? True/False
        $html = true;

        // De headers samenstellen
        $headers     = 'From: ' . $website_naam . ' <' . $eigen_emailadres . '>' . PHP_EOL;
        $headers    .= 'Reply-To: ' . $naam_verzender . ' <' . $email_verzender . '>' . PHP_EOL;
        $headers    .= 'Return-Path: Mail-Error <' . $error_emailadres . '>' . PHP_EOL;
        $headers    .= ($bcc_emailadres != '') ? 'Bcc: ' . $bcc_emailadres . PHP_EOL : '';
        $headers    .= 'X-Mailer: PHP/' . phpversion() . PHP_EOL;
        $headers    .= 'X-Priority: Normal' . PHP_EOL;
        $headers    .= ($html) ? 'MIME-Version: 1.0' . PHP_EOL : '';
        $headers    .= ($html) ? 'Content-type: text/html; charset=iso-8859-1' . PHP_EOL : '';


        mail(EMAIL_TO,MESSAGE_SUBJECT,$message_body,$headers);

}


public function setError($field, $errmsg){
    $this->errors[$field]   = $errmsg;
    $this->num_errors       = count($this->errors);
}


public function error_value($field){
    if(array_key_exists($field,$this->errors))
        return $this->errors[$field];
    else
        return '';
}


public function countErrors(){
    return $this->num_errors;
}
};

?>



RESULT.PHP (waar de ingevoerde data getoond moet worden, na het submitten. Momenteel heb ik alleen divs gemaakt voor beide vragen ter voorbeeld.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
<body ontouchmove="BlockMove(event);">
    <div id="position">
    <div id="contact">
        <div id="bevestiging">
            <div id="succes_A_div">U koos voor antwoord: <span><span></div><br />
            <div id="succes_B_div">U koos voor antwoord: <span><span></div>
        </div>
    </div>
    </div>
</body>
Gewijzigd op 20/08/2012 14:54:13 door Sebas V
 
PHP hulp

PHP hulp

10/12/2022 00:36:15
 
Erwin H

Erwin H

20/08/2012 11:08:03
 
Sebas V

Sebas V

20/08/2012 11:11:10
Quote Anchor link
Goedemorgen Erwin,

Nee de data weergeven werkt zoals we besproken hadden, maar dit gebeurd nu op dezelfde pagina "QUIZ.PHP".

Ik zou deze data graag willen tonen op een andere pagina "RESULT.PHP".
 
Kris Peeters

Kris Peeters

20/08/2012 11:17:10
Quote Anchor link
Ik zie een syntax error in je javascript.
Je moet lijnen 52 en 53 afsluiten met puntkomma.

Je kan niet verder programmeren zolang je een syntax error hebt.

Maar om toch op je vraag te antwoorden:
Na een succesvolle request te hebben ontvangen gebruik je window.location

Dus zoiets:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
$.ajax({
  type     : 'POST',
  url      : 'php/contact.php?ts='+new Date().getTime(),
  dataType : 'json',
  data     : $('#ContactForm').serialize(),
  success  : function(data,textStatus) {
    // doe hier verder wat je te doen hebt
    // ...
    window.location = 'mijnpagina.php';
  }
});


Ik veronderstel dat je dit wil doen net onder

if(data.result == '1'){
 
Sebas V

Sebas V

20/08/2012 11:28:55
Quote Anchor link
Hallo Kris,

de redirect werkt op deze manier, alleen wordt mijn data niet meegenomen naar RESULT.PHP

Zo ziet mijn RESULT.PHP eruit.
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
<body>
<div id="position">
<div id="contact">
        <div id="bevestiging">
            <div id="succes_A_div">U koos voor antwoord: <span><span></div><br />
            <div id="succes_B_div">U koos voor antwoord: <span><span></div>
        </div>
</div>
</div>
</body>
Gewijzigd op 20/08/2012 11:31:45 door Sebas V
 
Erwin H

Erwin H

20/08/2012 11:47:28
Quote Anchor link
Maar probeer eens uit te leggen waarom je alsnog een extra redirect wilt? Volgens mij blijft het een onnodige extra pageload. Zoals ook in je andere topic besproken.
 
Sebas V

Sebas V

20/08/2012 11:50:52
Quote Anchor link
Ik zou graag op RESULT.PHP in een ander soort ontwerp een overzicht van de ingevoerde data willen tonen en een print functie willen aanbieden.
Gewijzigd op 20/08/2012 11:57:39 door Sebas V
 
Erwin H

Erwin H

20/08/2012 12:23:51
Quote Anchor link
Dan moet je dus niet via een Ajax call de data versturen, maar via een normale submit.
 
Sebas V

Sebas V

20/08/2012 12:28:57
Quote Anchor link
Oke als dat de beste optie is dan moet het op die manier, maar ik zou graag de database toevoeging + email verzenden willen behouden.

Op dit moment is dat gebaseerd op de AJAX functie via de contact.php.
Moet ik daarin veel dingen veranderen?

Ik denk met name in het bovenste stuk?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<?php
require_once("db.php");                 /* Database Class */
require_once('utils/is_email.php');     /* Email Validation Script */

/* Handle Ajax Request */

if(isset($_POST['newcontact'])){
    $contact = new Contact();
    unset($contact);
}

else{
    header('Location: ../result.php');
}


/* Class Contact */
class Contact{

private $db;                        /* the database obj */

private $errors         = array();  /* holds error messages */
private $num_errors;                /* number of errors in submitted form */

public function __construct(){
    $this->db = new DB();
    if(isset($_POST['newcontact']))
        $this->processNewMessage();
    else
        header("Location: ../result.php");
}

[
/code]
Gewijzigd op 20/08/2012 12:30:12 door Sebas V
 
Erwin H

Erwin H

20/08/2012 12:33:57
Quote Anchor link
Het beste is alleen te bepalen op basis van de randvoorwaarden die je stelt. Ik zou die stellen als 'geen onnodige client-server connecties'. In dit geval zou je dat wel hebben als je eerst een connectie maakt om de data te versturen en dan nogmaals een connectie maakt om een nieuwe pagina te laden.

Aangezien je geen serverside redirect kunt doen tijdens een Ajax call (of beter gezegd, kan wel, maar je kan niet de pagina herladen op die manier), zal je dus bij bovenstaande randvoorwaarde de ajax call moeten laten varen.

Verder is een ajax call niets anders dan een normale page load. Het enige verschil zit in feite client side, namelijk hoe de call wordt opgezet. Server side zou je in principe dus niet zoveel hoeven te veranderen. Enige wat ik zo kan zien is de output. Je stuurt nu JSON output terug, maar dat moet je dan niet doen, want dat kan de browser in principe niet lezen.
 
Sebas V

Sebas V

20/08/2012 13:12:53
Quote Anchor link
Hee Erwin,

ik ben van plan om de ajax call te laten varen, het kost met teveel tijd en ik krijg het niet zoals ik het wil hebben.

Zou je me een beetje op weg kunnen helpen waar ik elementen moet veranderen, zodat de validatie, email versturen en database toevoeging blijven werken?
 
Erwin H

Erwin H

20/08/2012 13:31:43
Quote Anchor link
Als je het goed hebt opgezet helemaal niets. Enige wat je moet veranderen is de JSON output eruit halen en vervangen door de juiste redirect (als alles goed is gegaan), of de juiste error pagina (als er iets verkeerd ging).
 
Sebas V

Sebas V

20/08/2012 13:45:11
Quote Anchor link
Dit is nu hoe ik mijn javascript heb zonder JSON output en nieuwe redirect, maar hij doet alleen een redirect, rest van de functies als data laten zien, email verzenden en data overzetten werk niet.

JAVASCRIPT
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
ContactFormSubmit    : function() {
        $.ajax({
               type        : 'POST',
               url        : 'result.php',    
               data        : $('#ContactForm').serialize(),
               success    : function(data,textStatus){
                              //hide the ajax loader
                              $('#loader').hide();
                              if(data.result == '1'){
                                   //show success message
                                   $('#midden').remove();
                                   var tekst = $('input[name=vraag1_antwoorden]:checked').val();
                                   $('#succes_A_div span').html(tekst);
                                  
                                   var tekst = $('input[name=vraag2_antwoorden]:checked').val();
                                   $('#succes_B_div span').html(tekst);
                                
                                   //ook nog nodig om het echt te tonen?
                                   $('#succes_A_div').show();
                                   $('#succes_B_div').show();
                                                                     
                                }


Moet ik aan mijn formulier nog bepaalde acties koppelen?

VOORBEELD STUKJE FORMULIER
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<form id="ContactForm" action="">
<tr>
<td class="left_td">Contactpersoon</td><td><input id="contactpersoon" name="contactpersoon" class="inplaceError" maxlength="120" type="text" class="error" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
</tr>
<input type="button" class="button_verzenden black" id="send" value="VERSTUUR" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input>
</form>
Gewijzigd op 20/08/2012 13:46:00 door Sebas V
 
Erwin H

Erwin H

20/08/2012 13:50:07
Quote Anchor link
Waarom ben je nu in javascript bezig? Ik dacht dat je de Ajax call liet varen?
 
Sebas V

Sebas V

20/08/2012 13:53:49
Quote Anchor link
Oh sorry, ik ben een beetje in de war.

ik neem aan dat hierin de wijzigingen moeten plaatsvinden?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
/* Handle Ajax Request */
if(isset($_POST['newcontact'])){
    $contact = new Contact();
    unset($contact);
}
else{
    header('Location: ../result.php');
}

/* Class Contact */
class Contact{

private $db;                        /* the database obj */

private $errors         = array();  /* holds error messages */
private $num_errors;                /* number of errors in submitted form */

public function __construct(){
    $this->db = new DB();
    if(isset($_POST['newcontact']))
        $this->processNewMessage();
    else
        header("Location: ../result.php");
}


Moet ik verder nog een actie koppelen aan mijn formulier?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<form id="ContactForm" action="">
<tr>
<td class="left_td">Contactpersoon</td><td><input id="contactpersoon" name="contactpersoon" class="inplaceError" maxlength="120" type="text" class="error" autocomplete="off" onFocus="window.scrollTo(0, 0);"/><span class="error" style="display:none; margin-left:40px;"></span></td>
</tr>
<input type="button" class="button_verzenden black" id="send" value="VERSTUUR" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input>
</form>
 
Erwin H

Erwin H

20/08/2012 15:57:25
Quote Anchor link
Sebastian V op 20/08/2012 13:53:49:
ik neem aan dat hierin de wijzigingen moeten plaatsvinden?

Geen idee, het is jouw script.

Sebastian V op 20/08/2012 13:53:49:
Moet ik verder nog een actie koppelen aan mijn formulier?

Ja, een action zou je in principe altijd moeten definieren als je een normale submit wilt doen. Als je het niet doet zal de submit worden gedaan naar de huidige pagina, maar het is netter om er gewoon voor te zorgen dat er een action is. Net als overigens een 'method' (post of get).
 
Sebas V

Sebas V

20/08/2012 16:06:50
Quote Anchor link
Oke,

ik heb de volgende action toegevoegd:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<form id="ContactForm" action="php/contact.php" method="post">


In contact.php heb ik het AJAX request gedeelte verwijderd en de class contact laten staan, is dit voldoende?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
/* Class Contact */
class Contact{
    
    private $db;                         /* the database obj */
    
    private $errors         = array();  /* holds error messages */
    private $num_errors;                   /* number of errors in submitted form */
    
    public function __construct(){
        $this->db = new DB();
        if(isset($_POST['newcontact']))
            $this->processNewMessage();
        else
            header('Location: ../result.php');
    }
 
Erwin H

Erwin H

20/08/2012 16:14:41
Quote Anchor link
Op vragen als 'is dat voldoende?' kan ik natuurlijk nooit antwoord geven. Ik ken je script niet, dat zal je echt zelf moeten uitvogelen.

In elk geval moet je je nu afvragen waar en wanneer die class wordt geinstanteerd. Hoe gebruik je het?

En tenslotte... zelf testen kan natuurlijk geen kwaad. Werkt het zoals je wil dan was het blijkbaar voldoende, werkt het niet dan was het dat niet...
 
Sebas V

Sebas V

20/08/2012 16:41:13
Quote Anchor link
De ID "send" van de verzend button werd getriggerd in het JAVASCRIPT bestand.
De ID "newcontact" van de hidden button wordt opgeroepen door de class contact hierboven.

Buttons:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<input type="button" class="button_verzenden black" id="send" value="VERSTUUR" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input>


Ik ben geen koning in het aanpassen van dit script en loop hierop vast. Weet je anders een referentie tutorial of project waar ik hierover meer informatie kan vinden?
Gewijzigd op 20/08/2012 16:41:39 door Sebas V
 
Erwin H

Erwin H

20/08/2012 16:58:36
Quote Anchor link
De class checked misschien iets in de POST, maar dat wil nog niet zeggen dat er ook een instantie van die class bestaat. Zolang je nergens in je script iets hebt in de zin van:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
<?php
$myVar
= new Contact();
?>

wordt er geen instantie van de class aangemaakt. In het Ajax deel stond dat wel:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<?php
if(isset($_POST['newcontact'])){
    $contact = new Contact();
    unset($contact);
}

?>

Hier wordt een instantie van het object aangemaakt en zo te zien kan je dit deel behouden voor je nieuwe script. Ik zou alleen de 'if' veranderen in:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
<?php
if ( $_SERVER[REQUEST_METHOD] == 'POST' ){
?>


Nee, ik werk niet met tutorials en ik ken er geen, daar kan ik je niet bij helpen.
 
Sebas V

Sebas V

21/08/2012 11:31:06
Quote Anchor link
Goedemorgen Erwin,

Ik heb de instantie van de class aangemaakt. Nu is mij verteld op een ander forum dat ik in onderstaand gedeelte de result.php kan vermelden, zodat de pagina succesvol geladen wordt. Het formulier dient dan de volgende action te bevatten:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<form id="ContactForm" action="php/contact.php" method="post">


Zou je me een voorbeeld kunnen geven wat ik moet verwijderen/toevoegen in onderstaande code? De man had het erover dat ik de JSON eruit moet halen en HTML moet toevoegen, hoe realiseer ik dit?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
/* Errors exist */
        if($this->countErrors() > 0){
            $json = array(
                'result' => -1,
                'errors' => array(
                                array('name' => 'contactpersoon'    ,'value' => $this->error_value('contactpersoon')),
                                array('name' => 'bedrijfsnaam'    ,'value' => $this->error_value('bedrijfsnaam')),
                                array('name' => 'email'        ,'value' => $this->error_value('email')),                                
                                array('name' => 'telefoon'    ,'value' => $this->error_value('telefoon')),
                                array('name' => 'vraag1_antwoorden'    ,'value' => $this->error_value('vraag1_antwoorden')),
                                array('name' => 'vraag2_antwoorden'    ,'value' => $this->error_value('vraag2_antwoorden')),
                            )
                );                
            $encoded = json_encode($json);
            echo $encoded;
            unset($encoded);
        }
        /* No errors, insert in db*/
        else{
            if(($ret = $this->db->dbNewMessage($contactpersoon, $bedrijfsnaam, $email, $telefoon, $vraag1_antwoorden, $vraag2_antwoorden)) > 0){
                $json = array('result'         => 1);
                if(SEND_EMAIL)
                    $this->sendEmail($contactpersoon,$bedrijfsnaam,$email,$telefoon,$vraag1_antwoorden,$vraag2_antwoorden);
            }    
            else
                $json = array('result'         => -2); /* something went wrong in database insertion  */
            $encoded = json_encode($json);
            echo $encoded;
            unset($encoded);
        }
    }
Gewijzigd op 21/08/2012 11:40:19 door Sebas V
 

Pagina: 1 2 volgende »



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.