I have an input box "product" besides it there is an add input button which adds another input box product upon clicking.This array of input boxes I have created is through document.createElement('input').
My autocomplete is working for the initial input box....now when I click add Input button for the generated box also the autocomplete shld work...how do I make it work??
[B]PS:Autocomplete script is working so I didnt post it here.... I just want it to make it working dynamically created i/p boxes[/B]
Comments
Golden Collection
#mainContainer{
width:660px;
margin:0 auto;
text-align:left;
height:100%;
background-color:#FFF;
border-left:3px double #000;
border-right:3px double #000;
}
#formContent{
padding:5px;
}
/* END CSS ONLY NEEDED IN DEMO */
/* Big box with list of options */
#ajax_listOfOptions{
position:absolute; /* Never change this one */
width:175px; /* Width of box */
height:250px; /* Height of box */
overflow:auto; /* Scrolling features */
border:1px solid #317082; /* Dark green border */
background-color:#FFF; /* White background color */
text-align:left;
font-size:0.9em;
z-index:100;
}
#ajax_listOfOptions div{ /* General rule for both .optionDiv and .optionDivSelected */
margin:1px;
padding:1px;
cursor:pointer;
font-size:0.9em;
}
#ajax_listOfOptions .optionDiv{ /* Div for each item in list */
}
#ajax_listOfOptions .optionDivSelected{ /* Selected item in the list */
background-color:#317082;
color:#FFF;
}
#ajax_listOfOptions_iframe{
background-color:#F00;
position:absolute;
z-index:5;
}
form{
display:inline;
}
function addRow1(id){
var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
var row = document.createElement("TR")
var td2 = document.createElement("TD")
var tt2 = document.createElement('input')
tt2.type = 'text'
tt2.value = ''
tt2.size = '45'
tt2.name = 'prod_name[]'
td2.appendChild (tt2)
var td3 = document.createElement("TD")
td3.setAttribute('align','left')
var tt3 = document.createElement('input')
tt3.type = 'button'
tt3.value = 'Remove'
tt3.name = 'bttn'
tt3.onclick=function(){removeRowFromTable1(this);};
td3.appendChild (tt3)
row.appendChild(td2);
row.appendChild(td3);
tbody.appendChild(row);
}
function removeRowFromTable1(obj){
var tbl = document.getElementById('exp1254911560');
var par=obj.parentNode;
par=par.parentNode;
var tt = par.rowIndex;
tbl.deleteRow(par.rowIndex);
}
Product Name *
[/code]
: button which adds another input box product upon clicking.This array
: of input boxes I have created is through
: document.createElement('input').
:
: My autocomplete is working for the initial input box....now when I
: click add Input button for the generated box also the autocomplete
: shld work...how do I make it work??
:
: [B]PS:Autocomplete script is working so I didnt post it here.... I
: just want it to make it working dynamically created i/p boxes[/B]
:
Not knowing the browser ur using, here is the problem in major browser
[code] i= (b) ? "input" : "";
var ri=document.createElement(i);
var r=document.Form.appendChild(ri);[/code]
then use the variable r as the dom instantiated object to set attributes and what-not
PS stay away from those tables, but if you must; I have code for that too
[green]WHAT you;see_is_what=you.get;[/green]
-Russ aka DangeRuss
So the line before that having .onclick function to remove row. due the same with the event handling code = element.onkeyup function to AJAX the autocomplete like the other input box. Sorry if Im still confused... is this what you need?
[green]WHAT you;see_is_what=you.get;[/green]
-Russ aka DangeRuss