2017-02-24 78 views
0

我对JQuery非常陌生。伙计们可以告诉我我的代码有什么问题,我想通过ajax发送电子邮件,然后在div中填充返回的字符串。我试图从我的视图发送数据到我的控制器使用数据,然后发回一个字符串添加到Dom中。我怎样才能做到这一点。感谢您的时间和努力。干杯。Ajax调用发送电子邮件不起作用。

我查看

<!-- Contact form --> 
       <form id="contact-form" name="contact-form" method="POST" data-name="Contact Form"> 

        <div class="row"> 

         <!-- Full name --> 
         <div class="col-xs-12 col-sm-6 col-lg-6"> 
          <div class="form-group"> 
           <input type="text" id="name" class="form form-control" placeholder="Write your name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Write your name'" name="name" data-name="Name" required> 
          </div> 
         </div> 

         <!-- E-mail --> 
         <div class="col-xs-12 col-sm-6 col-lg-6"> 
          <div class="form-group"> 
           <input type="email" id="email" class="form form-control" placeholder="Write your email address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Write your email address'" name="email" data-name="Email Address" required> 
          </div> 
         </div> 

         <!-- Subject --> 
         <div class="col-xs-12 col-sm-12 col-lg-12"> 
          <div class="form-group"> 
           <input type="text" id="subject" class="form form-control" placeholder="Write the subject" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Write the subject'" name="subject" data-name="Subject"> 
          </div> 
         </div> 

         <!-- Message --> 
         <div class="col-xs-12 col-sm-12 col-lg-12 no-padding"> 
          <div class="form-group"> 
           <textarea id="text-area" class="form textarea form-control" placeholder="Your message here... 20 characters Min." onfocus="this.placeholder = ''" onblur="this.placeholder = 'Your message here... 20 characters Min.'" name="message" data-name="Text Area" required></textarea> 
          </div> 
         </div> 

        </div> 

        <!-- Button submit --> 
        <button type="submit" id="valid-form" class="btn btn-color">Send my Message</button> 

       </form> 
       <!-- /. Contact form --> 

       <div id="block-answer"> 
        <div id="answer"></div> 
       </div> 

脚本在体温

$('#valid-form').click(function() { 
     var name = $('#name').val(); 
     var email = $('#email').val(); 
     var subject = $('#subject').val(); 
     var message = $('#message').val(); 
     $.ajax({ 
      url: '/Home/SendMessage', 
      data: { 'name': name, 'email': email, 'subject': subject, 'message': message }, 
      type: "post", 
      cache: false, 
      success: function (status) { 
       $('#answer').text(savingStatus); 
      }, 
      error: function (xhr, ajaxOptions, thrownError) { 
       $('#answer').text("Error encountered while saving the message."); 
      } 
     }); 
    }); 

我的控制器结束

[HttpPost] 
    public string SendMessage(string name, string email, string subject, string message) 
    { 
     var savingStatus = "Success"; 
     return savingStatus; 
    } 
+1

我确实在您的成功功能中看到一个错字。它应该说'''$('#answer')。text(status);''' – clarmond

+0

只需要执行'data:$(this).serialize(),'。你不需要单独获取每个输入的值,然后创建一个JS对象。 –

+0

即使这是真的先生。我将如何击中控制器。 –

回答

0

你一个重新使用字符串作为字段名称,请用此替换数据。

data: { name: name, email: email, subject: subject, message: message }, 
+0

Nah dude not working1 –

+0

我已经添加了一个即使它没有击中控制器 –

+0

请使用控制器名称前的网址url –