| Server IP : 104.21.21.239 / Your IP : 216.73.216.11 Web Server : Apache/2.4.68 (Amazon Linux) OpenSSL/3.5.5 System : Linux ip-172-31-69-123.ec2.internal 6.1.176-223.369.amzn2023.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Jul 24 13:34:27 UTC 2026 x86_64 User : ec2-user ( 1000) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : ON Directory : /home/mitzvahm/planner/ |
Upload File : |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
INPUT[type="text"] {
background-color:#FBD9E7;
border: 1px solid #E93F86;
width:300px;
font-size:14px;
padding:1px;
}
INPUT[type="text"].autocomplete {
position:absolute;
left:0px;
top:0px;
background-image:url(img/arrow_down.png);
background-position:center right;
background-repeat:no-repeat;
}
DIV.autocomplete {
position:relative;
width:304px;
height:20px;
}
DIV.autocomplete_items {
position:absolute;
left:0px;
top:18px;
display:none;
max-height:250px;
overflow-x:auto;
overflow-y:scroll;
background-color:#FBD9E7;
border: 1px solid #E93F86;
width:300px;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
padding:1px;
}
DIV.autocomplete_items LI {
cursor:pointer;
}
</style>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script>
autocomplete_toggle = function()
{
//if ($('#aitext1').is(':focus'))
//alert($('#ai1').attr('ac_open'));
if ($('#ai1').attr('ac_open') == '1')
{
//autocomplete_close();
}
else
{
//autocomplete_open();
}
}
autocomplete_open = function()
{
$('#ai1').show().scrollTop(0);
setTimeout(function() {$('#ai1').attr('ac_open','1');},200);
}
autocomplete_close = function()
{
setTimeout(function() {$('#ai1').hide(); $('#ai1').attr('ac_open','0');},200);
//$('#ai1').hide();
}
autocomplete_pick = function(text)
{
//alert(text);
$('#aitext1').val(text);
}
autocomplete_filter = function()
{
var filter = $('#aitext1').val();
if (filter)
{
$('#ai1 li:not(:contains(' + $('#aitext1').val() + '))').slideUp(50);
$('#ai1 li:contains(' + $('#aitext1').val() + ')').slideDown(50);
}
else
{
$('#ai1 li').slideDown(50);
}
}
</script>
</head>
<body>
<form>
<table border="1">
<tr>
<td bgcolor="#00FF33">
<div class="autocomplete">
<input type="hidden" id="" name="" />
<input type="text" class="autocomplete" id="aitext1" name="aitext1" onfocus="autocomplete_open()" onblur="autocomplete_close()" onkeyup="autocomplete_filter()" onclick="autocomplete_toggle()" />
<div class="autocomplete_items" id="ai1">
<li onclick="autocomplete_pick('Item 1');">Item 1</li>
<li onclick="autocomplete_pick('Item 2');">Item 2</li>
<li onclick="autocomplete_pick('Item 3');">Item 3</li>
<li onclick="autocomplete_pick('Item 4');">Item 4</li>
<li onclick="autocomplete_pick('Item 5');">Item 5</li>
<li onclick="autocomplete_pick('Item 6');">Item 6</li>
<li onclick="autocomplete_pick('Item 7');">Item 7</li>
<li onclick="autocomplete_pick('Item 8');">Item 8</li>
<li onclick="autocomplete_pick('Item 9');">Item 9</li>
<li onclick="autocomplete_pick('Item 10');">Item 10</li>
<li onclick="autocomplete_pick('Item 11');">Item 11</li>
<li onclick="autocomplete_pick('Item 12');">Item 12</li>
<li onclick="autocomplete_pick('Item 13');">Item 13</li>
<li onclick="autocomplete_pick('Item 14');">Item 14</li>
<li onclick="autocomplete_pick('Item 15');">Item 15</li>
<li onclick="autocomplete_pick('Item 16');">Item 16</li>
<li onclick="autocomplete_pick('Item 17');">Item 17</li>
<li onclick="autocomplete_pick('Item 18');">Item 18</li>
<li onclick="autocomplete_pick('Item 19');">Item 19</li>
</div>
</div>
</td>
</tr>
<!--
<tr>
<td>
<input type="text" id="aitext2" name="aitext2" />
</td>
</tr>
-->
</table>
</form>
<br />
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec feugiat at est sit amet blandit. Pellentesque auctor velit nec ultricies porttitor. Donec aliquet sagittis lectus, non pharetra ipsum rhoncus vel. Sed sagittis nunc et justo venenatis pulvinar. Maecenas pellentesque tortor a porttitor interdum. Duis convallis lacinia lectus, aliquam adipiscing sem tempor consectetur. Vivamus id ultricies ante, non euismod magna. In sit amet pulvinar sem, ut mollis orci. Quisque accumsan ligula neque, vel commodo dolor venenatis euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla ornare ornare elit, sed viverra sem auctor sit amet. Duis posuere ultrices nisi vitae bibendum. Aenean aliquam dui ut placerat placerat. Nulla sit amet scelerisque augue.
Aliquam vitae mauris ac lorem sollicitudin tempus. Curabitur nec tortor sodales, porttitor urna eu, porttitor magna. Sed molestie viverra nisi a ullamcorper. Quisque facilisis dapibus laoreet. Fusce facilisis fermentum consequat. Maecenas volutpat purus sed bibendum iaculis. Praesent ultrices nunc diam, sed semper diam mollis non. Ut posuere arcu eu ipsum gravida viverra. Morbi rutrum enim a massa malesuada, nec rhoncus orci tempus. Donec at odio egestas nibh consectetur iaculis vitae in massa. Pellentesque erat urna, pretium eu porta in, vestibulum a lorem. Aliquam ut justo ligula. Pellentesque vel sollicitudin sapien.
Nunc massa arcu, imperdiet id dolor vel, aliquam suscipit risus. Quisque condimentum nisi ullamcorper, fermentum tortor quis, euismod ligula. Sed luctus imperdiet augue, vestibulum mattis enim facilisis et. Quisque tempus accumsan orci in luctus. Nulla ut sem nisl. Donec tristique, turpis vel sagittis malesuada, felis nibh varius diam, auctor facilisis lacus mi ut lectus. Fusce lacinia et nulla ac pretium. Nunc ut orci suscipit, luctus ligula non, hendrerit ante. Quisque leo quam, rhoncus sit amet ullamcorper et, consectetur at ipsum. Donec pharetra elementum varius. Vestibulum vel quam commodo, elementum nisi quis, vulputate lectus. Proin imperdiet nulla dignissim, tristique velit quis, rhoncus lacus. Etiam laoreet erat quis neque sodales scelerisque. Praesent vitae suscipit mi.
Nulla condimentum adipiscing auctor. Cras porttitor placerat neque et lobortis. Vestibulum pulvinar, mi id tempus tincidunt, purus erat bibendum justo, nec condimentum purus felis non leo. Nullam tristique, sapien in malesuada vulputate, mi nisl elementum nisi, at porta tellus elit nec orci. Maecenas ac sodales orci. Integer consequat, eros ut lobortis aliquet, metus eros rhoncus metus, sed tempus nibh mauris a tortor. Phasellus velit justo, gravida vitae sapien sodales, tincidunt dapibus mi. Vestibulum varius mi ut cursus cursus. Nullam porttitor ornare laoreet.
Donec eget venenatis arcu. Donec faucibus ullamcorper orci vitae aliquet. Suspendisse placerat iaculis aliquam. Suspendisse condimentum risus quis mauris egestas suscipit. Aenean eu pretium dolor. Sed sit amet lorem mattis mi adipiscing volutpat at a nisi. Phasellus ac vulputate tortor, sed vestibulum orci. Cras placerat mattis cursus.
</body>
</html>