Как передать значения из представления в метод контроллера с помощью javascript? в ядре asp .net

У меня есть какой-то мессенджер, у него есть панель, на которой я вижу все свои контакты. Я хочу, чтобы я нажимал на один из них, чтобы передать телефонный номер и Идентификатор моему Контроллер, чтобы отправить сообщение и сохранить его в базе данных.
Foreach печатает все мои контакты:

@foreach (var contact in Model.Contacts)
                {
                    <div class = "chatperson" onclick = "get_contact_number(@contact.PhoneNumber , @contact.ContactId)">
                        <div class = "namechat">
                            <div class = "pname">
                                @contact.Name
                                <a asp-action = "ContactDetails" asp-route-id = "@contact.ContactId" class = " glyphicon glyphicon-info-sign"></a>
                                <a asp-action = "EditContact" asp-route-id = "@contact.ContactId" class = " glyphicon glyphicon-pencil "></a>
                            </div>
                            <div class = "lastmsg">@contact.PhoneNumber </div>
                        </div>
                    </div>
                }


В div я использовал метод JS и передавал туда значения:

function get_contact_number(contactNumber, contactId) {
    @Model.PhoneNr = contactNumber;
    @Model.ContactId = contactId;
}

Наконец, я хочу передать эти значения функции моего контроллера

 public IActionResult SendMessage(MessengerViewModel model, string phoneNumber, string message)
    {
        var CurrentUserId = _httpContextAccessor.HttpContext.User.FindFirst(ClaimTypes.NameIdentifier).Value;
        if (ModelState.IsValid)
        {
            var newMessage = new Message();

            newMessage.UserId = CurrentUserId;
            newMessage.ContactId = model.ContactId;
            newMessage.Body = model.MessageBody;
            newMessage.Date = DateTime.Now;
            newMessage.isDelivered = true;
            _messageService.AddMessage(newMessage);

            AtSmsSender smsSender = new AtSmsSender();
            message = model.MessageBody;
            phoneNumber = model.PhoneNr;
            smsSender.SendSms(phoneNumber, message);

            return RedirectToAction("Index", "Messenger");
        }
        else
        {
            return RedirectToAction("Index", "Messenger");
        }
    }

вам нужно прочитать о запросах AJAX

vasily.sib 22.05.2018 10:48

Почему бы просто не использовать ссылку?

user3559349 22.05.2018 10:49
@Model.PhoneNr = contactNumber; вроде не то. Обратите внимание, что значение PhoneNr отображается на стороне сервера.
Tetsuya Yamamoto 22.05.2018 10:50

@StephenMuecke, потому что никому не нравится, когда вся страница перезагружается, когда вы просто отправляете сообщение в чате?

vasily.sib 22.05.2018 10:56

@ vasily.sib, я согласен, но посмотрите код OP - у них есть RedirectToAction(), что означает, что они хотят перенаправить :)

user3559349 22.05.2018 10:58

Конечно, у OP также есть бессмысленный if (ModelState.IsValid) - он никогда не будет недействительным), так что кто знает, что они хотят делать

user3559349 22.05.2018 10:59

@ vasily.sib RedirectToAction только на время, потому что теперь мое приложение находится в тихом сырье, и я сделаю много рефакторинга, также все еще не знаю, как сделать перезагрузку <div>, которая не будет перезагружать всю страницу

Daniel Žeimo 22.05.2018 12:22

@ DanielŽeimo, как я уже сказал: вам нужно прочитать об AJAX. Вкратце: ваш JavaScript отправляет запрос на сервер, получает новые данные и обновляет HTML-элементы прямо в вашем браузере.

vasily.sib 22.05.2018 12:27

@ vasily.sib ага, прочитаю об этом сейчас

Daniel Žeimo 22.05.2018 12:38
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
9
877
1

Ответы 1

вы можете выполнить вызов ajax из функции get_contact_number. Что-то вроде приведенного ниже кода

$.ajax({
    type:'GET',
    url: '@Url.Action("ActionName", "ControllerName")',
    async:true,
    success:function(response){
        //Do Something With response object returned by your action
    }
});

если вы используете jQuery и правильно установите его в свое приложение

vasily.sib 22.05.2018 11:04

Другие вопросы по теме