Сейчас делаю свою страничку на сайте, где хочу сделать фрмочку обратной связи на электронную почту. Помогите пожалуйста с реализацией, потому что я совсем не знаю что делать...
Вначале создаём модель фидбека на стороне сервера:
public class FeedbackViewModel {
[Required]
[StringLength(100)]
[Display(Name = "Тема сообщения")]
public string Subject { get; set; }
[Required]
[StringLength(50)]
[Display(Name = "Как к Вам обращаться")]
public string UserName { get; set; }
[Required]
[RegularExpression(@"^\w ([- .']\w )*@\w ([-.]\w )*\.\w ([-.]\w )*$", ErrorMessage = "Неверный формат электронной почты")]
[StringLength(50)]
[Display(Name = "Email для обратной связи")]
public string EmailAdrress { get; set; }
[Required]
[StringLength(500)]
[DataType(DataType.MultilineText)]
[Display(Name = "Текст сообщения")]
public string Message { get; set; }
}
Затем напишем контроллер
public class AjaxController : Controller {
[HttpPost]
public JsonResult SendFeedback(FeedbackViewModel model) {
if (ModelState.IsValid) {
// отправляем сообщение...
return Json(new { result = "Message sent" });
}
else {
return Json(new { error = "Error" });
}
}
}
Всё. Серверная часть на этом закончена. Теперь нужно сделать представление для формы. Напишем-ка пару скриптов:
(function (site) {
"use strict";
site.services.utilits = {
sendFeedback: function (feedback, callback) {
if (callback === undefined) {throw new Error(200, "callback is undefined");}
site.fw.ajaxService.postJson("SendFeedback", feedback, callback);
}
};
})(site);
$(function () {
site.vm.Feedback = function () {
var item = this;
item.subject = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable()
.extend({ required: true, maxLength: 100 });
item.message = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable()
.extend({ required: true, maxLength: 500 });
item.emailadrress = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable()
.extend({ required: true, maxLength: 50, email: true });
item.username = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable()
.extend({ required: true, maxLength: 50 });
return item;
};
site.vm.feedbackViewModel = function () {
var message = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable("заполните форму"),
feedback = new site.vm.Feedback(),
isbusy = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable(false),
issended = k<img src="/content/images/emoticons/confused-emoticon-wtf-symbol-for-facebook.png" alt="" class="emoticon" />bservable(false),
errors = ko.validatedObservable(feedback),
send = function () {
isbusy(true);
var jsonData = ko.toJSON(feedback);
site.services.utilits.sendFeedback(jsonData, callback);
},
callback = function (json) {
if (!json.error) {
alert(json.result);
message(json.result);
issended(true);
} else {
alert(json.error);
message(json.error);
}
isbusy(false);
};
return {
issended:issended,
isbusy:isbusy,
errors: errors,
send: send,
feedback: feedback,
message: message
};
}();
ko.applyBindings(site.vm.feedbackViewModel);
});
Ну а теперь сама форма: