Current object value in jquery

Question

All,

in the below code How to edit the current added value.i.e, in the edit function how to get the value in td .Also how can we check for duplicates.

  <script type="text/javascript">
  function edit(obj)
  {
     //   var ele= obj.parentNode ;
        alert(obj.innerHTML);
     var htm = '<textarea name="modal" id="modal" rows="10" cols="10" >'+ele.html+'</textarea>';
     $dialog.html(htm)
           .dialog({
              autoOpen: true,
              position: 'center' ,
              title: 'EDIT',
              draggable: false,
              width : 300,
              height : 400,
              resizable : false,
              modal : true,
              buttons: { "Save" : function() { if($('#modal').val() != ''){ obj.innerHTML=$('#modal').val() ;$dialog.dialog('close');} else {alert('i++'+$('#modal').val()+'++');} } }
           });
     $dialog.dialog('open');
  }


  $(document).ready(function() {
        var flag=0;

              if (flag == 0)
              {
                 var html = '<input type="text" name="val" id="val" />&nbsp;&nbsp;&nbsp;<input type="button" value="Add" id="add"><br>';
                 $('#useroptions').append(html);
                 flag=1;

                 $('#add').click(function(){
                    var a = $('#val').val();
                    if (a == '')
                    {
                       alert('Enter options');
                    }
                    else
                    {
                       var section= '<tr class="clickable"><td id="userval" BGCOLOR="#FF6699">' + a + '&nbsp;&nbsp;&nbsp; <IMG SRC="edit.gif" onclick="javascript:edit(this);" >&nbsp;&nbsp;&nbsp;<IMG SRC="close.gif"
  onclick="javascript:del(this);" ></td></tr>';
                       $('#useroptions').append(section);
                    }
                      }
  }
  });
  });
  </script>

<table id="template">
<tr><td>
<div id="useroptions"></div>
</tr></td>

</table>

Answer 1

First off: you're mixing clunky inline onXXX handlers with more elegant jQuery event handlers. Why?

As for your "how to get the value in td" question: your edit(obj) will get the image passed as as the obj parameter, since the onclick is on the img element. You can find the container td like this: var td = $(obj).closest('td'). Then get its .text() or whatever you want.

But again: you could do this better using live binding.