在MVC视图中显示JSON obj数组,然后单击btn以显示“唯一”

时间:2019-05-15 00:39:53

标签: javascript json ajax asp.net-mvc-5

我有一个JSON数组,仅在试图在我的视图中显示它就一直出错,我认为这很容易,但到目前为止还没有。一旦正确显示它,所有的东西都会被单击,以调用另一个函数以将其显示为UNIQUE。这是我目前拥有的代码

JSON -    var myArray =
        [ …. ]
function getData() {
            //alert("TEST");@Url.Action("ListData"),
            //
            $.ajax({
                url: '/home/ListData?values=' + JSON.stringify(myArray),
                type: 'POST',
                dataType: 'json',
                data: JSON.stringify(myArray),
                contentType: 'application/json; charset=utf-8',
                traditional: true,
                success: function () {
                    alert('Success');
                },
                error: function (ex) {
                    alert('Error' + ex);
                }
            });
        }                <div class="panel-heading">
                    Full Array
                    <input type="button" value="Get" onclick="getData()" />
                </div>
                <div class="panel-body">
                    @*@foreach(var item in Viewbag.MaybeJ)
                    {

                    }*@

                </div>
                <div class="panel-footer">
                    <input type="submit" class="btn btn-success" value="Unique" />
                </div>
[HttpPost]
        public ActionResult ListData(string values)
        {
            IList<aModel> models = new JavaScriptSerializer().Deserialize<IList<aModel>>(values);
            //List<aModel> models = new List<aModel>();
            //foreach(var mod in values)
            //{
            //    models.Add(new aModel
            //    {
            //        Id = mod.Id,
            //        WebImage_Id = mod.WebImage_Id,
            //        Wis_Id = mod.Wis_Id,
            //        Caption = mod.Caption,
            //        Specifics = mod.Specifics
            //    });
            //}
            ViewBag.MaybeJ = models;


            return RedirectToAction("Filtering");
        }

1 个答案:

答案 0 :(得分:0)

Js

<script>
var myArray = [{id: '1', Name: 'Ram Anugandula' }];

function getData() {
        //alert("TEST");@Url.Action("ListData"),
        //
        $.ajax({
            url: '/User/ListData',
            type: 'POST',
            dataType: 'json',
            data: JSON.stringify(myArray),
            contentType: 'application/json; charset=utf-8',
            success: function (result) {
                alert('Success');
                $.each(result,function(index,val){
                    $("#UsersList").append('<li>+ val.Name +</li>')
                });
            },
            error: function (ex) {
                alert('Error' + ex);
            }
        });
    }
</script>

控制器

 [HttpPost]
 public JsonResult ListData(List<Users> usersList) {
      return Json(usersList, JsonRequestBehavior.AllowGet);
 }

班级

 public class Users 
 {
     public int ID { get; set; }
     public string Name { get; set; }
 }

HTML

<input type="button" value="Get" onclick="getData()" />
<div>
     <ul id="UsersList"></ul>
</div>