Html FileUpload

Bind to the uploadStart event by type: jqxFileUpload. Author: http://jqwidgets.com

by jqwidgets

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div style="margin-bottom: 20px; font-style: italic;">Note: to be able to upload a file you would have to set the property <strong>uploadUrl</strong> to point to a file hosted on your server, which handles the upload process.</div>
<div id="jqxFileUpload"></div>
<div id="log" style="margin-top: 20px;"></div>

JavaScript

$('#jqxFileUpload').jqxFileUpload({
    theme: 'energyblue',
    width: 300,
    uploadUrl: 'upload.php',
    fileInputName: 'fileInput'
});

$('#jqxFileUpload').on('uploadStart', function (event) {
    var fileName = event.args.file;
    $('#log').prepend('Started uploading: <strong>' + fileName + '</strong><br />');
});