Cacher is the code snippet organizer for pro developers

$(".fileform input[type=file]").change(function(){
        var filename = $(this).val().replace(/.*\\/, "");
        $("#filename").val(filename);
    });

<div class="fileform">
							<div class="selectbutton"><i class="sprite icon-rounded-rectangle-4-copy"></i></div>
							<input id="upload" type="file" name="upload" max-size=10240/>
						</div>
						<input type="text" id="filename" class="filename" disabled>

.page-contacts form .fileform {
	position: relative;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
}
.page-contacts form .selectbutton {
	width: 40px;
	height: 40px;
	border-radius: 5px;
	border: solid 1px #cad0d6;
	position: relative;
	float: left;
}
.page-contacts form .selectbutton i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.page-contacts form .fileform input#upload {
	position: absolute;
	width: 40px;
	height: 40px;
	left: 0;
	top: 0;
	opacity:0;
	cursor: pointer;
}
.page-contacts form .input-box #filename {
	width: 200px;
	height: 40px;
	border-radius: 0;
	text-indent: 0;
	font-size: 16px;
	background: #fff;
	outline:none;
	border: none;
	display: inline-block;
	vertical-align: middle;

}