Search code examples
asp.net-mvc-4asp.net-web-apisinglepageupshot

Binding upshot to a Web API in a different project


I am trying to create a SPA application, to take advantage of upshot and its capabilities. However, the services exposing the data (i.e. the Web API) is in a completely separate project, already hosted on IIS. I would like to bind upshot to that existing API, but from what I can see in the HTML helpers for upshot (v1.0.0.1), you need to pass in the type of the controller that exposes the data, like so:

Html.UpshotContext.DataSource(Of ToDoController)(Function(x) x.GetTodoItems())

where ToDoController is the ApiController that exposes the data, defined in the same project.

My question is, how can I bind upshot to a Web API that is not in the same project? Is there any way I can use the helpers, or will I have to do everything manually?

I have access to the Model classes (i.e. TodoItem), as they are in a separate assembly, which can be referenced from both projects (SPA & Web API), but I don't have access to the controllers defined in the Web API project.


Solution

  • You can use the following:

    upshot.dataSources = upshot.dataSources || {};
    
    upshot.metadata({"ModelType:#Namespace":
        {
         "key":["Id"],
         "fields":    
            {"Id":{"type":"Int32:#System"},
             "IpAddress":{"type":"String:#System"},
             "Name":{"type":"String:#System"}
            }
        } (and so on, just map everything)
    });
    
    var dataSource = new upshot.RemoteDataSource({
        providerParameters: 
            { url: "Your URL", 
              operationName: "Method Name, example: GetCustomers" },
        entityType: "ModelType:#Namespace",
        bufferChanges: true (or false, whatever you like),
        dataContext: undefined,
        mapping: {}
    });
    

    If I were you, If I could I would temporarily create a solution with the Controller project in it, then I would check the JS generated by the UpshotContext helper and copy that into your pages (which is what I did to have the result above, anyway).