funbinod Posted March 11, 2015 Share Posted March 11, 2015 i'm trying to make a mail form using ajax. but getting some problem. please guide following is what I tried... html <form id='sendmail' method='POST' action='sendmail.php'> <input id='emaill' name='emaill' type=text value='<?php echo $aemail; ?>' /><br /><br /> <textarea cols='20' rows='10' id='msg' name='msg'></textarea><br /><br /> <input type=submit id='send' value=SEND /></form> jquery $('#send').live('click', function() { $("#sendmail").validate(); if ($("#sendmail").valid()) { $.ajax({ type: "POST", url: "sendmail.php", cache: false, contentType: "application/json; charset=utf-8", data: "{ 'body': '" + $("#msg").val() + "'," + "'from': '" + $("#emaill").val() + "'," + "'subject: 'email from Mimosa Cashier Management'" + "}", dataType: "json", complete: function(transport) { if (transport.status == 200) { alert('Mail Sent Successfully!'); $("#pop").hide("slide", {easing:"easeOutElastic"},1000); } else { alert("Please try again later!"); } } }); } return false; }); sendmal.php $to = $_POST['emaill'];$from = 'Mimosa Cashier Management';$msg = $_POST['msg'];mail($to,$from,$msg); it works if I don't use ajax. and when I use ajax it gives success message also (the success function executes). but the mail is not sent.. please guide where in the code I did mistake??? thanks in advance.... Link to comment Share on other sites More sharing options...
justsomeguy Posted March 11, 2015 Share Posted March 11, 2015 The data line you are sending is a string. Replace that with an actual object with the "emaill" and "msg" properties set. Link to comment Share on other sites More sharing options...
funbinod Posted March 12, 2015 Author Share Posted March 12, 2015 thank u for the reply. but sorry, I don't know what that really means. does it mean data: $("#msg").val(), data: $("#emaill").val(), ????????? Link to comment Share on other sites More sharing options...
justsomeguy Posted March 12, 2015 Share Posted March 12, 2015 The data property should be an object, where you set property names and values. You gave it a big string that looks like an object. It needs to be an actual object, not a string. { msg: 'msg value', emaill: 'emaill value'} Link to comment Share on other sites More sharing options...
funbinod Posted March 12, 2015 Author Share Posted March 12, 2015 thank u now the script became $.ajax({ type: "POST", url: "sendmail.php", cache: false, contentType: "application/json; charset=utf-8", data: { msg: $('#msg').val(), subj: $('#sub').val(), emaill: $('#emaill').val() } dataType: "json", complete: function(transport) { if (transport.status == 200) { alert('Mail Sent Successfully!'); } else { alert("Please try again later!"); } } }); is everything correct!!???? but even its not working... Link to comment Share on other sites More sharing options...
thescientist Posted March 12, 2015 Share Posted March 12, 2015 what errors are you getting? you looking for error checking for errors, right? I see a syntax error, in that there is no comma after you the closing curly brace for your data object Link to comment Share on other sites More sharing options...
funbinod Posted March 12, 2015 Author Share Posted March 12, 2015 oh right! I forgot the comma. but its still not working. I don't know what happened. but its not showing alert that were intended after success or error.... Link to comment Share on other sites More sharing options...
justsomeguy Posted March 12, 2015 Share Posted March 12, 2015 Are there any other Javascript errors? You can also use your developer tools to look at the network tab to see the ajax request go out and make sure that it's working, you can use that also to look at the response from PHP. Link to comment Share on other sites More sharing options...
funbinod Posted March 13, 2015 Author Share Posted March 13, 2015 You can also use your developer tools to look at the network tab to see the ajax request go out and make sure that it's working, you can use that also to look at the response from PHP. the status is ok at developer tool. it says "Status - 200 OK" there I found one mistake (additional extra closing curly brace). I fixed it. but still no response. one additional point-- I am trying to send mail from a appended div after clicking the email address... following is the complete code... $('#send').click(function(e) { $("#sendmail").validate(); if ($("#sendmail").valid()) { $.ajax({ type: "POST", url: "sendmail.php", cache: false, contentType: "application/json; charset=utf-8", data: { msg: $('#msg').val(), subj: $('#sub').val(), emaill: $('#emaill').val() }, dataType: "json", complete: function(transport) { if (transport.status == 200) { alert('Mail Sent Successfully!'); } else { alert("Please try again later!"); } } }); } }); this is the appended div that contains the mail form..... <div id='pop'><div id='popin'><br /><form id='sendmail' name='sendmail' method='POST' action=''><input id='emaill' name='emaill' type=text value='<?php echo $aemail; ?>' /><br /><br /><textarea cols='20' rows='2' id='sub' name='sub'></textarea><br /><br /><textarea cols='20' rows='10' id='msg' name='msg'></textarea><br /><br /><input type='submit' id='send' name='send' value=SEND /> <input type='button' id='close' value='CLOSE' /></form></div></div> Link to comment Share on other sites More sharing options...
thescientist Posted March 13, 2015 Share Posted March 13, 2015 Have you confirmed that the sendmail.php script works on its own? How are you debugging that end of it? Are you saying you're not seeing an alert no matter what the response? Or you see a response but no email? If it's the email script, that's a PHP related issue and you would need to debug your sendmail script in isolation first. Link to comment Share on other sites More sharing options...
justsomeguy Posted March 13, 2015 Share Posted March 13, 2015 It looks like clicking that submit button is going to submit the form and refresh the page, you're not stopping the submit. Link to comment Share on other sites More sharing options...
funbinod Posted March 13, 2015 Author Share Posted March 13, 2015 Have you confirmed that the sendmail.php script works on its own? yes it does! to test it I've added some line after execution of php mail() if (mail($to, $subject, $body, $from)) { $_SESSION['msg'] = 'mail sent successfully to "'.$to.'"';} else { $_SESSION['msg'] = 'mail sent failed to "'.$to.'"';}die(header('location: notes.php'));////// this part is only to test if the script is working or not. for ajax script to execute I only use "mail($to, $subject, $body, $from)" /////// Are you saying you're not seeing an alert no matter what the response? Or you see a response but no email? yes! there is no any alert on any response status. neither any email... if (transport.status == 200) { alert("Mail Sent Successfully!"); } else { alert("Please try again later!"); }////////////// no response / no email //////////////// the php script (sendmail.php) is working very nicely, I think. if I remove the ajax part and use action='sendmail.php' in mail form, it sends mail and returns the session var. Link to comment Share on other sites More sharing options...
funbinod Posted March 13, 2015 Author Share Posted March 13, 2015 It looks like clicking that submit button is going to submit the form and refresh the page, you're not stopping the submit. yes! you caught the point. it is reloading the page in stead sending ajax request (page load animated icon on the address starts running after I click send button). I tried to stop the form submit using "e.preventDefault()", "e.preventDefault()", "return false" but its not stopping the submission. is this method wrong? any other idea??? Link to comment Share on other sites More sharing options...
justsomeguy Posted March 13, 2015 Share Posted March 13, 2015 I would use the form's submit event instead of the button's click event, and then you can prevent the default action of the submit event. Link to comment Share on other sites More sharing options...
funbinod Posted March 13, 2015 Author Share Posted March 13, 2015 not working :( :'( $('#sendmail').submit(function(e) { event.preventDefault(); $("#sendmail").validate(); if ($("#sendmail").valid()) { $.ajax({ type: "POST", url: "sendmail.php", cache: false, contentType: "application/json; charset=utf-8", data: { msg: $('#msg').val(), subj: $('#sub').val(), emaill: $('#emaill').val() }, dataType: "json", complete: function(transport) { if (transport.status == 200) { alert('Mail Sent Successfully!'); } else { alert("Please try again later!"); } } }); } }); Link to comment Share on other sites More sharing options...
thescientist Posted March 13, 2015 Share Posted March 13, 2015 Did you even check for errors? You pass in e, but used event. That should be a runtime error. What's in your browser console? Link to comment Share on other sites More sharing options...
funbinod Posted March 13, 2015 Author Share Posted March 13, 2015 event also not working attached are the screenshots of developer tool (console and network) Link to comment Share on other sites More sharing options...
thescientist Posted March 13, 2015 Share Posted March 13, 2015 event also not working I'm not sure what that means. what change did you make, to the event variable name, or to e the variable name? attached are the screenshots of developer tool (console and network) Is that after you've clicked the submit button? It doesn't seem like you are really trying to figure this out. Use the tools you have. Add more alert statements, or better yet use console.log. This is part of being a programmer, you have to really drill down into your code and track how it's running. Everything you could need is in those developer tools, especially in the console. Get comfy learning how to use it. Link to comment Share on other sites More sharing options...
funbinod Posted March 15, 2015 Author Share Posted March 15, 2015 to the event variable name, or to e the variable name? $('#sendmail').submit(function(e) { e.preventDefault(); Is that after you've clicked the submit button? yes! they are after I clicked the submit button.. Link to comment Share on other sites More sharing options...
funbinod Posted March 17, 2015 Author Share Posted March 17, 2015 hey guys! I diagnosed that the all problem is about jquery support for ".click()" and ".on()" event handlers. I am using jquery-2.1.0. but its not supporting these events. then I migrated it to 1.2.1 and used ".live()" event and everything worked. please suggest me which event is used for this on jquery-2.1.0??? Link to comment Share on other sites More sharing options...
thescientist Posted March 17, 2015 Share Posted March 17, 2015 "on" is the correct way to do it and is supported http://learn.jquery.com/events/handling-events/ Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now