HTML and CSS Reference
In-Depth Information
[WebMethod]
public static string GetVideo()
{
//write logic to return random video file
return “video1.mp4”;
}
Notice that both methods are static and are decorated with the
[WebMethod]
attribute. This attribute is
required so the methods become web callable and can be called from client-side code.
GetAudio()
and
GetVideo()
don't return a random file from a set of files, but you could add that logic inside the methods;
currently they return predefined audio and video file names.
Writing jQuery Code to Call Web Methods
To call the
GetAudio()
and
GetVideo()
web methods from the client-side code, you need to add some
jQuery code in the
Default.aspx
file. Listing 1-7 shows that code.
Listing 1-7.
jQuery Code for the Call
GetAudio()
and
GetVideo()
Web Methods
<script type=”text/javascript”>
$(document).ready(function () {
if (!Modernizr.audio) {
alert('Your browser does not support the HTML5 audio tag.');
return false;
}
if (!Modernizr.video) {
alert('Your browser does not support the HTML5 video tag.');
return false;
}
$(“#playaudio”).click(function () {
$.ajax({
type: “POST”,
url: 'default.aspx/GetAudio',
contentType: “application/json; charset=utf-8”,
dataType: “json”,
success: function (results) {
$(“#audio”).src = results.d;
$(“#audio”).trigger(“play”);
},
error: function (err) {
alert(err.status + “ - “ + err.statusText);
}
})
});
$(“#playvideo”).click(function () {
$.ajax({
type: “POST”,
url: 'default.aspx/GetVideo',
contentType: “application/json; charset=utf-8”,
