Здійснення простого дзвінка Ajax до контролера в asp.net mvc

109

Я намагаюся розпочати роботу з дзвінками ASP.NET MVC Ajax.

Контролер:

public class AjaxTestController : Controller
{
    //
    // GET: /AjaxTest/
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult FirstAjax()
    {
        return Json("chamara", JsonRequestBehavior.AllowGet);
    }   
}

Вид:

<head runat="server">
    <title>FirstAjax</title>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var serviceURL = '/AjaxTest/FirstAjax';

            $.ajax({
                type: "POST",
                url: serviceURL,
                data: param = "",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: successFunc,
                error: errorFunc
            });

            function successFunc(data, status) {     
                alert(data);
            }

            function errorFunc() {
                alert('error');
            }
        });
    </script>
</head>

Мені просто потрібно роздрукувати попередження методом контролера, що повертає дані. Над кодом просто надрукуйте "хамару" на моєму огляді. Попередження не спрацьовує.

ОНОВЛЕННЯ

Я змінив свій контролер, як показано нижче, і він почав працювати. Я не маю чіткого уявлення, чому це працює зараз. Хтось, будь ласка, поясніть. Параметр "a" не пов'язаний, я додав його, тому що я не можу додати два методи з однаковою назвою методу та параметрами. Я думаю, це може бути не рішенням, а його роботою

public class AjaxTestController : Controller
    {
        //
        // GET: /AjaxTest/
        [HttpGet]
        public ActionResult FirstAjax()
        {
            return View();
        }

        [HttpPost]
        public ActionResult FirstAjax(string a)
        {
            return Json("chamara", JsonRequestBehavior.AllowGet);
        }
    }

— хамара
джерело

повернути форматизований рядок json {"name":"chamara"}. потім спробуйте прочитати якdata['name']

— Рааб

1

Видаліть другу подачу бібліотеки jQuery. Ваш код повинен працювати так, як є. Я думаю, що може виникнути помилка сценарію, яка не дозволяє з'являти сповіщення.

— Теренс

23

Після оновлення, яке ви зробили,

його перший виклик дії FirstAjax із запитом HttpGet за замовчуванням та надає порожній перегляд Html. (Раніше у вас цього не було)
пізніше після завантаження елементів DOM цього перегляду ваш виклик Ajax звільняється та відображає попередження.

Раніше ви лише повертали JSON у браузер, не надаючи жодного HTML-коду. Тепер у ньому представлений перегляд HTML, де він може отримати ваші дані JSON.

Ви не можете безпосередньо надати JSON його звичайні дані, а не HTML.

— піднести
джерело

52

Видаліть атрибут даних таким, яким ви не є POSTING нічого на сервері (Ваш контролер не очікує жодних параметрів).

І у вашому методі AJAX ви можете використовувати Razorта використовувати, @Url.Actionа не статичну рядок:

$.ajax({
    url: '@Url.Action("FirstAjax", "AjaxTest")',
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: successFunc,
    error: errorFunc
});

З вашого оновлення:

$.ajax({
    type: "POST",
    url: '@Url.Action("FirstAjax", "AjaxTest")',
    contentType: "application/json; charset=utf-8",
    data: { a: "testing" },
    dataType: "json",
    success: function() { alert('Success'); },
    error: errorFunc
});

— Даррен
джерело

3

@chamara - вибачте, видаліть HttpPost (Ви нічого не публікуєте на сервер, щоб це було зайвим атрибутом) і контролер не потрапив би. Також видаліть "type: POST" у функції AJAX, коли я вас посіяв.

— Даррен

18

Використовуйте бритву, щоб динамічно змінювати URL-адресу, називаючи свою дію так:

$.ajax({
    type: "POST",
    url: '@Url.Action("ActionName", "ControllerName")',
    contentType: "application/json; charset=utf-8",
    data: { data: "yourdata" },
    dataType: "json",
    success: function(recData) { alert('Success'); },
    error: function() { alert('A error'); }
});

— gdmanandamohon
джерело

Параметри для Url.Action зворотні у цій відповіді, це Url.Action (actionName, controllerName)

— xd6_

1

Це не прихильник цього, це спонукає з'єднати вигляд і javascript, але е, ім’я користувача перевіряється?

