javascript - getting enter to page or reload email comes without clicks the submit button -


when clicks contact form page email getting without clicks submit button , comes while refresh page.i wanna in same page while clicks submit button

my html code

<form action="" method="post" id="commentform">     <fieldset>         <p class="field"><input type="text" name="author" required value="" placeholder="name:"/><span class="required"></span></p>         <p class="field"><input type="text" name="email" required value="" placeholder="email:"/><span class="required"></span></p>         <p class="field"><input type="text" name="url" required value="" placeholder="website:"/><span class="required"></span></p>         <p><textarea name="comment"required value="" placeholder="your comment:"/>your comment*</textarea><span class="required"></span></p>         <p class="comment_submit">             <input name="send" type="submit" class="btn btn-primary" id="submit" tabindex="5" value="submit comment"/>             <input type='hidden' name='comment_post_id' value='65' id='comment_post_id'/>             <input type='hidden' name='comment_parent' id='comment_parent' value='0'/>         </p>     </fieldset> </form> 

php code

if(isset($_post['submit'])) {     $author = $_post["author"];      $email= $_post["email"];     $url= $_post["url"];     $comment =$_post["comment"];      $message = "name :".$author."\n"."email :".$email."\n"."website :".$url."\n"."comment :".$comment;     $subject ="visitor enquiry";     $to = "name@gmail.com";      if(mail($to, $subject,$message)) {         echo "we received enquiry, we'll soon";     }      else {         echo "there errors sending enquiry, please try again";     } } 

it sounds want form submit via ajax. in short, means using javascript send form data server handled php script, instead of having browser handle it.

if you're using jquery, use an ajax form plugin "upgrade" form use ajax. use jquery's .serialize() (docs) function convert form element object can send server using jquery's $.ajax function (docs). there shorthand function $.post doing post requests well.

the latter might this:

var $form = $('#commentform'); $form.on('submit', function (e) {     e.preventdefault(); // stops browser submitting form      var data = $form.serialize(), // convert form json object         posturl = $form.attr('action') // url of form's target;      // submit form via ajax     $.post(posturl, data, function (data) {         // show response server @ top of form         $form.prepend('<p class="message">' + data + '</p>');     }); }); 

you may need add current page url action attribute on form.

your php script need know ajax has been used can output response message (used in success callback ajax request). x-http-reuested-with header can that:

<?php     if(isset($_post['submit']))     {         $author = $_post["author"];         $email= $_post["email"];         $url= $_post["url"];         $comment =$_post["comment"];          $message = "name :".$author."\n"."email :".$email."\n"."website :".$url."\n"."comment :".$comment;         $subject ="visitor enquiry";          $to = "name@gmail.com";         if(mail($to, $subject,$message))         {             echo "we received enquiry, we'll soon";         }         else         {              echo "there errors sending enquiry, please try again";         }          $via_ajax = !empty($_server['http_x_requested_with']) && strtolower($_server['http_x_requested_with']) === 'xmlhttprequest';         // if requested via ajax, end request send 1 of above messages, not entire html page.          if ($via_ajax)         {             die;         }     }  ?> 

(you'll notice corrected of open/close php tags. php code must inside <?php ?> tags.

suggestions further improvement

this bare bones of operation. create user experience, you'll want show sort of "loading" state after form submitted, while request going server , being processed user knows happening (normally browser take care of reloading page , showing spinner, etc).

you'll want validate input data in way - you're not doing @ all. recommend basic validation such requiring value in email field. should in php, , in addition in javascript can validate user input before form sent server.

you might want set class on outputted message depending on whether request succeeded or failed, e.g. have message in green if successful, or red if failed.

if you're having trouble implementing these improvements, jquery documentation place start, or alternatively find or post question here on so.


Comments

Popular posts from this blog

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

linux - disk space limitation when creating war file -