jquery - Play video in jquery popup from file system?

Question

I want to play video in jquery popup in my ASP.NET application from file system not from a website link i.e youtube or vimeo. I have searched on internet but all seems to be developed only for youtube etc. Help me please to integrate a simple jquery popup which is easily compatible for ASP.NET and can play video of specific type of extensions. Thanks in advance.

Answer 1

My jsfiddle demo - https://jsfiddle.net/akshayshringi/e7tqycdj/

<div class="container">
<h2>Modal Example</h2>
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" id="showvideo">Open Modal</button>
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<video width="400" controls>
<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>


$('#showvideo').click(function(){
$("video").html('<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4" type="video/mp4">');
$("video")[0].load();
$('#myModal').modal('show');
$('video')[0].play();
});
$('#myModal').on('hidden.bs.modal', function () {
$("video").html('');
$("video")[0].load();
})