Tuyển sinh

Các khóa học Lập trình Java chuyên nghiệp, ASP.NET MVC5, Lập trình viên mã nguồn mở PHP, MySQL & Laravel, Lập trình Python tuyển sinh hàng tháng tại Nghean-Aptech. Sinh viên theo dõi Lịch tuyển sinh để biết chi tiết.

    Khóa học Lập trình Python
    Khóa học Lập trình viên JAVA chuyên nghiệp
    Khóa học Lập trình viên Quốc tế ACCP i17
    Khóa học Lập trình .NET (Full Stack)
    Khóa học Lập trình PHP (Full Stack)     :

Thông báo học tập

   Thông báo nghỉ Tết Nguyên đán Canh Tý.
   Thông báo lịch nghỉ hè năm 2019.
   Lịch thi sinh viên tháng 05/2019.
   Thông báo nghỉ lễ 30/4 & 1/5/2019.
   Thông báo nghỉ Tết Kỷ Hợi 2019.

Nghean-Aptech

Trường Đào tạo Lập trình viên quốc tế Nghean–Aptech được thành lập trên cơ sở hợp tác trực tiếp giữa Tập đoàn APTECH (Ấn Độ) và Công ty CP Đào tạo Tư vấn Giáo dục Quốc tế INTEC.

    Giới thiệu Tập đoàn APTECH (Ấn Độ)
    Giới thiệu hệ thống Aptech Việt Nam
    Môi trường học tập

Sinh viên xuất sắc

Học viên tiêu biểu tháng 08/2017

Cập nhật: 11/9/2017.
Trường Đào tạo Lập trình viên Quốc tế Nghean-Aptech chúc mừng các sinh viên sau đã đạt thành tích cao trong học tập, rèn luyện và trong các hoạt động phong trào của nhà trường trong tháng 08/2016.

Học viên tiêu biểu tháng 05/2017.

Học viên tiêu biểu tháng 07/2016.

TIN TỨC & SỰ KIỆN | Lập trình | Jquery: Ẩn hiện nội dung ASP.NET Panel...

Jquery: Ẩn hiện nội dung ASP.NET Panel

Posted: 20/1/2010.
Chỉ với ba bước đơn giản theo sau sẽ giúp chúng ta có thể dễ dàng ẩn hoặc hiện panel sử dụng jQuery.

Chỉ với ba bước đơn giản theo sau sẽ giúp chúng ta có thể dễ dàng ẩn hoặc hiện panel sử dụng jQuery.

Bước 1: Tạo website ASP.NET C#

Bước 2: Trong phần <head> tham chiếu đến thư viện Jquery.

view plain copy to clipboard print ?

<head id="Head1" runat="server">
<title>Show Hide ASP.NET Panels in Different Ways</title>
<script type='text/javascript' src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js'>
</script>

Bước 3: Tạo giao diện để trình bày các hiệu ứng khác nhau, thêm một vài hyperlink và panel:

view plain copy to clipboard print ?

<body>
<form id="form1" runat="server">
<asp:HyperLink ID="Link1" runat="server" NavigateUrl="#">Using slideToggle
</asp:HyperLink><br />
<asp:HyperLink ID="Link2" runat="server" NavigateUrl="#">Using Toggle
</asp:HyperLink><br />
<asp:HyperLink ID="Link3" runat="server" NavigateUrl="#">Using Animate
</asp:HyperLink><br />
<asp:HyperLink ID="Link4" runat="server" NavigateUrl="#">Using slideUp and slideDown
</asp:HyperLink><br />
<asp:HyperLink ID="Link5" runat="server" NavigateUrl="#">Display Text
</asp:HyperLink>
<asp:Panel ID="panelText" runat="server" CssClass="panel">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc turpis nunc, placerat
ac, bibendum non, pellentesque nec, odio. Nulla fringilla aliquet nibh. Donec placerat,
massa id commodo ornare, justo lectus faucibus leo, in aliquam nisl quam varius
velit. Maecenas ullamcorper. Aliquam lectus metus, scelerisque ac, scelerisque vitae,
sodales eu, metus. Sed varius nisi sit amet turpis. Mauris a arcu iaculis risus
sodales dignissim. Aliquam ac risus. Donec turpis. Sed sit amet mi. Nam sem nunc,
suscipit quis, cursus non, facilisis nec, diam. Donec nec mi semper urna interdum
ultrices. Sed tellus. Sed sodales, quam sit amet dignissim ornare, orci velit blandit
augue, ut pretium diam pede eget felis. Maecenas turpis justo, dapibus non, scelerisque
et, consequat id, est. Mauris ornare. Donec posuere ligula et nulla. Quisque sollicitudin
libero vitae dolor.Curabitur elementum venenatis lectus. Class aptent taciti sociosqu
ad litora torquent per conubia nostra, per inceptos himenaeos. *** sociis natoque
penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam velit. Quisque
eros nisi, congue id, aliquam ac, interdum in, velit. Duis cursus tellus molestie
libero. Cras scelerisque pellentesque nisl. Phasellus adipiscing pretium mi. Curabitur
faucibus nisl sit amet ante. Pellentesque lacinia erat a nisi molestie lacinia.
In erat metus, tincidunt id, consequat nec, blandit bibendum, quam. Nunc a tortor.
</asp:Panel>
</form>
</body>

