Use jquery to asynchronously pass model-to-controller methods with complex attributes and set properties

Source: Internet
Author: User
Tags tojson

The student class has a collection attribute courses, how to pass student together with the Set attribute courses to the Controller method?

public class Student
{
public string Studentname {get; set;}
Public ilist<course> Courses {get; set;}
}

public class Course
{
public string Coursename {get; set;}
}

-Ideas

In the front end of the assembly into a match with student, the corresponding object, and then use the json.stringify () or $.tojson () method to convert to the JSON format to pass to the Controller method, using the $.tojson () method needs to reference a jquery extension JS file.

-home/index.cshtml

@{
    "Index";
    "~/views/shared/_layout.cshtml";
}
<a id="btn" href="javascript:void (0)"> Walk you </a>
@section scripts
{
    <script src="~/scripts/json.js"></script>
    <script type="Text/javascript">
        $ (function () {
            $ (' #btn '). Click (function () {
                var arr = [];
                New Object ();
                "Language";
                Arr.push (OBJ1);
                New Object ();
                "Mathematics";
                Arr.push (OBJ2);
                var student = {
                    ' Xiao Ming ',
                    Courses:arr
                };
                var json = json.stringify (student);
                var json = $.tojson (student);
                $.ajax ({
                    ' @Url. Action ("Getstuent", "Home") ',
                    ' POST ',
                    ' Application/json; Charset=utf-8 ',
                    Data:json,
                    ' json ',
                    Success:function (data) {
                        Alert (data. Studentname);
                         for (i = 0; i < data.) Courses.length; i++) {
                            Alert (data. Courses[i]. Coursename);
                        }
                    }
                });
            });
            
        });
    </script>
}

-homecontroller

         Public ActionResult Index ()
        {
            return View ();
        }
        [HttpPost]
         Public ActionResult getstuent (Student Student)
        {
            return Json (student);
        }

-Convert objects into a JSON-formatted jquery extension

from:http://www.overset.com/2008/04/11/mark-gibsons-json-jquery-updated/
(function ($) {
    m = {
        ' \b ' ' \\b ',
        ' \ t ' ' \\t ',
        ' \ n ' ' \\n ',
        ' \f ' ' \\f ',
        ' \ r ' ' \\r ',
        ' "' ' \ \',
        ' \ \ ': '\\\\'
    },
    $.tojson = function (value, whitelist) {
        var a,          //The array holding the partial texts.
            I,          //The loop counter.
            K,          //the member key.
            L,          //Length.
            r =/["\\\x00-\x1f\x7f-\x9f]/g,
            V;          The member value.
        Switch (typeof value) {
            Case 'string':
                return R.test (value)?
                '"' + value.replace (r, function (a) {
                    var c = M[a];
                    if (c) {
                        return C;
                    }
                    c = A.charcodeat ();
                    Return ' \\u00 ' + Math.floor (C/16). ToString (+) + (c%). ToString (16);
                }) + ' "':
                "' + value + '";
            Case ' number':
                return Isfinite (value)? String (value): 'null';
            Case ' Boolean':
            Case 'null':
                return String (value);
            Case 'object':
                if (!value) {
                    Return 'null';
                }
                if (typeof Value.tojson = = = ' function') {
                    Return $.tojson (Value.tojson ());
                }
                a = [];
                if (typeof value.length = = = ' number' &&
                    ! (value.propertyisenumerable (' length '))) {
                    L = value.length;
                    for (i = 0; i < L + = 1) {
                        A.push ($.tojson (value[i), whitelist) | | 'null');
                    }
                    Return ' [' + a.join (',') + ']';
                }
                if (whitelist) {
                    L = whitelist.length;
                    for (i = 0; i < L + = 1) {
                        k = Whitelist[i];
                        if (typeof k = = = 'string') {
                            v = $.tojson (value[k], whitelist);
                            if (v) {
                                A.push ($.tojson (k) + ':' + V);
                            }
                        }
                    }
                } else {
                    For (k in value) {
                        if (typeof k = = = 'string') {
                            v = $.tojson (value[k], whitelist);
                            if (v) {
                                A.push ($.tojson (k) + ':' + V);
                            }
                        }
                    }
                }
                Return ' {' + a.join (',') + '} ';
        }
    };
}) (JQuery);      

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.