通过POST（阿贾克斯）发送JSON数据，并接收来自控制器JSON响应（MVC） [英] Send JSON data via POST (ajax) and receive json response from Controller (MVC)

问题描述

我在JavaScript这样创造了一个功能：

 函数addNewManufacturer（）{
       变种名称= $（＃ID-MANUF名）VAL（）。
       。VAR地址= $（＃ID-MANUF地址）VAL（）;
       。VAR手机= $（＃ID-MANUF电话）VAL（）;

       VAR sendInfo = {
           名称：名称，
           地址：地址，
           电话：手机
       };

       $阿贾克斯（{
           键入：POST，
           网址：/首页/添加，
           数据类型：JSON，
           成功：函数（MSG）{
               如果（MSG）{
                   警报（有人+姓名+添加列表中！）;
                   location.reload（真正的）;
               } 其他 {
                   警报（不能添加到列表！）;
               }
           }，

           数据：sendInfo
       }）;
}
 

我叫 jquery.json-2.3.min.js 脚本文件，我用了的toJSON（阵列）方法。

在控制器，我有这样的添加动作

  [HttpPost]
公众的ActionResult添加（PersonSheets sendInfo）{
    布尔成功= _addSomethingInList.AddNewSomething（sendInfo）;

    返回this.Json（新{
         味精=成功
    }）;

}
 

但是 sendInfo 作为方法的参数变得无效。

型号：

 公共结构PersonSheets
{
    公众诠释标识;
    公共字符串名称;
    公共字符串的地址;
    公共字符串电话;
}

公共类PersonModel
{
    私人列表＆LT; PersonSheets＆GT; _list;
    公共PersonModel（）{
         _list = GetFakeData（）;
    }

    公共BOOL AddNewSomething（PersonSheets资讯）{
         如果（（信息为对象）== NULL）{
            抛出新的ArgumentException（人列表不能为空，信息）;
         }

         PersonSheets项目=新PersonSheets（）;
         item.Id = GetMaximumIdValueFromList（_list）+ 1;
         item.Name = info.Name;
         item.Address = info.Address;
         item.Phone = info.Phone;

         _list.Add（项目）;

         返回true;
    }
}
 

我

如何能做到在行动方法，当数据被发送与POST？

我不知道怎么用。 此外，也可以通过JSON返回响应（阿贾克斯）？

感谢您

解决方案

创建模型

 公共类Person
{
    公共字符串名称{;组; }
    公共字符串的地址{获得;组; }
    公共字符串电话{获得;组; }
}
 

控制器中包含

 公众的ActionResult PersonTest（）
    {
        返回查看（）;
    }

    [HttpPost]
    公众的ActionResult PersonSubmit（Vh.Web.Models.Person人）
    {
        System.Threading.Thread.Sleep（2000）; / *模拟连接速度慢* /

        / *做一些与对象者* /


        返回JSON（新{味精=成功添加+ person.Name}）;
    }
 

Javacript

 ＆LT;脚本类型=文/ JavaScript的＆GT;
    功能的send（）{
        变种人= {
            名称：$（＃ID名称）VAL（）。
            地址：$（＃ID地址）VAL（）。
            电话：$（＃ID电话）VAL（）
        }

        $（'＃目标）HTML（'发送..'）;

        $阿贾克斯（{
            网址：/测试/ PersonSubmit'，
            类型：'后'，
            数据类型：JSON，
            成功：功能（数据）{
                $（'＃目标）HTML（data.msg）;
            }，
            数据：人
        }）;
    }
＆LT; / SCRIPT＆GT;
 

I created a function in javascript like that:

function addNewManufacturer() {
       var name = $("#id-manuf-name").val();
       var address = $("#id-manuf-address").val();
       var phone = $("#id-manuf-phone").val();

       var sendInfo = {
           Name: name,
           Address: address,
           Phone: phone
       };

       $.ajax({
           type: "POST",
           url: "/Home/Add",
           dataType: "json",
           success: function (msg) {
               if (msg) {
                   alert("Somebody" + name + " was added in list !");
                   location.reload(true);
               } else {
                   alert("Cannot add to list !");
               }
           },

           data: sendInfo
       });
}

I called jquery.json-2.3.min.js script file and I used it for toJSON(array) method.

In controller, I have this Add action

[HttpPost]
public ActionResult Add(PersonSheets sendInfo) {
    bool success = _addSomethingInList.AddNewSomething( sendInfo );

    return this.Json( new {
         msg = success
    });

}

But sendInfo as method parameter becomes null.

The model:

public struct PersonSheets
{
    public int Id;
    public string Name;
    public string Address;
    public string Phone;
}

public class PersonModel
{
    private List<PersonSheets> _list;
    public PersonModel() {
         _list= GetFakeData();
    }

    public bool AddNewSomething(PersonSheets info) {
         if ( (info as object) == null ) {
            throw new ArgumentException( "Person list cannot be empty", "info" );
         }

         PersonSheets item= new PersonSheets();
         item.Id = GetMaximumIdValueFromList( _list) + 1;
         item.Name = info.Name;
         item.Address = info.Address;
         item.Phone = info.Phone;

         _list.Add(item);

         return true;
    }
}

How could I do in action method when the data was sent with POST ?

I don't know how to use. Also, it is possible to send back the response (to ajax) via JSON ?

Thank you

解决方案

Create a model

public class Person
{
    public string Name { get; set; }
    public string Address { get; set; }
    public string Phone { get; set; }
}

Controllers Like Below

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

    [HttpPost]
    public ActionResult PersonSubmit(Vh.Web.Models.Person person)
    {
        System.Threading.Thread.Sleep(2000);  /*simulating slow connection*/

        /*Do something with object person*/


        return Json(new {msg="Successfully added "+person.Name });
    }

Javacript

<script type="text/javascript">
    function send() {
        var person = {
            name: $("#id-name").val(),
            address:$("#id-address").val(),
            phone:$("#id-phone").val()
        }

        $('#target').html('sending..');

        $.ajax({
            url: '/test/PersonSubmit',
            type: 'post',
            dataType: 'json',
            success: function (data) {
                $('#target').html(data.msg);
            },
            data: person
        });
    }
</script>

这篇关于通过POST（阿贾克斯）发送JSON数据，并接收来自控制器JSON响应（MVC）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！