jquery - Hide/Show container panels in MVC using JQuery/Partial Views

Question

View:

1. When user selects an item from foreach loop the browse hides and selected container shows. When the user clicks the goback link it goes back to normal but after this it does not work with any other items in the list but only the first selected item.
2. I want to improve the above code to use partial views - pls can someone give me examples on how to do this using MVC 3 partial views or some code. thanks

Answer 1

问题是因为循环中有很多重复的id属性。这些必须是独一无二的。将它们更改为class属性，它应该可以工作：

<div id="panel2" class="span4">            
    <table class="table">
        <tbody>
            @foreach(x item in Model) {
                <tr class="tableBody">
                    <td><u><a class="data" href="#">@item.Name </a></u></td>
                </tr>
            }
        </tbody>
    </table>
</div>

$(".data").click(function (e) {
    e.preventDefault();
    $('#BrowseContainer').hide();
    $('#SelectedContainer').show();
    var txt = $(e.target).text();
    alert(txt);
});

示例小提琴