Untitled

<%@ taglib uri = "http://java.sun.com/jsp/jstl/core" prefix = "c" %>

<!DOCTYPE html>
<html lang="ro">
  <head>
 	 <!-- Required meta tags -->
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

     <title>Imagini</title>
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
       	<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
  </head>

  <body>
  	<div class="container mt-3">
  		<div class="row">
  			<div class="col-6 text-center mx-auto">
  			<form id="formular" action="<c:url value="/main/cauta"/>" method="post">
  					<input type="hidden" value="${csrf}" name="csrf">
		  			 <div class="form-group">
		  				<label class="form-label">Text</label>
		  				<input id="text" required name="text" class="form-control">
		  			</div>
		  	</form>
  			<a href="<c:url value="/html/f1.html" />">link</a>
  			</div>
  		</div>
  		  	<div class="col-6 text-center mx-auto">
  				<h3>Rezultate</h3>
  				<table id="rezultate" class="table table-bordered">
  					<thead>
  						<tr>
  							<th>text<th>
  							<th>Link</th>
  						</tr>
  					</thead>
  					<tbody>
					</tbody>
				</table>
  			</div>
  	</div>
  		<script>

		$(function() {
			$('#text').keyup(function() {
				var form = $('#formular');
				var text = $(this).val();
				$.post({
					url: form.attr('action'),
					data: form.serialize(),
					dataType: 'json',
				}).done(function(data) {
					console.log(data.fisiere);

					$.each(data.fisiere, function(index, data) {
						var row = $("#rezultate").append('<tr><td data-text='+text+'>'+text+'</td><td><a class="link" target="_blank" data-text='+text+' href="<c:url value="/html/'+data.fisier+'" />">link</a></td></tr>');
					});
				});
			});
			$('a').click(function (event) {
				event.preventDefault();
				var cuvant = $(this).data("text");
				console.log(cuvant);
				$.post({
					url: "<c:url value="/main/adauga"/>",
					data: {
						cuvantC : cuvant
					},
					dataType: 'json',
				});
			});
		});
	</script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
  </body>
</html>