how to submit values and send an email

[don11]

i was trying to submit values name, mobile, email, msg and send an email to me but i am not able to submit those values from below java code, how to do that. Plz help.

<script type="text/javascript">
            $(document).ready(function(){
                var feed_width = $('#feedback').width();
                var scr_w = screen.width; // Screen Width
                // 26 is width of the veritcal feedback button
                var btn_width = 26;
                var move_right = scr_w -  btn_width;
                var move_left = -(feed_width - btn_width);
                var slide_from_left = 0;
                var slide_from_right = scr_w - (feed_width - btn_width);
                var center = ( scr_w / 2 ) - ( feed_width / 2 );

                // Positioning the feedback form at the time of page loading
                positioningForm();

                // Handling the right_btn and lift_btn event animations
                $('.right_btn').click(function(){
                    slideFromRight();
                });
                $('.left_btn').click(function(){
                    slideFromleft();
                });
                // Moving left or right by clicking close button
                $('.feed_close').click(function(){
                    var pos = $('#feedback').position();
                    var ls = pos.left;
                    if(ls ==  slide_from_left){
                        // feedback form is at LEFT
                        moveRight();
                    }else if(ls == center){
                        // feedback form is at RIGHT
                        moveRight();
                    }else{
                        // feedback form is at CENTER
                        moveLeft();
                    }
                });

                $('#submit_btn').click(function(){
                    
				var name=$('#name').val();
				var mobile=$('#mobile').val();
				var email=$('#email').val();
				var msg=$('#msg').val();

				if(name.length>0 && mobile.length>0 && email.length>0 && msg.length>0)
				{

                    $('.left_btn').hide();
                    $('.right_btn').hide();
				 $('.box').hide();
				$('#feedback').animate({left: center+"px"},{duration: 'slow',easing: 'easeOutElastic'});
				$('.thankyou').show();

				}
				else
				{
				$('#error').html('All fields are required!');
				}
				return false();

                });
                function positioningForm(){
                    $('.left_btn').hide();
                    $('#feedback').css({"left": move_right+"px"}).show();
                }
                function slideFromRight(){
                    $('#feedback').animate({left: slide_from_right+"px"},{duration: 'slow',easing: 'easeOutElastic'});
                    $('.left_btn').hide();
                }
                function slideFromleft(){
                    $('#feedback').animate({left: slide_from_left+"px"},{duration: 'slow',easing: 'easeOutElastic'});
                    $('.right_btn').hide();
                }
                function moveLeft(){
                    $('#feedback').animate({left: move_left+"px"},{duration: 'slow',easing: 'easeOutElastic'});
                    $('.left_btn').show();
                }

                function moveRight(){
                    $('#feedback').animate({left: move_right+"px"},{duration: 'slow',easing: 'easeOutElastic'});
                    $('.right_btn').show();
                }


            });
        </script>

[.josh]

1) That's javascript, not java.  Two totally different things, despite similar names

 

2) javascript cannot send emails.  You have to submit the information (like when user clicks on form submit button) and do it server-side with for instance php's mail() function.

[don11]

I was trying to submit with php and it was working but i was not able to show "Thank you" message from above javascript. How to do that?

[DJ Rob Dank]

I recently had a similar problem not to long ago, although like said before, email's cannot be sent VIA JS...

 

That's a PHP Job!

 

Below is code that I stumbled across and tweaked to get working to my needs, the VALUEs are pretty self explanatory, and it's set up to work right off the bat.

 

<?php
$to = "[email protected]";
$email = $_REQUEST['email'] ;
$name = $_REQUEST['name'] ;
$phone = $_REQUEST['phonedaytime'] ;
$phone = $_REQUEST['phoneevening'] ;
$address = $_REQUEST['address'] ;
$subject = "New email from your web form!";
$message = $_REQUEST['message'] ;
$city = $_REQUEST['city'] ;
$state = $_REQUEST['state'] ;
$zip = $_REQUEST['zip'] ;
$headers = "From: $email";
$body = "From: $name \n\n Email: $email \n\n Address: $address \n\n $city, $state $zip \n\n Phone Number (Daytime): $phonedaytime \n\n Phone Number (Evening): $phoneevening \n\n Comments: \n\n $message";
$sent = mail($to, $subject, $body, $headers) ;
if($sent)
{echo "Thank you for your email! Please allow up to 48 hours for a response.";}
else
{echo "An error has occured. Please contact the webmaster: [email protected]";}
?>

 

