jquery ajax load
Edit
  Murat
49

     
0 0

Published on 04-08-2017
Link for all dot net and sql server video tutorial playlistshttps://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1Link for slides, code samples and text version of the
Link for all dot net and sql server video tutorial playlists
https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1

Link for slides, code samples and text version of the video
http://csharp-video-tutorials.blogspot.com/2015/05/jquery-ajax-load.html

In this video we will discuss how to load HTML data from the server using jquery AJAX load function.

What is AJAX
AJAX stands for Asynchronous JavaScript and XML, and allow parts of the page to be updated without having to reload the entire page.

Syntax
.load( url [, data ] [, complete ] )

Parameter - Description
url - Required. URL to which the request is sent.
data - Optional. A JSON object or string that is sent to the server along with the request.
complete - A callback function that is called when the request completes.

The following example loads HTML data from the server. When a text box receives focus, the help text associated with that field is loaded from the server and displayed. When the focus is lost the help text disappears.

HtmlPage1.html
<html>
<head>
<script src="jquery-1.11.2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var textBoxes = $('input[type="text"]');
textBoxes.focus(function () {
var helpDiv = $(this).attr('id') + 'HelpDiv';
$('#' + helpDiv).load('Help.html #' + helpDiv);
});

textBoxes.blur(function () {
var helpDiv = $(this).attr('id') + 'HelpDiv';
$('#' + helpDiv).html('');
});
});
</script>
</head>
<body style="font-family:Arial">
<table>
<tr>
<td>First Name</td>
<td><input id="firstName" type="text" /></td>
<td><div id="firstNameHelpDiv"></div></td>
</tr>
<tr>
<td>Last Name</td>
<td><input id="lastName" type="text" /></td>
<td><div id="lastNameHelpDiv"></div></td>
</tr>
<tr>
<td>Email</td>
<td><input id="email" type="text" /></td>
<td><div id="emailHelpDiv"></div></td>
</tr>
<tr>
<td>Income</td>
<td><input id="income" type="text" /></td>
<td><div id="incomeHelpDiv"></div></td>
</tr>
</table>
</body>
</html>

Help.html
<div id="firstNameHelpDiv">
Your fisrt name as it appears in passport
</div>

<div id="lastNameHelpDiv">
Your last name as it appears in passport
</div>

<div id="emailHelpDiv">
Your email address for communication
</div>

<div id="incomeHelpDiv">
Your annual income
</div>


COMMENTS · 0

Big Grin :D Frown :( Mad :mad: Stick Out Tongue :p Embarrassment :o Confused :confused: Wink ;) Smile :) Roll Eyes (Sarcastic) :rolleyes: Cool :cool: EEK! :eek:
  


jquery ajax load Link for all dot net and sql server video tutorial playlistshttps://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1Link for slides, code samples and text version of the jquery ajax tutorial,jquery ajax tutorial for beginners,jquery ajax load html page into div,jquery ajax load html page,jquery ajax load html example,jquery ajax load part of page,jquery ajax get data server,jquery tutorial,jquery tutorial for beginners guest Guest 0 1 core/images/default/default_avatar_thumb.png http://vbtube.com/community 60 20 0 No more comments Youtube-Browser 0
Working...
X