无法将div ID作为函数参数传递

Question

I want to give user options to edit title of navigation bar. So, when user would click edit, I want to give them a text field and a submit button.

Here is the code(within PHP block)

$n1="<div  id='nava' class='nav' >
      <a href=#>$nava</a>
      <input type='submit' id='nav1' class='b' onclick='edit(this.id,???)' value='Edit'>
     </div>";
$n2="<div  id='navb' class='nav' >
      <a href=#>$navb</a>
      <input type='submit' id='nav2' class='b' onclick='edit(this.id,???)' value='Edit'>
     </div>";
$n3="<div  id='navc' class='nav' >
      <a href=#>$navc</a>
      <input type='submit' id='nav3' class='b' onclick='edit(this.id,???)' value='Edit'>
     </div>";

if I do edit(this.id,nava),it gives me object DivElement message,when I do alert.

But I need the id of div as string.Passing the id of submit button works perfectly, but I cannot figure out how to pass the id of corresponding div to edit function. How would I do that?

Answer 1

parentNode is definitely the right way to go about getting the parent Div's id (without using a framework like JQuery). You can read more about it here: https://developer.mozilla.org/en/docs/Web/API/Node.parentNode

Back to your example, you could simply write a JavaScript edit() function like so:

function edit(id) {
    var divId = document.getElementById(id).parentNode.id;
    console.log(divId);
}

Using your HTML, I have put together a quick fiddle for you to show how this can work

http://jsfiddle.net/wj7bch3m/

Hope that helps!