JSFiddle - React, Tailwind, and code Playground

by Emanuel Vecchio

HTML

<script src="http://www.rnrlabs.com.ar/js/jquery/jquery.form.min.js"></script>
<form class="img-upload-frm" id="formid" action="http://www.rnrlabs.com.ar/api/Image/Upload" method="post" enctype="multipart/form-data">
			<input type="file" class="hidden-handleevents" style="visibility: hidden; display:none;" id="fileuploaderid" accept="image/*" name="file">
			<button type="button" id="btnid">ABRIR</button>
</form>

<IMG ID="imageid">

JavaScript

$(document).ready(function() {
		
		var options = {
			dataType: 'json',
			error: function(result) {
		    	$('#fileuploaderid').prop( "disabled", false );
		    },
		    success:  function(result) {
		    	$('#fileuploaderid').prop( "disabled", false );
		    	if (result["result"] === "failure") {
		    			alert("Sever Error " + result["error"] + ", try again.");
		    			return;
		    	}
		    	var image = "http://www.rnrlabs.com.ar" +  result['imageurl'];
                
                //alert(image);
                
                $('#imageid').attr("src", image);
			}
		}; 
		
		$('#btnid').click(function (event) {
			$('#fileuploaderid').click();	
		});
		
		$('#fileuploaderid').change(function (event) {
			$('form#formid').ajaxSubmit(options);
			$('#fileuploaderid').prop( "disabled", true );	
		});
		
		
	});