Search code examples
c#jsonasp.net-mvccamelcasing

How to set Json data to camelCase once on the client side


How does one go about turn serialized json data into camelCase data rather than all the properties upper case?

In my View here is how I am turn the c# in Json

team = @Html.Raw(Json.Encode(Model.Employees));

Here is the data: "All of this is Test data by the way"

 team = [
    {
        "UserId": "902c2fe0-fcdf-4ed8-9591-5d8e01300cda",
        "UserName": "buderbits",
        "ID": 719,
        "Email": "erik@builder.com",
        "FName": "Builder",
        "LName": "Bits",
        "Title": "Glaizer",
        "Zip": "10027",
        "Phone": "456-768-9987",
        "AddressLine": "124 street st.",
        "City": "Nyc",
        "StateCD": "NY",
        "Avatar": "/users/RFyEQxDCpEavRfgDA028/qvzlezay.u1l.png",
        "RowNum": 3,
        "Total": 4,
        "IsDirty": false,
        "IsFlaggedForDelete": false,
        "SortOrder": 0
    },
    {
        "UserId": "a9cec535-ac48-4197-b8a0-87702cb14e52",
        "UserName": "stdard",
        "ID": 717,
        "Email": "erik@vinyl.org",
        "FName": "Erik",
        "LName": "Little",
        "Title": "Developer",
        "Zip": "75040",
        "Phone": "123-456-7890",
        "AddressLine": "123 Test Street",
        "City": "Garland",
        "StateCD": "TX",
        "Avatar": "/users/CZmP9uvdTCg8CdEhOAX0/kcm1yg2o.spn.gif",
        "RowNum": 1,
        "Total": 4,
        "IsDirty": false,
        "IsFlaggedForDelete": false,
        "SortOrder": 0
    },
    {
        "UserId": "1a4ef17a-9cd8-42e4-b172-3071e29a222a",
        "UserName": "teammber1",
        "ID": 2744,
        "Email": "erik2@erik.com",
        "FName": "Derick",
        "LName": "Mavrick",
        "Title": "Drafting",
        "Zip": "77702",
        "Phone": "111-111-1111",
        "AddressLine": "123 Teammember ST",
        "City": "Beaumont",
        "StateCD": "TX",
        "Avatar": "/users/rPF9z0a7yLJpp4e1Zb15/os1cmk0r.kkg.jpg",
        "RowNum": 4,
        "Total": 4,
        "IsDirty": false,
        "IsFlaggedForDelete": false,
        "SortOrder": 0
    },
    {
        "UserId": "17fab37f-d978-441c-a30d-8c08a7e6ce9b",
        "UserName": "stoontsoftware",
        "ID": 718,
        "Email": "support@storefront.net",
        "FName": "Mark",
        "LName": "Taylor",
        "Title": "Hosting",
        "Zip": "75070",
        "Phone": "345-432-1153",
        "AddressLine": "123 street dr",
        "City": "McKinney",
        "StateCD": "TX",
        "Avatar": "/users/y5TPPr0HR1GQLxkEhDuj/3bmwy0sk.qoi.png",
        "RowNum": 2,
        "Total": 4,
        "IsDirty": false,
        "IsFlaggedForDelete": false,
        "SortOrder": 0
    }
];

HELP?


Solution

  • You can use Newtonsoft's json serializer (Json.net) which allows you to specify a formatter when serializing an object.

    var d = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.Employees, 
            new JsonSerializerSettings
            {
               ContractResolver = new CamelCasePropertyNamesContractResolver()
            }));
    console.log(d);
    

    This will give you the lowercase property names for your js object/array created by the serialization.