Javascript jquery AutoComplate İnput not Working .I can try but not this. Add package link but AutoComplate İnput not Working. I want only add pack after autocomplete input working. Only this..I think insertCell Hard this.I dont understend this. id ='dap'
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<title></title>
</head>
<body>
<script>
$(function() {
var availableTags = [
"arta",
"barta",
"barta2",
];
$("#dap").autocomplete({
source:availableTags
});
});
</script>
<form method="post" action="add.php">
<table id="table1">
<tr>
<br>
<td colspan="4"><a onclick="myFunction1()" style=" color: #000; margin-top: 10px" ><i></i> Paket Ekle</a> <a onclick="myDeleteFunction1()" style="color: #000; margin-top: 10px" ><i ></i> Paket Sil</a></td>
</tr>
<tr>
<td valign="bottom"><strong>GTIP No.</strong></td>
</tr>
<tr>
<td><input name="dap" type="text" style="width:90%; margin-top: 15px"></td>
<script>
var i = 1;
function myFunction1() {
var table = document.getElementById("table1");
var row = table.insertRow(-1);
var cell1 = row.insertCell(0);
cell1.innerHTML = "<input name='dap" i "' id='dap' type='text' style='width:90%;margin-top:15px;' >";
i ;
}
function myDeleteFunction1() {
document.getElementById("table1").deleteRow(-1);
}
</script>
</table>
</form>
</body>
</html>CodePudding user response：
You can use on to bind event on dynamically added element
$(function() {
var availableTags = [
"arta",
"barta",
"barta2",
];
$(document).on('keydown.autocomplete', '#dap', function() {
$(this).autocomplete({
source: availableTags
});
});
});<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<title></title>
</head>
<body>
<form method="post" action="add.php">
<table id="table1">
<tr>
<br>
<td colspan="4"><a onclick="myFunction1()" style=" color: #000; margin-top: 10px"><i></i> Paket Ekle</a> <a onclick="myDeleteFunction1()" style="color: #000; margin-top: 10px"><i ></i> Paket Sil</a></td>
</tr>
<tr>
<td valign="bottom"><strong>GTIP No.</strong></td>
</tr>
<tr>
<td><input name="dap" type="text" style="width:90%; margin-top: 15px"></td>
<script>
var i = 1;
function myFunction1() {
var table = document.getElementById("table1");
var row = table.insertRow(-1);
var cell1 = row.insertCell(0);
cell1.innerHTML = "<input name='dap" i "' id='dap' type='text' style='width:90%;margin-top:15px;' >";
i ;
}
function myDeleteFunction1() {
document.getElementById("table1").deleteRow(-1);
}
</script>
</table>
</form>
</body>
</html>