HTML and CSS Reference
In-Depth Information
current image and a direction ( N =Next or P =Previous). GetImage() then returns an Image object
representing the previous or next image. The OnSuccess() function simply reads the Image object
properties and displays a slide accordingly. Listing 6-5 shows the OnSuccess() function.
Listing 6-5 . OnSuccess() Function
function OnSuccess(image) {
$("#divMsg").html("History Length : " + history.length);
OnSuccess() receives an Image object returned from the GetImage() action method. Title , ImageUrl ,
and Description are then assigned to appropriate HTML elements. A <div> element also shows the
number of entries in the History object to prove the point.
The skeleton of the GetImage() action method that is invoked using the $.Ajax() calls is shown in
Listing 6-6.
Listing 6-6. GetImage() Action Method
public JsonResult GetImage(int id,string direction)
ImageDbEntities db = new ImageDbEntities();
IQueryable<Image> data = null;
return Json(data.SingleOrDefault());
GetImage() accepts an ID of an image and a direction. It then finds the next or previous image in the
specified direction. If no direction is specified, it fetches an image with the specified ID. The return type of
GetImage() is JsonResult . The Json() method converts an Image object into its JSON equivalent and
returns it to the caller.
Now, to understand the problem discussed at the beginning of this section, run the new Slide Show
application and navigate through the slides using the Previous and Next buttons. Figure 6-3 shows slide 2
displayed in the browser, but the address bar still shows the base URL.
Figure 6-3. Changing the current slide doesn't change the URL in the address bar.
Because you're fetching slides using $.Ajax() , the browser address bar doesn't change the URL. Once
you're finished, try clicking the < and > buttons. Even if you navigate through all the slides, you aren't taken
forward or backward because the browser has just one entry in the History object: http://
localhost:1065/Ajaxhome .
Search WWH ::

Custom Search