JSFiddle - React, Tailwind, and code Playground
HTML
<input type='text' id='short'>
<input type='button' id='shorten_btn' value='shorten'>
JavaScript
var $short = $("#short"),
$btn = $("#shorten_btn"),
url;
$btn.on('click', function (e) {
url = $short.val();
shorten();
});
function shorten() {
alert("SHORTENING");
$.ajax({
url: '/your_script.php', // Pointed at your php script
type: 'POST', // Or GET - totally optional
data: 'url=' + url, // Your args
dataType: 'text', // Define the type of data you will get back
success: function (data) {
// Data should be your echoed data
// This is faking it
$short.val(data);
}
});
}