Những thủ thuật trong .NET phần 4
Trong các phần trước phần trước bạn đã tham khảo 30 thủ thuật lập trình với asp.net. Trong phần 4 này tôi sẽ tiếp tục 10 thủ thuật nữa để bạn tham khảo. Có thể những thủ thuật này thường với bạn nhưng hay với người khác, thường vì bạn đã biết hay vì bạn chưa biết, Hy vọng những thủ thuật này ...
Trong các phần trước phần trước bạn đã tham khảo 30 thủ thuật lập trình với asp.net. Trong phần 4 này tôi sẽ tiếp tục 10 thủ thuật nữa để bạn tham khảo. Có thể những thủ thuật này thường với bạn nhưng hay với người khác, thường vì bạn đã biết hay vì bạn chưa biết, Hy vọng những thủ thuật này có ích với nhiều bạn chưa biết » Phần 1 » Phần 2 » Phần 3 Thủ thuật lập trình asp.net, Lập trình, asp.net,
31. Refresh lại trang gốc khi kết thúc thao tác ở trang popup
Khi bạn cần thực hiện hành động như thao tác dữ liệu hay cần làm một tác vụ nào đó và cần mở cửa số dạng popup và sau khi thực hiện xong công việc ở cửa số popup này bạn muốn refresh lại trang gốc. Ví dụ rõ nhất là ở diễn đàn aspvn.net (Khi bạn trả lời hoặc đặt câu hỏi aspvn.net sẽ mở cửa sổ popup để bạn nhập nội dung và lưu lại thì trang gốc được refresh lại) bạn thực hiện như sau:
Ở trang popup bạn cần có đoạn javascript như sau:
<script language="JavaScript"> function refreshParent() { window.opener.location.href = window.opener.location.href; if (window.opener.progressWindow) { window.opener.progressWindow.close() } window.close(); } </script>
Trong code C# khi thực hiện lưu dữ liệu xong bạn dùng như dòng lệnh sau:
ScriptManager.RegisterStartupScript(this, this.GetType(), "refresh", "refreshParent();", true);
Nếu dùng code html trong trang popup bạn dùng như ví dụ:
<asp:Button ID="btnClose" runat="server" OnClientClick="refreshParent();" Text="Đóng" />
32. Chèn thông tin chỉ số Alexa vào trang web
Khi lướt web bạn thấy có một số trang hiển thị chỉ số Alexa Traffic Rank như hmweb cũng đang dùng ở cuối trang. Làm điều này rất đơn giản bạn chỉ cần chèn đoạn code sau vào nơi bạn muốn hiển thị là xong:
<a href="http://www.alexa.com/siteinfo/hmweb.com.vn"> <script type='text/javascript' language='javascript' src='http://xslt.alexa.com/site_stats/js/t/a?url=hmweb.com.vn'></script> </a>
33. Sử dụng MaskedEditExtender của ajax để thực hiện ghi đè dữ liệu.
Bạn có textbox ví dụ để nhập ngày tháng, bạn muốn khi nhập số thì dữ liệu được nhập kiểu overwrite bạn dùng MaskedEditExtender của ajax như sau:
<asp:TextBox ID="TextBox1" runat="server" Width="80px" /> <cc1:MaskedEditExtender ID="meeTuNgay" MaskType="Date" Mask="99/99/9999" runat="server" TargetControlID="txtTuNgay" />
Copy đoạn code này vào trang aspx của bạn và kiểm chứng (Chú ý bạn cần đảm bảo đã khai báo sử dụng ajax AjaxControlToolkit)
34. Cấu hình tiếng việt cho Ajax CalendarExtender
Bạn sử dụng Ajax CalendarExtender với dữ liệu ngày tháng và muốn cấu hình tiếng việt cho nó bạn làm như ví dụ sau: (DEMO)
<%@ Page Language="C#" Culture="vi-VN" uiCulture="vi"%> <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> </head> <body> <form id="form1" runat="server"> <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="True" /> <div> Nhập ngày tháng: <asp:TextBox ID="txtNgayThang" runat="server" CausesValidation="True"></asp:TextBox> <cc1:CalendarExtender ID="txtNgayThang_CalendarExtender" runat="server" Enabled="True" TargetControlID="txtNgayThang" Format="dd/MM/yyyy"> </cc1:CalendarExtender> </div> </form> </body> </html>
35. SetFocus Textbox theo điều kiện
Bạn có Form login và khi người dùng truy cập bạn muốn đặt focus luôn đến txtUserName (Tên đăng nhập), Nếu txtUserName đã có (Thường do trình duyệt có chế độ nhớ UserName) thì chuyển focus đến txtPassword. Điều này bạn thấy rõ nhất nếu bạn sử dụng mail của MDaemon bạn làm như sau
protected void Page_Load(object sender, EventArgs e) { if (txtUserName.Text + "" != "") { this.SetFocus(txtPassword); } else { this.SetFocus(txtUserName); } }
36. Cho phep upload hay export khi dùng updatepanel
Khi sử dụng updatePanel của ajax nếu bạn lồng asp:FileUpload hay button cho phéo export ra excel chẳng hạn trong một asp:UpdatePanel thì sẽ không upload hay export được, Nguyên nhân thì chưa rõ nhưng cũng có cách khắc phục bằng cách thêm asp:PostBackTrigger bên trong thẻ UpdatePanel như sau:
<asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> Chọn dữ liệu: <asp:FileUpload ID="filMyFile" runat="server" CssClass="textbox" Width="300px" /> <asp:Button ID="btnImport" runat="server" OnClick="btnImport_Click" OnClientClick="javascript:showWait();" Text="Import" /> </ContentTemplate> <Triggers> <asp:PostBackTrigger ControlID="btnImport" /> </Triggers> </asp:UpdatePanel>
37. Sử dụng asp:UpdateProgress của ajax kết hợp với updatepanel
Trong mục 36 có cái OnClientClick="javascript:showWait();" tức là khi người dùng chọn dữ liệu upload và click upload ta sẽ thông báo đang xử lý dữ liệu, để làm vậy ta cần dùng một UpdateProgress cùng với một updatepanel như sau:
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DynamicLayout="true"> <ProgressTemplate> Đang xử lý dữ liệu ... </ProgressTemplate> </asp:UpdateProgress>
Và hàm showWait:
<script language="javascript" type="text/javascript"> function showWait() { if ($get('filMyFile').value.length > 0) { $get('UpdateProgress1').style.display = 'block'; } } </script>
Bạn có thể tìm một ảnh gif động và style sheet để làm nổi cái UpdateProgress thông báo cho sinh động
38. Thiết lập Title page theo bài viết
Khi người dùng đọc một bài viết thì Title page sẽ chính là tiêu để của bài viết đó, thiết lập này sẽ có tác dụng cho các máy tìm kiếm tốt hơn. Để thiết lập khi bạn đã truy vấn được ID của bài viết bạn dùng Page.Title như minh họa sau:
Page.Title = dtb.Rows[0]["Title"] + "";
Trong đó dtb là Datatable khi truy vấn dữ liệu với IdBaiViet và Fill vào dtb
39. Định dạng số phân cách hàng nghìn
Bạn có một số 123456789 chẳng hạn giờ muốn định dạng hiển thị phân cách hàng nghìn để hiển thị thành 123,456,789 bạn làm như ví dụ sau:
int so = 123456789; txtSo.Text = so.ToString("#,###");
Tương tự cách dùng ToString bạn cũng có thể định dạng ngày tháng hiển thị dạng dd/MM/yyyy như sau:txtSo.Text = DateTime.Now.ToString("dd/MM/yyyy");
40. Hiển thị thời gian chạy kiểu đồng hồ điện tử
Bạn muốn có label hiển thị như đồng hồ điện từ trên trang của bạn bạn dùng như sau:
<script language="JavaScript"> function updateTime() { var label = document.getElementById('ctl00_currentTime'); if (label) { var time = (new Date()).localeFormat("T"); label.innerHTML = time + ' '; } } updateTime(); window.setInterval(updateTime, 1000); </script> ...... <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <span id="currentTime" runat="server"></span> </ContentTemplate> </asp:UpdatePanel>
Bình luận
Bạn chú ý trong hàm javascript trên ta có dùng ctl00_currentTime là ID của thẻ span - ctl00_ là chỉ số tự sinh khi bạn đặt trong updatepanel, Nếu bạn thực hiện không chạy bạn view source tìm và lấy đúng id của thẻ span (Vì có thể bạn dùng lồng trong nhiều control thì id này sẽ khác)
Còn tiếp - Tiếp theo sẽ là phần 5 với 10 thủ thuật khác nữa
Nguồn: thietkewebsmart.com