2014-09-19 1 views
3

Немного новое для JQuery и Ajax, но у меня есть простая почтовая форма, которую я пытаюсь опубликовать с помощью JQUERY, чтобы сохранить перезагрузку страницы.Сообщение Ajax на странице coldfusion с электронной почтой не срабатывает

Вот пример страницы: DetailInfo.cfm.

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 

<script> 

$(document).ready(function() { $("#frmSubmit").submit(sendForm) });  

function SubmitForm() 
{ 
Tbody = document.getElementById("txtBody"); 

if(Tbody.value == '') 
    alert('Please enter some text for your message.'); 
else 
{    
    $("#frmSubmit").submit(sendForm); 
       //frmSubmit.submit();    
} 
}   

function sendForm() 
{    
    $.post('DetailInfo.cfm',$("#frmSubmit").serialize(),function(data,status){  
     $("#result").html(data) 
    }); 
    alert('Email Sent'); 
    return false 
}  
</script> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Email Test</title> 
</head> 

<body> 

<cfif isdefined("form.txtBody")> 
    <CFMAIL [email protected] 
    [email protected] 
    SUBJECT= "Thank you for submitting the information">Message below sent from user #Session.UserID# , the info to be updated is the following: 

    #form.txtBody# 

    </CFMAIL> 

<cfelse> 

    <form method="post" name="frmSubmit" id="frmSubmit" action="DetailInfo.cfm"> 
          <table id="tblError" name="tblError" >   
          <tr><td colspan="2" class="ui-widget-content" align="center">Suggested Detail to Submit</td></tr> 
          <tr><td colspan="2" class="ui-widget-content">System does not recognize detail. Please provide a suggested name. Click Send when done.</td></tr> 
          <tr><td colspan="2" class="ui-widget-content" valign="top">Comments: </td></tr> 
          <tr><td class="ui-widget-content" ><textarea cols="75" rows="5" id="txtBody" name="txtBody" class="ui-widget-content"></textarea></td><td class="ui-widget-content" ><input type="button" id="btnSubmit" value="Send" class="ui-widget-content" align="middle" onclick="SubmitForm();" /></td></tr> 
        <tr><td class="ui-widget-content" colspan="2" align="center"><div id="dvMessage"></div></td></tr> 
        </table></form> 
    </cfif>      
</body> 
</html> 

Я использую этот метод причину этой страницы собирается открыть в идеале в модальном окне, которое я не хочу родительской страницы исчезая, когда я отправляю. Также просто для тестирования я жестко запрограммировал электронную почту по адресам и обратно.

Проблема заключается в том, когда я называю нормальным представить через закомментированного линии:

frmSubmit.submit(); 

Должности форму электронной почты, и я получаю его. Однако я пытаюсь использовать вышеописанный метод, и когда я нажимаю «Отправить», ничего не происходит визуально (это нормально), но письмо не отправляется.

я не могу показаться, чтобы получить это стрелять через код

$("#frmSubmit").submit(sendForm); 

Еще одно предложение мне сказали, было использовать PreventDefault, но я попробовал, что в нескольких местах в коде и что Ждут» т работы.

Любая идея относительно того, почему письмо не выходит? Большая помощь была оценена. Это настоящая простая страница, которая должна работать, насколько мне известно, но мой опыт JQuery и AJAX немного ограничен, почему это не работает.

Благодаря

+0

Вы, сделав запись AJAX в тот же файл .cfm? –

+0

Кажется странным, зачем использовать ajax, если логика находится в том же файле. Я бы поставил логику электронной почты в cfc, если вы хотите называть ее ajax – Lance

+0

Скотт, э-э ... Я так думаю? Это сообщение на той же странице, что и вы. Лэнс Я использую этот метод, потому что страница должна открываться в модальном окне, а сообщение, если это было сделано другим способом, приведет к исчезновению родительской формы. Я хочу, чтобы страница оставалась загруженной, пока она публикуется. Если есть лучший способ сделать это, не стесняйтесь, дайте мне знать. благодаря! – EXL

ответ

0

Создание 2-х страниц, form.cfm для формы и action.cfm действий (отправить по электронной почте при вызове AJAX на странице формы).

Вот код для form.cfm

<html> 

<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 

    <script> 

     function SubmitForm(){ 

      $.ajax({ 
       type: "POST", 
       url: "action.cfm", 
       data: $("#frmSubmit").serialize(), 
       dataType: "text", 
       success: function(data, status) { 
        alert(data); 
        console.log(status); 
       } 
      }); 

     }; 

    </script> 

    <title>Email Test</title> 

</head> 

<body> 

    <form method="post" name="frmSubmit" id="frmSubmit" action="DetailInfo.cfm"> 
     <table id="tblError" name="tblError" >   
      <tr><td colspan="2" class="ui-widget-content" align="center">Suggested Detail to Submit</td></tr> 
      <tr><td colspan="2" class="ui-widget-content">System does not recognize detail. Please provide a suggested name. Click Send when done.</td></tr> 
      <tr><td colspan="2" class="ui-widget-content" valign="top">Comments: </td></tr> 
      <tr><td class="ui-widget-content" ><textarea cols="75" rows="5" id="txtBody" name="txtBody" class="ui-widget-content"></textarea></td><td class="ui-widget-content" ><input type="button" id="btnSubmit" value="Send" class="ui-widget-content" align="middle" onclick="SubmitForm();" /></td></tr> 
      <tr><td class="ui-widget-content" colspan="2" align="center"><div id="dvMessage"></div></td></tr> 
     </table> 

    </form>      

</body> 

</html> 

и вот код для action.cfm

<cfsilent> 
    <cfmail to="[email protected]" from="[email protected]" subject="Thank you for submitting the information"> 

     #form.txtBody# 

    </cfmail> 
    <cfset data = "email sent OK" /> 
</cfsilent><cfoutput>#data#</cfoutput> 
Смежные вопросы