用jQuery获取th的id

Question

I have this table:

  <th id="a" width="250">Backlog</th>
  <th id="b" width="250">Wip</th>
  <th id="c" width="250">Testing</th> 
  <th id="d" width="250">DOD</th>
</tr>

My requirement

I have 4 columns backlog, WIP, Testing, DOD. If I drag from Backlog to Testing I want to get drop columns id. Ie. i want to save it to database. I tried this:

jQuery(function() {
  jQuery(".draggable").draggable({
    containment: "#containment-wrapper",
    scroll: false,
    stop: function(event, ui) {
      // Show dropped position.
      var id = $(this).attr('id');
      var trid = $(this).closest('tr').attr('id');
      alert(trid);
      var Stoppos = $(this).position();
      model = {
        id: id,
        left: Stoppos.left,
        top: Stoppos.top
      };

      $.ajax({
        url: "/scrum/save",
        type: "post",
        data: model,
        success: function(data) {
          jQuery.HP({
            title: "Success!",
            message: "Saved..."
          });
        },
        error: function() {
          //  alert('error is saving');
        }
      });
    }
  });
});

I tried this to get id of current column, but it didn't work.

var trid = $(this).closest('th').attr('id'); alert(trid); 

How can I get dropped id?

Answer 1

If you clicked the <th> then you should get the id via the following line:

var id=$(event.target).attr('id');

(In case you click on an element withint an element that contains the event, use "currentTarget", instead of "target").

If you click on something else, then you need to navigate there via Parent()/Child() or other measures. Do you have the HTML? And which element if HTML is returned when using $(event.target) ?