JSFiddle - React, Tailwind, and code Playground

by B. Arkni

HTML

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://rawgit.com/nghuuphuoc/bootstrapvalidator/master/dist/css/bootstrapValidator.min.css">
<script src="https://rawgit.com/nghuuphuoc/bootstrapvalidator/master/dist/js/bootstrapValidator.min.js"></script>
<div class="form-group" id="test">
    <label for="resume" class="col-sm-2 control-label">Upload stuff</label>
    <div class="col-sm-8">
        <input type="file" name="fileupload" id="fileupload" />
    </div>
    <div class="col-sm-2">	<a class="btn btn-danger pull-right" id="removeFile">Remove</a>

    </div>
</div>

JavaScript

$(document).ready(function () {
            $('#test').bootstrapValidator({
                live: 'enabled',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    fileupload: {
                        validators: {
                            file: {
                                extension: 'doc,docx,pdf,zip,rtf',
                                type: 'application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/rtf,application/zip',
                                maxSize: 5 * 1024 * 1024, // 5 MB
                                message: 'The selected file is not valid, it should be (doc,docx,pdf,zip,rtf) and 5 MB at maximum.'
                            }
                        }
                    }
                }
            });

            $('#removeFile').on('click', function () {
                document.getElementById('fileupload').value = "";
                $('#test').bootstrapValidator('revalidateField', 'fileupload');
            });
        });