0
테이블에서 행을 제거 할 때 문제가 있습니다. 나는 2 개의 테이블을 하나씩 가지고 있기 때문에 jquery.each를 사용하고 각 루프에서 $ (value) .remove()를 사용했다.jquery로 테이블 행을 제거하는 방법은 무엇입니까?
이제 사용자가 한 번에 한 행을 삭제하는 다른 테이블이 있습니다. 그래서 나는 똑같은 일을 할 것이라고 생각했습니다.
('#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 루프에서 작동합니다.
"행"방식은 어디입니까? 어떤 일이 발생하면 테이블의 모든 행이 삭제됩니다. 여기
내가 .. 이유를 이해
감사하지 않는
편집 테이블입니다. 나는 ('내가 asp.net의 MVC를 사용하고 있지만 무엇에 내가 돈 때문에 전환 할 수 있습니다 "이"
여기
<%@ 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>
http://abeautifulsite.net/notebook/87는 컨트롤러 여기 살해되는이 JQuery와 경고 플러그인 생각 서버 쪽이 문제를 일으킬 것이라고 생각하지 마십시오.)
// 동일한 컨트롤러에서. 색인보기는 위의 모든 html을 가지고 있습니다. 테스트가 호출됩니다.
public ActionResult Index()
{
return View();
}
public ContentResult Test()
{
return Content("hi");
}
row.remove()을 삭제하고, 당신이 기대하는대로 하나의 테이블 행에 있지 않습니다.TheVillageIdiot에서 설명한대로 및 내 자신의 답변에서 click 이벤트를 발생시킨 특정 img를 0으로 설정하려면이 키워드를 사용하십시오. –
내가 null 참조를 얻기 전에 말했던 것처럼. 내가 실제로하는 일에 실제로 놀랐기 때문에 당신이 말하는 것은 의미가 있습니다. 내가 그것을보고있을 때 왜 나는 단지 하나의 행을 얻고 모든 것이 아닌지 궁금해했다. 그러나 html을 출력 할 때 한 행만 포함합니다. 왜 그것은 단지 하나의 행을 보여줍니까? – chobo2
HTML을 추가해 주셔서 감사합니다. var row = ... 행을 var row = $ (this) .parents ('tr')로 변경하면 더 나은 결과를 얻을 수 있습니다. 이 작업에서 둘 이상의 테이블 행을 수집 중입니다. –