Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > HTML / DHTML / XHTML
HTML / DHTML / XHTML Forum sur la programmation HTML / DHTML/ XHTML et la validation W3C. Cours (X)HTML, FAQ (X)HTML
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 13/09/2011, 08h56   #1
Membre du Club
 
Avatar de bond70
 
Inscription : septembre 2008
Messages : 271
Détails du profil
Informations forums :
Inscription : septembre 2008
Messages : 271
Points : 45
Points : 45
Par défaut Redirection quand formulaire mal rempli

Salut,

Voilà je suis en train de créer un formulaire d'inscription à une newletter avec l'aide de Mailchimp (générateur de code pour ce type de besoin), cependant quand un utilisateur rentre des données erronées, celui-ci est redirigé sur une nouvelle page.

ma page : http://www.leadcreation.com.au/test-page-form/

la nouvelle page qui s'ouvre : http://leadcreation.us1.list-manage....&id=6d03e38ec6

Or je voudrais que la notification reste sur ma page...

Comment dois-je m'y prendre?
bond70 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 13/09/2011, 08h59   #2
Modérateur
 
Avatar de Bisûnûrs
 
Josselin
Développeur Web
Inscription : janvier 2004
Messages : 9 050
Détails du profil
Informations personnelles :
Nom : Josselin
Âge : 29
Localisation : France, Rhône (Rhône Alpes)

Informations professionnelles :
Activité : Développeur Web

Informations forums :
Inscription : janvier 2004
Messages : 9 050
Points : 12 181
Points : 12 181
1. Enlève le target="_blank" de ton form ;
2. Modifie l'action de ton form pour qu'elle pointe sur la page en cours.
Bisûnûrs est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 14/09/2011, 02h51   #3
Membre du Club
 
Avatar de bond70
 
Inscription : septembre 2008
Messages : 271
Détails du profil
Informations forums :
Inscription : septembre 2008
Messages : 271
Points : 45
Points : 45
Merci!

Le problème c'est que maintenant quand le formulaire est bien rempli puis validé => il n'est pas enregistré sur Mailchimp.

Il faudrait donc garder le même "action" mais ne pas afficher le résultat dans un nouvelle fenêtre...

Voici le code (target et action non modifié) :

Code :
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
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<script type="text/javascript" src="http://www.leadcreation.com.au/wp-content/themes/fadelicious/jquery163"></script>
 
<!-- Begin MailChimp Signup Form -->
<link href="http://www.leadcreation.com.au/wp-content/themes/fadelicious/style-nform.css" rel="stylesheet" type="text/css">
<style type="text/css">
	#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
	/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="http://leadcreation.us1.list-manage.com/subscribe/post?u=dea6b0a33f94b9fc2e7709a7c&amp;id=6d03e38ec6" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
	<h2>Subscribe to our mailing list</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
	<label for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
</label>
	<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
	<label for="mce-FNAME">First Name  <span class="asterisk">*</span>
</label>
	<input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
</div>
<div class="mc-field-group">
	<label for="mce-LNAME">Last Name </label>
	<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</div>
	<div id="mce-responses" class="clear">
		<div class="response" id="mce-error-response" style="display:none"></div>
		<div class="response" id="mce-success-response" style="display:none"></div>
	</div>	<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</form>
</div>
<script type="text/javascript">
var fnames = new Array();var ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';
try {
    var jqueryLoaded=jQuery;
    jqueryLoaded=true;
} catch(err) {
    var jqueryLoaded=false;
}
var head= document.getElementsByTagName('head')[0];
if (!jqueryLoaded) {
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js';
    head.appendChild(script);
    if (script.readyState && script.onload!==null){
        script.onreadystatechange= function () {
              if (this.readyState == 'complete') mce_preload_check();
        }    
    }
}
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://downloads.mailchimp.com/js/jquery.form-n-validate.js';
head.appendChild(script);
var err_style = '';
try{
    err_style = mc_custom_error_style;
} catch(e){
    err_style = '#mc_embed_signup input.mce_inline_error{border-color:#6B0505;} #mc_embed_signup div.mce_inline_error{margin: 0 0 1em 0; padding: 5px 10px; background-color:#6B0505; font-weight: bold; z-index: 1; color:#fff;}';
}
var head= document.getElementsByTagName('head')[0];
var style= document.createElement('style');
style.type= 'text/css';
if (style.styleSheet) {
  style.styleSheet.cssText = err_style;
} else {
  style.appendChild(document.createTextNode(err_style));
}
head.appendChild(style);
setTimeout('mce_preload_check();', 250);
 
