У меня проблемы с удалением строки из таблицы. У меня есть 2 таблицы, одна требует, чтобы я удалил количество строк X, поэтому я использовал jquery.each, и в каждом цикле я просто использовал $ (value) .remove (), и это работает.
Теперь у меня есть другая таблица, в которой пользователь удаляет по одной строке за раз. Поэтому я подумал, что сделаю то же самое.
('#MyTable tbody tr td img:even').click(function()
{
// check if they are sure if they want to delete. If true go on
// now get this row they clicked on
var row = $('#MyTable tbody tr td img:even').parents('tr');
// do some ajax stuff
$(row).remove();
});
Так что я подумал, что это сработает, поскольку это похоже на то, что я делал с циклом jquery. Я проверил, что находится в «строке», выполнив alert ($ (row) .html ());
Это приводит к строке, которую я хочу удалить. Я сделал то же самое для «значения» в каждом цикле jquery (таблица у меня есть). Он также содержит строку для удаления.
Так что для меня они оба одинаковы, так как они выплевывают строку таблицы. Но тот, что в цикле jquery, работает.
Где это «ряд», пути нет. Что происходит, это удаляет все строки в таблице.
Я не понимаю, почему ..
Спасибо
Отредактируйте здесь таблицу. Я думаю, что этот плагин JQuery оповещения убивает "это"
найдено здесь http://abeautifulsite.net/notebook/87
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
#popup_container
{
font-family: Arial, sans-serif;
font-size: 12px;
min-width: 300px; /* Dialog will be no smaller than this */
max-width: 600px; /* Dialog will wrap after this width */
background: #FFF;
border: solid 5px #999;
color: #000;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
#popup_title
{
font-size: 14px;
font-weight: bold;
text-align: center;
line-height: 1.75em;
color: #666;
background: #CCC url(Images/Alerts/title.gif) top repeat-x;
border: solid 1px #FFF;
border-bottom: solid 1px #999;
cursor: default;
padding: 0em;
margin: 0em;
}
#popup_content
{
background: 16px 16px no-repeat url(Images/Alerts/info.gif);
padding: 1em 1.75em;
margin: 0em;
}
#popup_content.alert
{
background-image: url(Images/Alerts/info.gif);
}
#popup_content.confirm
{
background-image: url(Images/Alerts/important.gif);
}
#popup_content.prompt
{
background-image: url(Alerts/help.gif);
}
#popup_message
{
padding-left: 48px;
}
#popup_panel
{
text-align: center;
margin: 1em 0em 0em 1em;
}
#popup_prompt
{
margin: .5em 0em;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.alerts.js"></script>
</head>
<body>
<table class="class" id="MyTable">
<thead>
<tr>
<th>
</th>
<th>
Header 1
</th>
<th>
Header 2
</th>
<th>
Header 3
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<a>
<img alt="" src="img1">a</a><a><img alt="" src="img2">b</a>
</td>
<td>
1
</td>
<td>
2
</td>
<td>
3
</td>
</tr>
<tr>
<td>
<a>
<img alt="" src="img1"></a>c<a><img alt="" src="img2">d</a>
</td>
<td>
4
</td>
<td>
5
</td>
<td>
6
</td>
</tr>
</tbody>
</table>
</body>
</html>
<script type="text/javascript">
$(document).ready(function()
{
$('#MyTable tbody tr td a:odd').live("click", function()
{
jConfirm('Do you wish to delete?.', 'Deletion', function(d)
{
if (d == true)
{
var row = $(this).parents('tr');
// can maybe omit this. Problem might be with jConfirm.
$.post("Test", null, function(r)
{
row.remove();
});
}
});
});
});
</script>
Вот контроллер (я использую asp.net mvc, но вы можете переключиться на что угодно, так как не думаю, что проблема возникнет на стороне сервера).
// В том же контроллере. Индексный просмотр имеет все вышеупомянутые HTML. Тест это то, что называется.
public ActionResult Index()
{
return View();
}
public ContentResult Test()
{
return Content("hi");
}