<body>
    <form id="form1" runat="server">
    <asp:HyperLink ID="Link1" runat="server" NavigateUrl="#">Using slideToggle
 
    </asp:HyperLink><br />
    <asp:HyperLink ID="Link2" runat="server" NavigateUrl="#">Using Toggle
 
    </asp:HyperLink><br />
    <asp:HyperLink ID="Link3" runat="server" NavigateUrl="#">Using Animate
 
    </asp:HyperLink><br />
    <asp:HyperLink ID="Link4" runat="server" NavigateUrl="#">Using slideUp and slideDown
 
    </asp:HyperLink><br />
    <asp:HyperLink ID="Link5" runat="server" NavigateUrl="#">Display Text
 
    </asp:HyperLink>
    <asp:Panel ID="panelText" runat="server" CssClass="panel">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc turpis nunc, placerat
        ac, bibendum non, pellentesque nec, odio. Nulla fringilla aliquet nibh. Donec placerat,
        massa id commodo ornare, justo lectus faucibus leo, in aliquam nisl quam varius
        velit. Maecenas ullamcorper. Aliquam lectus metus, scelerisque ac, scelerisque vitae,
        sodales eu, metus. Sed varius nisi sit amet turpis. Mauris a arcu iaculis risus
        sodales dignissim. Aliquam ac risus. Donec turpis. Sed sit amet mi. Nam sem nunc,
        suscipit quis, cursus non, facilisis nec, diam. Donec nec mi semper urna interdum
        ultrices. Sed tellus. Sed sodales, quam sit amet dignissim ornare, orci velit blandit
        augue, ut pretium diam pede eget felis. Maecenas turpis justo, dapibus non, scelerisque
        et, consequat id, est. Mauris ornare. Donec posuere ligula et nulla. Quisque sollicitudin
        libero vitae dolor.Curabitur elementum venenatis lectus. Class aptent taciti sociosqu
        ad litora torquent per conubia nostra, per inceptos himenaeos. *** sociis natoque
        penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam velit. Quisque
        eros nisi, congue id, aliquam ac, interdum in, velit. Duis cursus tellus molestie
        libero. Cras scelerisque pellentesque nisl. Phasellus adipiscing pretium mi. Curabitur
        faucibus nisl sit amet ante. Pellentesque lacinia erat a nisi molestie lacinia.
        In erat metus, tincidunt id, consequat nec, blandit bibendum, quam. Nunc a tortor.
    </asp:Panel>
    </form>
</body>

Sử dụng slideToggle để bật / tắt khả năng hiển thị của Panel bằng cách điều chỉnh chiều cao của nó.

view plain copy to clipboard print ?

<script type="text/javascript">
$(function() {
$("#Link1").click(function(evt) {
evt.preventDefault();
$('#panelText').slideToggle('slow');
});
});
</script>

Sử dụng Toggle để hiển thị và ẩn Panel với một hiệu ứng hình ảnh động đẹp.

view plain copy to clipboard print ?

<script type="text/javascript">
$(function() {
$("#Link2").click(function(evt) {
evt.preventDefault();
$('#panelText').toggle('fast');
});
});
</script>

Sử dụng Animate để chạy các hình động tuỳ chỉnh trên các thuộc tính của Panel. Ở đây chúng ta đang Animating chiều cao, canh lề và độ trong suốt.

view plain copy to clipboard print ?

<script type="text/javascript">
$(function() {
$("#Link3").click(function(evt) {
evt.preventDefault();
$("#panelText").animate({
height: 'toggle', margin: 'toggle', opacity: 'toggle'
}, 500);
});
});
</script>

Sử dụng slideUp và slideDown cho việc ẩn và hiện Panel bởi việc điều chỉnh thuộc tính chiều cao, ở đây đầu tiên chúng ta kiểm tra nếu Panel bị ẩn thì slideDown, ngược lại slideUp.

Sử dụng Toggle một lần nữa, nhưng lần này việc tha đổi Link bởi hành động của user, đầu tiên chúng ta thấy Display Text sau khi nhấn vào link thay đổi thành Hide Text.

view plain copy to clipboard print ?

<script type="text/javascript">
$(function() {
$('#Link5').click(function(ev) {
ev.preventDefault();
$('#panelText').toggle('slow');
$('#Link5')
.text(($('#Link5').text() == 'Display Text'
? 'Hide Text' : 'Display Text'))
});
</script>

Reference: http://www.dotnetcurry.com/ShowArticle.aspx?ID=367

Theo code2code.info

[Nghean-Aptech st]

Các tin mới:

Hướng dẫn tích hợp giao diện trang quản trị SB Admin 2 vào Laravel 5.8.

Hướng dẫn tích hợp Google ReCaptcha v2 vào Laravel bằng curl.

Học lập trình React JS trong vòng 5 phút.

Sử dụng trình soạn thảo CKeditor tích hợp CKFinder với Laravel.

Hướng dẫn cài đặt Apache, PHP, MySQL, PHPMyAdmin trên Windows 10 và cấu hình SendMail.

Các tin cũ hơn:

Sử dụng DropDownList trong DataGrid.

Đọc ghi Windows Registry với Java.

Tạo layout đơn giản bằng CSS & DIV.

Tạo tài liệu XML từ trang JSP.

Lấy thông tin trình duyệt từ trang JSP.