I'm currently trying to modify 2 scripts to work together. I've gotten everything working except the script isn't passing any, or the incorrect information when it's trying to create a checkbox. Here's the code I have so far:

if (strlen($q)>0)
{
$hint="";
for($i=0; $i<($x->length); $i++)
  {
  $f=$x->item($i)->getElementsByTagName('id');
  $g=$x->item($i)->getElementsByTagName('item');
  $h=$x->item($i)->getElementsByTagName('price');
  $y=$x->item($i)->getElementsByTagName('keyword');
  if ($y->item(0)->nodeType==1)
    {
    //find a link matching the search text
    if (stristr($y->item(0)->childNodes->item(0)->nodeValue,$q))
      {
      if ($hint=="")
        {
        $iteration = 0;
        $hint="<a id='item' href='javascript:void(0)' onClick='add()'>" . 
        $g->item(0)->childNodes->item(0)->nodeValue . "</a>";
        }
      else
        {
        $iteration++;
        $hint=$hint . "<br /><a id='item' href='javascript:void(0)' onClick='add()'>" . 
        $g->item(0)->childNodes->item(0)->nodeValue . "</a>";
        }
      }
    }
  }
}

The code "$g->item(0)->childNodes->item(0)->nodeValue" is the name of whatever item is being pulled at the current time.

Here's the javascript function for creating the checkboxes:

<script>
var i=0;
function add(){  
if (document.getElementById('item').value!='') 
    {     
        i++;  
        var title = document.getElementById('item').value;
        var node = document.createElement('div');        
        node.innerHTML = '<input type="checkbox" id="check' + i + '" name="check' + i + '"><label for="check' + i + '">' + title + '</label>';       
        document.getElementById('container').appendChild(node); 
        }   
}
</script>

And the script is being used in this fasion:

<form>
    <input type="text" size="30" onkeyup="showResult(this.value)">
    <div id="livesearch"></div>
    </form>

If I'm not making the code clear, please comment on what needs to be clarified. Any help is appreciated!

Can you describe, without code, how you expect your form to work?

Is using jQuery out of the question?

You can't use the same id item for all the objects. The method getElementById always returned only the first object with that Id.
The <a> object doesn't have an value property. To get the text you need .innerText;

Try those changes:

$hint=$hint . "<br /><a id='item' href='javascript:void(0)' onClick='add(this)'>" . 
        $g->item(0)->childNodes->item(0)->nodeValue . "</a>";

And

var i=0;
function add(objA){    
        i++;  
        var title = objA.innerText;
        var node = document.createElement('div');        
        node.innerHTML = '<input type="checkbox" id="check' + i + '" name="check' + i + '"><label for="check' + i + '">' + title + '</label>';       
        document.getElementById('container').appendChild(node); 
}
Member Avatar for iamthwee

Recommend using jquery... it has a very nice DOM parser.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.