Fork me on GitHub
DNN Apps - Demo-Zone
Discover DNN-Apps - simple and elegant, easy to customize
You are here: Home  >  Apps  >  Tutorial WebApi - With AngularJS

    Tutorial WebApi - With AngularJS

    Cool demo showing both WebApi and AngularJS. 

    It has a simple version (using just a AngularJS controller) and a more sophisticated edition using Services. 

    Download the App, learn a lot and have fun experimenting with it!

    Important note: many buttons won't work on this demo-page, because you're not logged in and don't have edit-permissions. This is a security feature, it will work on your install. 

    WebAPI calls with parameters and data-updates without page-refresh

    1. Here we're will use parameters. If there are just a few (like just an ID) we can put this in the Url.
    2. The Server-Api must expect these in the Action-parameters (the method-definition)
    3. When more parameters are needed (like when creating a new category) we move over to the post-body.
    4. The following drop-down is automatically populated by the categories. I created a small AngularJS app to prefill it - if you would like to know more, read my AngulaJS series in the dnn-blogs.
    5. Let's ask the server for details regarding one category.
    2serve . 2invent . 2create is 2be.