Upload a file in contact form |
Upload a file in contact form |
Art On Web |
Jul 30 2015, 09:15 AM
Post
#1
|
Group: Members Posts: 9 Joined: 22-February 15 From: Hellas Member No.: 22,231 |
Hello.
I already have a contact form which works perfect. I need to add the ability to upload a file and then send it with the rest information by email. Can you help me with the additional code? This post has been edited by Art On Web: Jul 30 2015, 09:16 AM |
CharlesEF |
Jul 30 2015, 09:52 AM
Post
#2
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
What code have you tried? Are you getting an error message of some kind? Post your code, if you want help with it.
|
pandy |
Jul 30 2015, 10:06 AM
Post
#3
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
I think the OP has a normal form mail script that works and wants help to modify that script so it also handles file upload. Maybe the best is to find a script that already has that functionality.
|
Art On Web |
Jul 30 2015, 10:15 AM
Post
#4
|
Group: Members Posts: 9 Joined: 22-February 15 From: Hellas Member No.: 22,231 |
Yes pandy, I need the additional code in order to upload a file through the contact form.
Now, I received only text messages in my mailbox. I would like to receive both message and attachment files from contact form. |
CharlesEF |
Jul 30 2015, 10:55 AM
Post
#5
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
I think the OP has a normal form mail script that works and wants help to modify that script so it also handles file upload. Maybe the best is to find a script that already has that functionality. Yes, I understood that. This was my way of saying I don't know how the OP's current script and form are setup so I can't just give some code. The OP should put in the effort and show is own attempt before asking for help. |
pandy |
Jul 30 2015, 02:15 PM
Post
#6
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Sorry. You asked about error messages.
|
CharlesEF |
Jul 30 2015, 02:42 PM
Post
#7
|
Programming Fanatic Group: Members Posts: 1,981 Joined: 27-April 13 From: Edinburg, Texas Member No.: 19,088 |
|
Art On Web |
Jul 30 2015, 03:04 PM
Post
#8
|
Group: Members Posts: 9 Joined: 22-February 15 From: Hellas Member No.: 22,231 |
html
CODE <form name="sentMessage" id="contactForm" novalidate> <div class="row"> <div class="col-md-6"> <div class="form-group"> <input type="text" class="form-control" placeholder="Your Name *" id="name" required data-validation-required-message="Please enter your name."> <p class="help-block text-danger"></p> </div> <div class="form-group"> <input type="email" class="form-control" placeholder="Your Email *" id="email" required data-validation-required-message="Please enter your email address."> <p class="help-block text-danger"></p> </div> <div class="form-group"> <input type="tel" class="form-control" placeholder="Your Phone *" id="phone" required data-validation-required-message="Please enter your phone number."> <p class="help-block text-danger"></p> </div> </div> <div class="col-md-6"> <div class="form-group"> <textarea class="form-control" placeholder="Your Message *" id="message" required data-validation-required-message="Please enter a message."></textarea> <p class="help-block text-danger"></p> </div> </div> <div class="clearfix"></div> <div class="col-lg-12 text-center"> <div id="success"></div> <button type="submit" class="btn btn-xl">Send Message</button> </div> </div> </form> contact_me.js CODE $(function() { $("input,textarea").jqBootstrapValidation({ preventSubmit: true, submitError: function($form, event, errors) { // additional error messages or events }, submitSuccess: function($form, event) { event.preventDefault(); // prevent default submit behaviour // get values from FORM var name = $("input#name").val(); var email = $("input#email").val(); var phone = $("input#phone").val(); var message = $("textarea#message").val(); var firstName = name; // For Success/Failure Message // Check for white space in name for Success/Fail message if (firstName.indexOf(' ') >= 0) { firstName = name.split(' ').slice(0, -1).join(' '); } $.ajax({ url: "././mail/contact_me.php", type: "POST", data: { name: name, phone: phone, email: email, message: message }, cache: false, success: function() { // Success message $('#success').html("<div class='alert alert-success'>"); $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") .append("</button>"); $('#success > .alert-success') .append("<strong>Your message has been sent. </strong>"); $('#success > .alert-success') .append('</div>'); //clear all fields $('#contactForm').trigger("reset"); }, error: function() { // Fail message $('#success').html("<div class='alert alert-danger'>"); $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×") .append("</button>"); $('#success > .alert-danger').append("<strong>Sorry " + firstName + ", it seems that my mail server is not responding. Please try again later!"); $('#success > .alert-danger').append('</div>'); //clear all fields $('#contactForm').trigger("reset"); }, }) }, filter: function() { return $(this).is(":visible"); }, }); $("a[data-toggle=\"tab\"]").click(function(e) { e.preventDefault(); $(this).tab("show"); }); }); /*When clicking on Full hide fail/success boxes */ $('#name').focus(function() { $('#success').html(''); }); contact_me.php CODE <?php // Check for empty fields if(empty($_POST['name']) || empty($_POST['email']) || empty($_POST['phone']) || empty($_POST['message']) || !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL)) { echo "No arguments Provided!"; return false; } $name = $_POST['name']; $email_address = $_POST['email']; $phone = $_POST['phone']; $message = $_POST['message']; // Create the email and send the message $to = 'info@domain.gr'; // Add your email address inbetween the '' replacing yourname@yourdomain.com - This is where the form will send a message to. $email_subject = "Website Contact Form: $name"; $email_body = "You have received a new message from your website contact form.\n\n"."Here are the details:\n\nName: $name\n\nEmail: $email_address\n\nPhone: $phone\n\nMessage:\n$message"; $headers = "From: noreply@yourdomain.com\n"; // This is the email address the generated message will be from. We recommend using something like noreply@yourdomain.com. $headers .= "Reply-To: $email_address"; mail($to,$email_subject,$email_body,$headers); return true; ?> |
pandy |
Jul 30 2015, 03:08 PM
Post
#9
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
|
masonh928 |
Aug 2 2015, 11:17 PM
Post
#10
|
Serious Coder Group: Members Posts: 253 Joined: 17-August 13 From: Indiana Member No.: 19,570 |
Obviously though in html you add the
CODE <input type="file"> Obviously there is validation, validation of the files, sizing, etc. |
masonh928 |
Aug 2 2015, 11:19 PM
Post
#11
|
Serious Coder Group: Members Posts: 253 Joined: 17-August 13 From: Indiana Member No.: 19,570 |
I am not quite sure how to send the file via JQuery AJAX or as JSON.
I think you could try this… this may work, not tested myself though... |
Sam A |
Aug 12 2015, 02:04 AM
Post
#12
|
Novice Group: Members Posts: 26 Joined: 22-April 15 Member No.: 22,515 |
Check some form upload function which is helpful in your Website development with HTML coding.
|
Lo-Fi Version | Time is now: 25th April 2024 - 05:40 AM |