— Халтер

@Halter UX значно покращується, коли ви не змушуєте користувача переадресовувати кожну дію. І на клієнтові відбувається багато речей, про які сервер не повинен піклуватися.

— Калонь Колоб

@KolobCanyon ви на 100% правильні. Мій коментар більше стосується візуалізації URL-адреси з бритвою в javascript, це щільно поєднує ваш javascript з видом (cshtml). Це гарна відповідь, але щоб виправити тугий зв'язок, можливо, ви зможете скинути URL-адресу в атрибут даних у chstml та прочитати його у javascript. Вибачте за непорозуміння!

— Халтер

5

Перше, що немає необхідності мати дві різні версії бібліотек jquery на одній сторінці, або "1.9.1", або "2.0.0" достатньо, щоб змусити роботу ajax працювати.

Ось ваш код контролера:

    public ActionResult Index()
    {
        return View();
    }

    public ActionResult FirstAjax(string a)
    {
        return Json("chamara", JsonRequestBehavior.AllowGet);
    }

Ось як повинен виглядати ваш погляд:

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

<script type="text/javascript">
$(document).ready(function () {
    var a = "Test";
    $.ajax({
        url: "../../Home/FirstAjax",
        type: "GET",
        data: { a : a },
        success: function (response) {
            alert(response);
        },
        error: function (response) {
            alert(response);
        }
    });
});
</script>

— Lokesh_Ram
джерело

5

Якщо вам просто потрібно натиснути метод C # у своєму Ajax Call, вам просто потрібно ввести два питання та URL-адресу, якщо ваш запит отримано, вам просто потрібно вказати лише URL-адресу. будь ласка, дотримуйтесь коду нижче, він працює добре.

C # код:

    [HttpGet]
    public ActionResult FirstAjax()
    {
        return Json("chamara", JsonRequestBehavior.AllowGet);
    }

Код сценарію Java, якщо отримати запит

    $.ajax({
        url: 'home/FirstAjax',
        success: function(responce){ alert(responce.data)},
        error: function(responce){ alert(responce.data)}
    });

Код сценарію Java, якщо після запиту, а також [HttpGet] до [HttpPost]

        $.ajax({
            url: 'home/FirstAjax',
            type:'POST',
            success: function(responce){ alert(responce)},
            error: function(responce){ alert(responce)}
        });

Примітка. Якщо ви FirstAjax в тому ж контролері, у якому ваш контролер перегляду, то в URL-адресі немає імені контролера. подібно доurl: 'FirstAjax',

— Мухаммед Асад
джерело

4

Це для вашого питання ОНОВЛЕННЯ.

Оскільки у вас не може бути двох методів з одним іменем та підписом, ви повинні використовувати атрибут ActionName:

ОНОВЛЕННЯ:

[HttpGet]
public ActionResult FirstAjax()
{
    Some Code--Some Code---Some Code
    return View();
}

[HttpPost]
[ActionName("FirstAjax")]
public ActionResult FirstAjaxPost()
{
    Some Code--Some Code---Some Code
    return View();
}

І, будь ласка, перейдіть за цим посиланням для подальшого ознайомлення з тим, як метод стає дією. Дуже хороший довідник, хоча.

— RGR
джерело

1

Вид;

 $.ajax({
        type: 'GET',
        cache: false,
        url: '/Login/Method',
        dataType: 'json',
        data: {  },
        error: function () {
        },
        success: function (result) {
            alert("success")
        }
    });

Метод контролера;

 public JsonResult Method()
 {
   return Json(new JsonResult()
      {
         Data = "Result"
      }, JsonRequestBehavior.AllowGet);
 }

— oyenigun
джерело

0

замість url: serviceURL, використання

url: '<%= serviceURL%>',

і ти передаєш 2 параметри до successFunc?

function successFunc(data)
 {
   alert(data);
 }

— swapneel
джерело

0

Додати "JsonValueProviderFactory" у global.asax:

protected void Application_Start()
{
    AreaRegistration.RegisterAllAreas();
    ValueProviderFactories.Factories.Add(new JsonValueProviderFactory());
}

— Яш
джерело

що таке JsonValueProviderFactory?

— Кікенет