Противоположность добавления в эту таблицу, используя jquery - PullRequest
Новая
       7

Противоположность добавления в эту таблицу, используя jquery

2 голосов
/ 19 августа 2011

Мне нужно противоположное этой части кода: 

if( $('#effort_<%= @project_task.id %>').length == 0 )
  $('#task_list').append('<tr><td><%= @project_task.project.project_number %> <%= @project_task.project.project_name %> - <%= @project_task.task_name %></td>' +
                         '<td><%= text_field :effort, :hours, :name => 'effort_' + @project_task.id.to_s, :id => 'effort_' + @project_task.id.to_s %></td>' +
                         '<td><%= link_to image_tag('icons/delete.png'), :method => :destroy, :remote => true %></td></tr>' );
  $('#effort_<%= @project_task.id.to_s %>').change( function() { submiteffort( this, <%= @project_task.id.to_s %>); } );

когда пользователь нажимает кнопку удаления, ему нужно удалить эту строку таблицы. Я знаю, что вы можете использовать .remove (), но я не уверен, как это использовать, так как я новичок в RoR.

Ответы [ 4 ]

2 голосов
/ 19 августа 2011

Вы можете сделать что-то вроде этого: 

$("#task_list a").live("click", function(event) {
  $(event.target).closest("tr").remove();
});

Убедитесь, что вы используете closest.parents вернет всех предков tr s, поэтому он может удалить больше узлов, чем необходимо, если у вас есть вложенные таблицы.closest - самый безопасный вариант.

1 голос
/ 19 августа 2011

при условии, что ваше удаление находится внутри tr для каждой из строк, которые вам нужно сделать что-то вроде этого

, если у кнопки закрытия / изображения есть класс close, тогда свяжите событие с ним, как это 

$('close').live("click",function()
{
    $(this).parents("tr").remove();   //this here is referring to the button 
});
0 голосов
/ 19 августа 2011

Вы можете использовать метод parent (добавить несколько идентификаторов), чтобы указать строку, которую хотите удалить, и затем использовать метод remove , чтобы фактически удалить ее.

0 голосов
/ 19 августа 2011

Вот базовый пример того, как вы хотите сделать. Надеюсь, вы не возражаете, но я раздели его до гола, но это должно дать вам хорошее представление о том, с чего начать.

JSFiddle: http://jsfiddle.net/saceh/1/

<button id="Add">Add Row</button>
<hr>
<table id="TaskList">
</table>

<script>
// RowId is not important, just used to show you that rows are dynamically added
var RowId = 0;

$("#Add").click(function (e) {
    $("#TaskList").append("<tr><td>" + RowId  + "</td><td><button id='Delete'>Delete</button></td></tr>");
    RowId++;
});

$("#Delete").click(function(e) {
   var Row = $(this).parents('tr');
   $(Row).remove(); 
});

Когда нажата кнопка «Удалить», она находит родительскую строку и удаляет ее, а «Добавить» делает нечто похожее на то, что вы делаете в данный момент.

...