00:01Hi. I'm Shawna, this is Rich, and we're both from Tacoma, Washington, with GeoEngineers.

00:14We're going to be talking about how to retrieve business data from the server from a map click using the ASP.NET MVC 3…

00:24…with the Razor Viewer. We were hired by Puget Sound Partnership, who has a lot of project data as points throughout their region…

00:33…and they wanted to be able to summarize data of a geological area like a county…

00:39…in addition, to be able to filter the points based on a category.

00:45So our requirements were, we had some point data that the user was able to filter…

00:50…and reduce or increase points, and then we also had a requirement of being able to summarize data in a geological area…

00:59…through selections on the map.

01:01And then we had to return those summaries based on the number of points in that area that one time.

01:09Our challenges here were the multiple query parameters…

01:13…we couldn't use a simple query task; we needed something a little more sophisticated…

01:16…that we could pass parameters and get the response back.

01:20This is a image of our technology stack and what we used to develop the application itself.

01:26Like I said before, it was ASP.NET with Razor View using the JavaScript API. And I'm going to pass it to Rich…

01:33…he's going to go through the actual steps that we took to get the data back from the server on a map click.

01:42We were both fairly new to the ASP MVC framework, so although this seemed like sort of a simple task…

01:51…there were a lot of moving parts to it, so we thought maybe this would help some people…

01:54…that are using ASP MVC for the first time.

01:58So we took our data and we put it into JavaScriptObject, turned it into JSON, and then we used AJAST POST to send that JSON…

02:08…to the controller method.

02:11Now, one of the important things was that the controller method had to be parameterized with an object that had the same…

02:21…or a class that had the same properties as our JSON had. So basically, they had to have the same names, the same property names…

02:30…for the controller method to work right.

02:34In the controller, we took that JSON data and used it to parameterize the [unintelligible] procedure.

02:43[Unintelligible] procedure sent back the data, and we jumped that into an object, and finally, in the controller…

02:52…we called the partial view method, sending the object to the partial view method, and used Razor to generate the HTML that we wanted…

03:05…with the data returned from the [unintelligible] procedure.

03:09And finally, then we used the controller to return that partial view, that HTML, back to the client, where the Ajax was waiting.

03:19And it took that, and we used some jQuery at the very end there to load it into a waiting div.

03:26So that's basically all the pieces right there. And looking back at it now, it seems fairly straightforward…

03:34…but at the time, it took me quite a few stack exchange posts to figure all that out…

03:39…and so I just want to thank anyone that might have responded to my stack exchange posts through all that.

03:46We have a handout that details a bunch of code on this. It's by the water cooler in the back, if you're interested.

03:52And come talk to us with questions, if you have any, and thanks.