jQuery tutorial for beginners - jquery range slider

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/06/jquery-range-slider.html Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help. https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1 In this video we will discuss jQuery Range Slider with an example. We want to implement a range slider in an asp.net web forms application using jQuery slider widget. For a range slider, all you need to do is set range option to true HTML Age : <span id="spanOutput"></span> <br /><br /> <div id="slider"></div> <br /> <label for="txtMinAge">Minimum Age</label> <input id="txtMinAge" type="text" /> <br /><br /> <label for="txtMaxAge">Maximum Age</label> <input id="txtMaxAge" type="text" /> jQuery Code $(document).ready(function () { var outputSpan = $('#spanOutput'); var sliderDiv = $('#slider'); sliderDiv.slider({ range: true, min: 18, max: 100, values: [20, 30], slide: function (event, ui) { outputSpan.html(ui.values[0] + ' - ' + ui.values[1] + ' Years'); }, stop: function (event, ui) { $('#txtMinAge').val(ui.values[0]); $('#txtMaxAge').val(ui.values[1]); } }); outputSpan.html(sliderDiv.slider('values', 0) + ' - ' + sliderDiv.slider('values', 1) + ' Years'); $('#txtMinAge').val(sliderDiv.slider('values', 0)); $('#txtMaxAge').val(sliderDiv.slider('values', 1)); });