Ajax Contact Form with Attachments and no spam control (drag and drop, reCaptcha, ayah) The w2 Ajax Contact Form is a complete solution to create ajax contact form. Designed to be a flexible plugin, this item offer classics and originals features. You can easily create your own forms HTML templates and your own themes CSS.
minimum requirements:
PHP version 5.x (PHP5 or higher).
No Spam Control (Drag and Drop)
The drag’n’drop No Spam Control is an user friendly alternative to the traditionnal Captcha. It is not a simple drag’n’drop feature to display the send Button. It is a complete solution for anti spam.
The No Spam Control controls the time between each submission (configurable max/min) and generate some hiddens fields with an encryption key (configurable) when the dragger is dropped. The hidden fields are generated with alphanumeric random and Time (encrypted via encryption key) to ensure that the No Spam Control fields are available only for a limited period (configurable). This is a really safe and user friendly protection. Then it is easy to customise it with CSS.
There is 4 type for No Spam Control:
basic (simply drag’n’drop) colors (drag’n’drop the right color) numbers (drag’n’drop the right number) shapes (drag’n’drop the right shape)
ChangeLog:
version 1.1.15:
Added CSS transition for IE 10 .
version 1.1.14:
Fix bug for placeholder on IE9.
version 1.1.13:
New method to only upload files (not send them as attachment).
version 1.1.12:
New feature to add attachment files to the auto-responder message.
version 1.1.11:
Add loader for nospam control to display button “send” only when nospam hidden fields are completely loaded (usefull for slow server connexion).
version 1.1.10:
Fix CSS bug for custom file input in IE10.
version 1.1.9:
Adding new laguage (Portuguese).
version 1.1.8:
Possibility to add fields value in the auto-responder message (just use shortcode [field_name] in the content of the mail responder message). New HTML form template with HTML5 attribute placeholder.
version 1.1.7:
upgraded the PHP AYAH library to fix error
version 1.1.6:
Progress bar for attachment file upload Fix error for jquery 1.9 ($.browser). Adding the HTML attributes enctype=”multipart/form-data” for form element in examples.
version 1.1.5:
CSS transition now available for browser Chrome, Safari and Opera.
version 1.1.4:
Automatic reloading of AYAH after form submission. Fix CSS bug for button send color with CSS theme hot-sneaks.
version 1.1.3:
Fix PHP 5.4 error for $_FILES. Fix CSS bug for UI button set on Chrome. Jquery UI 1.9.2 included in download package (if you need to use it). Body mail message display breakline (for Textarea fields value).
version 1.1.2:
Fix bug for checkbox fields width in Chrome. You can add your own custom file field in your form.
version 1.1.1:
You can send your email via SMTP with authentification (example: gmail). New method to create your own HTML template for the mail body message. New javascript callback for submit success event. You can create your own javascript function for submit success event.
version 1.1.0:
You can send your email via SMTP. Fix encodage bug for utf_8 content in the mail message to accept all type of character. new CSS style (resizable) optimized for iDevices. fix error message for missing language translation. javascript callback function (beforeSubmit) to create your own specific rules of validation. code source form editor (included in download package). easy insatallation package (all files in one folder). new CSS UI themes (for UI widget datepicker, buttonset …). auto-responder feature. easy translation method for PHP notifications messages (via .tmx file). ayah (Are You A Human) integration.
Wordpress version available
Features
Multiple or single attachments files (you can easily disable this feature). Multiple or single recipient (simultaneously or not). Easy to configure (html, css, javascript, php). Easy to add (or remove) your own fields. Auto-responder feature (configurable). Javascript and php validation. Email message accepts HTML content (configurable). You can use multiple instance of form in the same page. PHP Script based on the open source Zend Framework Components Mail, Mime and Translate. Drag and Drop feature (no spam control) have 4 differents models (view live preview). Drag and Drop feature (no spam control) is ready for touch screen. ReCaptcha integration. ayah (Are You A Human) integration. Full documentation (examples well documented). JQuery plugin fully configurable: //Initialisation of the form $('#w2ContactForm').w2ContactForm({ noSpamControl: true, //Specifie if No Spam Control is activate (true / false) noSpamControlType: 1, //Spcifie the Type of No Spam Control (1 / 2) resetForm: true, //Spcifie if reset form after submit (true / false) reCaptchaPublicKey: null, //Specifie your reCaptcha PublicKey reCaptchaId: 'recaptcha', //Specifie an unqiue ID for HTML element where reCaptcha will be integrated (just specifie the ID do not create the element in the form) reCaptchaTheme: 'clean', //Specifie the reCaptcha theme you want to use reCaptchaLang: 'en', //Specifie the reCaptcha Lang you want to use reloadCaptcha: true, //Specifie if captcha is reloaded after submit (true / false) ayah: false, //Specifie if AYAH is activate (true / false) attachmentFile: true, //Specifie if attachment file is activate (true / false) maxAttachments: 5, //Specifie the maximum number of attachments files showBtnSend: false, //Specifie if the btn send is visible when loading form when No Spam Control is activate (true / false) customFileInput: true, //Specifie if file input is custom skin (true / false) submitAlertType: 'slide', //Specifie the type of alert displaying for submit (dialog / slide) maxAttAlertType: 'slide', //Specifie the type of alert displaying for maximum attachments (dialog / slide) urlLoaderImg: 'css/w2_contact_form/images/ajax-loader.gif', //Specifie the url of the loader image nospamInfoHover: true //Specifie if nospam infos is displaying on mouseover (true / false) });
PHP Class fully configurable: //creation of a new instance of Class Contact $contact = new W2ContactForm(); //if you need to redefine some parameters (example: if you have several contact form in your web site) //Specifies the emails sender. If you don't specifie email sender the email used to send the mail will be the user mail (who submit the form) $contact->setMailSender('no-reply@mywebsite.net'); ///Specifies the emails recipients. You can specifies several emails for multiple recipient. If only one email is specifie the default email will be the first (index 1) $contact->setMailRecipient(array('1' => 'youremail@mail.net', '2' => 'youremail2@mail.net')); //Specifies if you want to use auto responder feature $contact->setAutoResponder(true); //Specifies if you want to use an email different that email sender to the auto responder $contact->setMailResponder('no-reply2@mywebsite.net'); //Specifies the name of your web site $contact->setSiteName(array('name of web site')); //Specifies the required fields for the form validation. $contact->setRequiredFields(array('recipient', 'mail', 'subject', 'message')); //Specifies the fields for adding them in the mail body message - if you don't specifie field all the fields will be automatically added to the mail body message $contact->setBodyMessageFields('<p>E-mail: [mail]</p><p>Version: [version]</p><p>Phone: [phone]</p><p>Date of Birth: [datebirth]</p><p>Country: [country]</p><p>Web site: [website]</p><p>Message: [message]</p>'); //Specifies the subject of the email if you don't use subject field in your form $contact->setMailSubject = 'subject of the message'; //Specifies the fields need HTML encodage (example: textarea) $contact->setHtmlFields(array('message')); //Specifies if HTML tags is accepted in the email message (for the textarea form element) $contact->setAcceptHtmlContent(false); //Specifies if the HTML form is encoded in utf_8 $contact->setUtf8Encode(true); //Specifies the folder for uploads attachments files in your server $contact->setUploadsFolder(dirname(__FILE__).'/uploads'); //Specifies the max file size for the attachments files (in octet) $contact->setMaxFileSize(1000000); //Specifies the maximum number for attachments files $contact->setMaxAttachmentFiles(5); //Specifies the accepted extensions (.jpg, .png, .pdf ...) for the attachments files $contact->setExtFileOk(array('pdf', 'doc', 'docx', 'jpeg', 'jpg', 'png', 'gif')); //Specifies if you want to delete files uploaded after email sending $contact->setDeleteUploadsAfterSending(true); //Specifies the minimum and the maximum time between submission of the form (in seconds) $contact->setAntiSpamTimeControl(array('min' => '5', 'max' => '3600')); //Specifies if you want the script configure the CHMOD for "uploads" folder $contact->setAutoCHMOD(false); //Specifies if you want to use no spam control (drag and drop) $contact->setNoSpamControl(true); //Specifies if you want to use recaptcha for validation form $contact->setReCaptcha(false); //Specifies if you want to use AYAH for validation form $contact->setAyah(false); //internationnalization with simple .tmx file (laguages/w2_cf_notifications.tmx) $contact->setLang('en'); //Sending email $contact->sendEmail();
Easy to internationalize (just include the translated file or create your own): for PHP: <?xml version="1.0" encoding="utf-8" ?> <!DOCTYPE tmx SYSTEM "tmx14.dtd"> <tmx version="1.4"> <header creationtoolversion="1.0.0" datatype="winres" segtype="sentence" adminlang="en-us" srclang="fr-fr" o-tmf="abc" creationtool="XYZTool" > </header>
<tu tuid='autorespondersubject'> <tuv xml:lang="en"><seg><![CDATA[Your email has been sent to our team]]></seg></tuv> <tuv xml:lang="es"><seg><![CDATA[Tu email ha sido enviado a nuestro equipo]]></seg></tuv> <tuv xml:lang="fr"><seg><![CDATA[Votre e-mail a été envoyé à notre équipe]]></seg></tuv> <tuv xml:lang="de"><seg><![CDATA[Ihre Mail wurde an unser Team geschickt worden]]></seg></tuv> </tu> <tu tuid='autorespondermessage'> <tuv xml:lang="en"><seg><![CDATA[Your email has been sent to our team.<br />Thanks.]]></seg></tuv> <tuv xml:lang="es"><seg><![CDATA[Tu email ha sido enviado a nuestro equipo. <br /> Gracias]]></seg></tuv> <tuv xml:lang="fr"><seg><![CDATA[Votre e-mail a été envoyé à notre équipe. <br /> Merci]]></seg></tuv> <tuv xml:lang="de"><seg><![CDATA[Ihre Mail wurde an unser Team geschickt worden. <br /> Dank]]></seg></tuv> </tu> <tu tuid='sent'> <tuv xml:lang="en"><seg><![CDATA[your email has been sent]]></seg></tuv> <tuv xml:lang="es"><seg><![CDATA[su mensaje ha sido enviado]]></seg></tuv> <tuv xml:lang="fr"><seg><![CDATA[votre email a bien été envoyé]]></seg></tuv> <tuv xml:lang="de"><seg><![CDATA[Ihre E-Mail wurde abgeschickt]]></seg></tuv> </tu> <tu tuid='notsent'> <tuv xml:lang="en"><seg><![CDATA[your email has not been sent]]></seg></tuv> <tuv xml:lang="es"><seg><![CDATA[su dirección de correo electrónico no se ha enviado]]></seg></tuv> <tuv xml:lang="fr"><seg><![CDATA[votre email n'a pas été envoyé]]></seg></tuv> <tuv xml:lang="de"><seg><![CDATA[Ihre E-Mail wurde nicht gesendet]]></seg></tuv> </tu>
for Javascript: /* * Translated default messages for the jQuery w2ContactForm plugin. * Locale: FR */ jQuery.extend(jQuery.fn.w2ContactForm.notifications, { addAtt: 'Pièces jointes', maxAtt: 'Le nombre maximum de pièce est de ', inputFile: 'Parcourir', nspmc4: 'Choisissez la bonne forme<br />et déposez le carré gauche dans le carré droit<br />pour confirmer que vous n\'êtes pas un spammer', nspmc3: 'Choisissez le bon numéro<br />et déposez le carré gauche dans le carré droit<br />pour confirmer que vous n\'êtes pas un spammer', nspmc2: 'Choisissez la bonne couleur<br />et déposez le carré gauche dans le carré droit<br />pour confirmer que vous n\'êtes pas un spammer', nspmc1: 'Déposez le carré gauche dans le carré droit<br />pour confirmer que vous n\'êtes pas un spammer' });
Technical Support For a quick response send me a private message via my profile.web agency
enjoy !