var mce_preload_checks = 0;
function mce_preload_check(){
    if (mce_preload_checks>40) return;
    mce_preload_checks++;
    try {
        var jqueryLoaded=jQuery;
    } catch(err) {
        setTimeout('mce_preload_check();', 250);
        return;
    }
    try {
        var validatorLoaded=jQuery("#fake-form").validate({});
    } catch(err) {
        setTimeout('mce_preload_check();', 250);
        return;
    }
    mce_init_form();
}
function mce_init_form(){
    jQuery(document).ready( function($) {
      var options = { errorClass: 'mce_inline_error', errorElement: 'div', onkeyup: function(){}, onfocusout:function(){}, onblur:function(){}  };
      var mce_validator = $("#mc-embedded-subscribe-form").validate(options);
      $("#mc-embedded-subscribe-form").unbind('submit');//remove the validator so we can get into beforeSubmit on the ajaxform, which then calls the validator
      options = { url: 'http://leadcreation.us1.list-manage.com/subscribe/post-json?u=dea6b0a33f94b9fc2e7709a7c&id=6d03e38ec6&c=?', type: 'GET', dataType: 'json', contentType: "application/json; charset=utf-8",
                    beforeSubmit: function(){
                        $('#mce_tmp_error_msg').remove();
                        $('.datefield','#mc_embed_signup').each(
                            function(){
                                var txt = 'filled';
                                var fields = new Array();
                                var i = 0;
                                $(':text', this).each(
                                    function(){
                                        fields[i] = this;
                                        i++;
                                    });
                                $(':hidden', this).each(
                                    function(){
                                        var bday = false;
                                        if (fields.length == 2){
                                            bday = true;
                                            fields[2] = {'value':1970};//trick birthdays into having years
                                        }
                                    	if ( fields[0].value=='MM' && fields[1].value=='DD' && (fields[2].value=='YYYY' || (bday && fields[2].value==1970) ) ){
                                    		this.value = '';
									    } else if ( fields[0].value=='' && fields[1].value=='' && (fields[2].value=='' || (bday && fields[2].value==1970) ) ){
                                    		this.value = '';
									    } else {
	                                        this.value = fields[0].value+'/'+fields[1].value+'/'+fields[2].value;
	                                    }
                                    });
                            });
                        return mce_validator.form();
                    }, 
                    success: mce_success_cb
                };
      $('#mc-embedded-subscribe-form').ajaxForm(options);
 
 
    });
}
function mce_success_cb(resp){
    $('#mce-success-response').hide();
    $('#mce-error-response').hide();
    if (resp.result=="success"){
        $('#mce-'+resp.result+'-response').show();
        $('#mce-'+resp.result+'-response').html(resp.msg);
        $('#mc-embedded-subscribe-form').each(function(){
            this.reset();
    	});
    } else {
        var index = -1;
        var msg;
        try {
            var parts = resp.msg.split(' - ',2);
            if (parts[1]==undefined){
                msg = resp.msg;
            } else {
                i = parseInt(parts[0]);
                if (i.toString() == parts[0]){
                    index = parts[0];
                    msg = parts[1];
                } else {
                    index = -1;
                    msg = resp.msg;
                }
            }
        } catch(e){
            index = -1;
            msg = resp.msg;
        }
        try{
            if (index== -1){
                $('#mce-'+resp.result+'-response').show();
                $('#mce-'+resp.result+'-response').html(msg);            
            } else {
                err_id = 'mce_tmp_error_msg';
                html = '<div id="'+err_id+'" style="'+err_style+'"> '+msg+'</div>';
 
                var input_id = '#mc_embed_signup';
                var f = $(input_id);
                if (ftypes[index]=='address'){
                    input_id = '#mce-'+fnames[index]+'-addr1';
                    f = $(input_id).parent().parent().get(0);
                } else if (ftypes[index]=='date'){
                    input_id = '#mce-'+fnames[index]+'-month';
                    f = $(input_id).parent().parent().get(0);
                } else {
                    input_id = '#mce-'+fnames[index];
                    f = $().parent(input_id).get(0);
                }
                if (f){
                    $(f).append(html);
                    $(input_id).focus();
                } else {
                    $('#mce-'+resp.result+'-response').show();
                    $('#mce-'+resp.result+'-response').html(msg);
                }
            }
        } catch(e){
            $('#mce-'+resp.result+'-response').show();
            $('#mce-'+resp.result+'-response').html(msg);
        }
    }
}
 
</script>
<!--End mc_embed_signup-->
MERCI !!!!
bond70 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 14/09/2011, 07h22   #4
Modérateur
 
Avatar de Bisûnûrs
 
Josselin
Développeur Web
Inscription : janvier 2004
Messages : 9 050
Détails du profil
Informations personnelles :
Nom : Josselin
Âge : 29
Localisation : France, Rhône (Rhône Alpes)

Informations professionnelles :
Activité : Développeur Web

Informations forums :
Inscription : janvier 2004
Messages : 9 050
Points : 12 181
Points : 12 181
Et donc ?
Bisûnûrs est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 15/09/2011, 01h20   #5
Membre du Club
 
Avatar de bond70
 
Inscription : septembre 2008
Messages : 271
Détails du profil
Informations forums :
Inscription : septembre 2008
Messages : 271
Points : 45
Points : 45
Ce que j'aimerais c'est

- que le formulaire soit hébergé sur ma propre page.
- ensuite j'aimerais que quand l'utilisateur ne rentre aucun champ et valide il revienne sur mon formulaire.
- enfin je voudrais que quand le formulaire est bien rempli, qu'un message apparaisse sur ma page indiquant à l'utilisateur qu'un mail de confirmation lui a été envoyé.

Je ne veux pas qu'il y ai des redirections vers les pages Mailchimp. Néanmoins je veux que l'utilisateur puisse s’inscrire à ma liste Mailchimp.
bond70 est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 00h11.


 
 
 
 
Partenaires

Hébergement Web