Я не могу отправить свои значения формы обратно на сервер - PullRequest
1 голос
/ 03 марта 2012

Я играю с MVC3 и пытаюсь создать простую контактную форму, которая отправляет значения обратно на сервер, используя jquery $ .ajax.

На данный момент мой вид моей контактной формы привязан к созданной мной контактной модели:

public class ContactViewModel
{
    [Required]
    public string Name { get; set; }

    [Required]
    [DataType(DataType.EmailAddress)]
    public string Email { get; set; }

    [Required]
    public string Message { get; set; }     
}

Вот мой метод [HttpPost] для обработки опубликованной формы после ее отправки:

    [HttpPost]
    public ActionResult SubmitForm(ContactViewModel contactVM)
    {
        if (!ModelState.IsValid)
        {
            return View(contactVM);
        }

        // TODO: If the form's valid then save the data

        return RedirectToAction("Thankyou");
    }

Как видите, этот метод ожидает тип данных ContactViewModel. Я был немного озадачен, так как кажется, что у меня нет этого класса в моем javascript, поэтому я решил, что мне нужно пересобрать класс в js, а затем отправить его обратно в мой метод SubmitForm? Ниже приведен код, который я использовал для достижения этой цели:

<script type="text/javascript">
    $(document).ready(function () {
        var contactVM = { ContactViewModel : [{
            Name: $('#Name').val(),
            Email: $('#Email').val(),
            Message: $('#Message').val() }]
        };

        $.ajax({
            url: '/Contact/SubmitForm',
            type: "POST",
            data: JSON.stringify(contactVM),
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function () {
                alert('Success!');
            },
            error: function () {
                alert('Failure!');
            }
        });
    });        
</script>

Как вы можете видеть, я пытался создать точно такой же класс в javascript, чтобы я мог отправить его обратно на сервер, но когда я перехожу по коду, кажется, что моя переменная contactVM принята в методе SubmitForm имеет только нулевые значения.

Куда я иду не так? Я даже на правильном пути здесь? Извиняюсь, если я не объяснил это очень ясно!

Спасибо!

ОБНОВЛЕНИЕ: Оказывается, я был идиотом и вызывал только загрузку страницы функции $ .ajax вместо нажатия кнопки! В сочетании с тем, что сказал Эндрю ниже, все, кажется, работает: -)

1 Ответ

1 голос
/ 03 марта 2012

В этом случае нет необходимости использовать «обертку» ContactViewModel в JavaScript.Вы должны просто написать:

$(document).ready(function () {
    var contactVM = {
        Name: $('#Name').val(),
        Email: $('#Email').val(),
        Message: $('#Message').val()
    };

    $.ajax({
        url: '/Contact/SubmitForm',
        type: "POST",
        data: JSON.stringify(contactVM),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function () {
            alert('Success!');
        },
        error: function () {
            alert('Failure!');
        }
    });
});     

Подшивка модели возьмет объект, который вы отправите, и сопоставит его с ContactViewModel.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...