You can add and remove lines as needed,

 

the code for the email form is

<form method="post" name="Emailform" action="sendmail.php" target="_blank"> 

<table border="0" cellspacing="0" cellpadding="4" width="90%" id="ContactMe"> 
<tr> 
    <td width="35%"><div align="right">Name (First and Last):</div></td> 
    <td width="65%"><input type="text" name="name" size="50" /></td> 
</tr> 

<tr> 
    <td><div align="right">Address:</div></td> 
    <td><input type="text" name="address" size="50" /></td> 
</tr>   

<tr> 
    <td><div align="right">City:</div></td> 
    <td><input type="text" name="city" size="50" /></td> 
</tr>
    
<tr>    
<td><div align="right">State:</div></td> 
    <td><select name="state">
<option value="AL">AL</option>
<option value="AK">AK</option>
<option value="AZ">AZ</option>
<option value="AR">AR</option>
<option value="CA">CA</option>
<option value="CO">CO</option>
<option value="CT">CT</option>
<option value="DE">DE</option>
<option value="DC">DC</option>
<option value="FL">FL</option>
<option value="GA">GA</option>
<option value="HI">HI</option>
<option value="ID">ID</option>
<option value="IL">IL</option>
<option value="IN">IN</option>
<option value="IA">IA</option>
<option value="KS">KS</option>
<option value="KY">KY</option>
<option value="LA">LA</option>
<option value="ME">ME</option>
<option value="MD">MD</option>
<option value="MA">MA</option>
<option value="MI">MI</option>
<option value="MN">MN</option>
<option value="MS">MS</option>
<option value="MO">MO</option>
<option value="MT">MT</option>
<option value="NE">NE</option>
<option value="NV">NV</option>
<option value="NH">NH</option>
<option value="NJ">NJ</option>
<option value="NM">NM</option>
<option value="NY">NY</option>
<option value="NC">NC</option>
<option value="ND">ND</option>
<option value="OH">OH</option>
<option value="OK">OK</option>
<option value="OR">OR</option>
<option value="PA">PA</option>
<option value="RI">RI</option>
<option value="SC">SC</option>
<option value="SD">SD</option>
<option value="TN">TN</option>
<option value="TX">TX</option>
<option value="UT">UT</option>
<option value="VT">VT</option>
<option value="VA">VA</option>
<option value="WA">WA</option>
<option value="WV">WV</option>
<option value="WI">WI</option>
<option value="WY">WY</option>
</select></td> 
</tr> 

<tr>    
    <td><div align="right">Zip Code:</div></td> 
    <td><input type="text" name="zip" size="7" maxlength="5" onkeypress="return numbersonly(this, event);"/></td> 
</tr>

<tr> 
    <td><div align="right">Phone Number (Daytime):</div></td> 
    <td><input type="text" name="phonedaytime" size="50" onkeypress="return numbersonly(this, event);"></td> 
</tr>  

<tr> 
    <td><div align="right">Phone Number (Evening):</div></td> 
    <td><input type="text" name="phoneevening" size="50" onkeypress="return numbersonly(this, event);"></td> 
</tr>  


<tr> 
    <td><div align="right">Email:</div></td> 
    <td><input type="text" name="email" size="50" /></td> 
</tr> 

<tr> 
    <td><div align="right">Comments:</div></td> 
    <td><textarea name="message" cols="60" rows="5"></textarea></td> 
</tr> 

<tr> 
<td> </td> 
    <td> 
    <input type="submit" name="submit" value="Submit" /> 
    <input type="reset" name="reset" value="Reset" /> 
    </td> 
</tr> 

</table> 
</form>

 

Hope this helps!

[don11]

Thank you for the reply, problem solved.