JSFiddle - React, Tailwind, and code Playground

by mohammadAdil

HTML

<div id='delete'>
    <form id='fform'> 
        <span class='front15'>Enter your name </span>

        <input type='text' id='tf' placeholder='name' />
        <input type='submit' id='get_button' value='Get' text='Get'>
    </form>
</div>

CSS

#tf{
	width: 100px;
	height: 32px;
	font-size: 15px;
	direction: ltr;
	border: 1px solid #b9b9b9;
	border-top: 1px solid #a0a0a0;
	margin: 0;
	padding: 0 8px;
	line-height: 32px\9;
}
.clr {
	clear: both;
	height: 1px;
	overflow: hidden;
}
#get_button {
	background-color: #4D90FE;
	color: white;
	height: 32px;
	width: 65px;
	border: none;
	font: 13px arial, helvetica, sans-serif;
	font-weight: bold;
	cursor: pointer;
	border: 1px solid #3079ED;
	text-shadow: 0 1px rgba(0, 0, 0, 0.3);
}

JavaScript

$('body').on('submit','#fform',function(){ 

		
    
$('#delete').html("<span class='front'>Processing...</span>").slideDown('slow');
		/*$.ajax({
			  type: 'GET',
			  url: 'test.php',
			  data: { 
			        'url': tf
			    },
			    success: function(data){
				  
			      }
			});*/

		return false;
		});