티스토리 뷰

정보 보관 ver1.0

일부 구역을 감추거나 보여주기(toggle)

James Wetzel 2013. 6. 8. 13:47

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<List<EmptyMvcApplication.Models.Entity.MountainInfo>>" %>


<!DOCTYPE html>


<html>

<head runat="server">

    <meta name="viewport" content="width=device-width" />

    <script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {          

            $("#heightinmetersToggle").click(function () {

                $("#summits td:nth-child(2)").toggle();

            });

        });

    </script>

    <style type="text/css">

        table, table td { padding: 30px; border-spacing: 0;}            

    </style> 

    <title>Zebra</title>

</head>

<body>    

    <div id="summits">        

        <label><%: Html.CheckBox("heightinmetersToggle") %>HeightInMeters Hidden</label>

        <table>

            <thead>

                <tr>

                    <td>Item</td>

                    <td>Height</td>

                    <td>Actions</td>

                </tr>

            </thead>

            <% foreach (var item in Model) 

                {

            %>

                <tr>

                    <td><%: item.Name %></td>

                    <td><%: item.HeightinMeters %></td>

                    <td>

                        <% using (Html.BeginForm("ZebraDelete", "AjaxSample", FormMethod.Post))

                           { %>

                        <%: Html.Hidden("itemID", item.No)%>

                        <%: Html.Hidden("itemName", item.Name) %>

                        <input type="submit" value="Delete" />

                        <% } %>

                    </td>

                </tr>                    

            <%       

                } 

            %>            

        </table>        

    </div>

</body>

</html>



728x90
반응형
저작자표시 비영리 동일조건 (새창열림)