Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Categories

Autcomplete for dynamically created i/p box

chocoboychocoboy Member Posts: 3
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

  • chocoboychocoboy Member Posts: 3
    [code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">






    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]
  • CyGuyCyGuy Member Posts: 312
    : 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]
    :
    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
  • chocoboychocoboy Member Posts: 3
    I wld like the input box as it is....but u may use any other autcomplete on these i/p boxes.... plz help me in this regard
  • CyGuyCyGuy Member Posts: 312
    Oh, I see now. Previous missing my read of td3.appendChild (tt3)...
    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
Sign In or Register to comment.