0

強く型付けされていない部分的なビューがあります。それは動的です:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>

<%@ Import Namespace="Student.Models" %>

<div>
<table id="TA">
        <tr>
            <th>Teaching Assistant</th>
            <th>Course ID</th>
            <th>Day</th>
            <th>Delete Row</th>
        </tr>
</table>
</div>

<div>
<table id="StudentAction">
    <tr>
       <td><select name="TeachingAssistant"></select> </td>
       <td><select name="CourseID"></select></td>
       <td><select name="Day"></select></td>
       <td><input name="delete" type="image" src="/delete.png"  onclick="javascript:delete('this')"/></td>
   </tr>

</table>
</div>

ここで、「TeachingAssistant」選択リストから新しい値が選択されるたびに、JQueryを使用して新しい行を追加します。

また、クリックするとその特定の行を削除する削除画像があります。クリックした画像の削除に基づいて特定の行を識別するにはどうすればよいですか?たとえば、3行目の画像の削除をクリックした場合、3行目を識別してJQueryに送信するにはどうすればよいですか?たとえば、削除画像がクリックされた行を特定し、それを以下のJQueryの削除機能に送信したい場合、「this」を使用しても機能しません。これを行う他の方法はありますか?繰り返しますが、これは強く型付けされたビューではなく、動的です。

function delete(val) {

    $(this).parent().remove();

}

どんな助けでもいただければ幸いです。

4

2 に答える 2

1

イベントをトリガーするクラスを追加します。

<td><input name="delete" type="image" src="/delete.png" class="delete"/></td>

次に、 を使用closestしてその行を取得します。

$('#StudentAction').on('click', '.delete', function() {
    $(this).closest('tr').remove();
});

デモ

または古いバージョンの場合:

$('#StudentAction .delete').live('click', function() {
    $(this).closest('tr').remove();
});
于 2012-08-07T23:54:45.433 に答える
0

テーブルと同じ html ページで deleteThis 関数が定義されている場合。次に、以下が機能するはずです。

/* This will send the table row to deleteThis function */
<td>
    <input type =".." onclick="javascript:deleteRow($(this).parent().parent())"/>
</td>

$(this)要素を参照しinput、この入力要素の親はあなたtdに与え、tdの親はあなたにtr.

function deleteRow(val) {
    $(val).remove();

}

deleteThis 関数が外部の .js ファイルで定義されている場合は、こちらを確認してください。

tr 要素を関数に渡したいので、この解決策を提案しました。ただし$(this).parent().parent()見た目はかなりイマイチ。Ricardo Lohmann のソリューションを使用することをお勧めします。

于 2012-08-08T22:27:53.570 に答える