Requirements
App.Data WebApi Examples
In this example, we'll get app-data from the WebApi.
Click to see the result of a WebApi call with the shared code:
Important: WebApi using
The
[JsonFormatter]
đŸ†• in 2sxc 16
The
[JsonFormatter]
has a few effects.
It auto-defaults to camelCase (but you can modify this if you need to preserve casing).
It will also auto-convert entities to a standard JSON format.
Output
Source Code of this file
Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code
@inherits Custom.Hybrid.Razor14 <!-- unimportant stuff, hidden --> <div @Sys.PageParts.InfoWrapper()> @Html.Partial("../shared/DefaultInfoSection.cshtml") <div @Sys.PageParts.InfoIntro()> <h2>App.Data WebApi Examples</h2> <p>In this example, we'll get app-data from the WebApi.</p> <p>Click to see the result of a WebApi call with the shared code:</p> @Html.Partial("./Part NowUsingJsonFormatter.cshtml") </div> </div> <button type="button" class="btn btn-primary" onclick="getPersons(this)"> Get Persons Custom </button> <button type="button" class="btn btn-primary" onclick="getBooks(this)"> Get Books Custom </button> <br> <br> <button type="button" class="btn btn-primary" onclick="getPersonsAuto(this)"> Persons with Auto-Convert </button> <button type="button" class="btn btn-primary" onclick="getPersonsAutoPreserveCasing(this)"> Persons with Auto-Convert, preserve casing </button> @* 2sxclint:disable:no-inline-script *@ <script> function getPersons(moduleContext) { $2sxc(moduleContext).webApi.fetchJson('books/persons') .then(function(data) { alert('Found ' + data.length + ' persons. \n' + 'The first one is "' + data[0].FirstName + ' ' + data[0].LastName + '"\n\n' + 'The raw JSON: \n' + JSON.stringify(data) ); }); } function getBooks(moduleContext) { $2sxc(moduleContext).webApi.fetchJson('books/books') .then(function(results) { alert('Found ' + results.length + ' books. \n' + 'The first one is "' + results[0].Title + '"\n\n' + 'The raw JSON: \n' + JSON.stringify(results) ); }); } function getPersonsAuto(moduleContext) { $2sxc(moduleContext).webApi.fetchJson('books/personsAuto') .then(function(results) { alert('On WebApi with Auto-Convert: Found ' + results.length + ' persons. \n' + 'The first one is "' + results[0].firstName + ' ' + results[0].lastName + '"\n\n' + 'The raw JSON: \n' + JSON.stringify(results) ); }); } function getPersonsAutoPreserveCasing(moduleContext) { $2sxc(moduleContext).webApi.fetchJson('books/PersonsAutoPreserveCasing') .then(function(results) { alert('On WebApi with Auto-Convert: Found ' + results.length + ' persons. \n' + 'The first one is "' + results[0].FirstName + ' ' + results[0].LastName + '"\n\n' + 'The raw JSON: \n' + JSON.stringify(results) ); }); } </script> @* Footer *@ @Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })