Chương 2: Công nghệ Web 2 .0 (AJAX) và một số ứng dụng
a. Sử dụng thẻ SCRIPT
Script được đưa vào file HTML bằng cách sử dụng cặp thẻ <SCRIPT> và <\SCRIPT>. Các thẻ <SCRIPT> có thể xuất hiện trong phần <HEAD> hay <BODY> của file HTML. Nếu đặt trong phần <HEAD>, nó sẽ được tải và sẵn sàng trước khi phần còn lại của văn bản được tải.
Thuộc tính duy nhất được định nghĩa hiện thời cho thẻ <SCRIPT> là “LANGUAGE=“ dùng để xác định ngôn ngữ script được sử dụng. Có hai giá trị được định nghĩa là "JavaScript" và "VBScript". Ví dụ việc khai báo lựa chọn ngôn ngữ JavaScript để viết trong một trang Web:
<SCRIPT LANGUAGE=”JavaScript”> // INSERT ALL JavaScript HERE </SCRIPT>
Điểm khác nhau giữa cú pháp viết các ghi chú giữa HTML và JavaScript là cho phép ẩn các mã JavaScript trong các ghi chú của file HTML, để các trình duyệt cũ không hỗ trợ cho JavaScript có thể đọc được nó như trong ví dụ sau đây:
<SCRIPT LANGUAGE=”JavaScript”> <!-- From here the JavaScript code hidden // INSERT ALL JavaScript HERE
// This is where the hidden ends --> </SCRIPT>
Dòng cuối cùng của script cần có dấu // để trình duyệt không diễn dịch dòng này dưới dạng mã JavaScript. Các ví dụ trong chương này không chứa đặc điểm ẩn của JavaScript để mã có thể dễ hiểu hơn.
b. Sử dụng một file nguồn JavaScript
Thuộc tính SRC của thẻ <SCRIPT> cho phép chỉ rõ file nguồn JavaScript được sử dụng (dùng phương pháp này hay hơn nhúng trực tiếp một đoạn lệnh JavaScript vào trang HTML).
Cú pháp:
<SCRIPT SRC="file_name.js"> ....
</SCRIPT>
Thuộc tính này rấy hữu dụng cho việc chia sẻ các hàm dùng chung cho nhiều trang khác nhau. Các câu lệnh JavaScript nằm trong cặp thẻ <SCRIPT> và </SCRIPT> có chứa thuộc tinh SRC trừ khi nó có lỗi. Ví dụ: đưa dòng lệnh sau vào giữa cặp thẻ <SCRIPT SRC="..."> và </SCRIPT>:
document.write("Không tìm thấy file JS đưa vào!");
Thuộc tính SRC có thể được định rõ bằng địa chỉ URL, các liên kết hoặc các đường dẫn tuyệt đối, ví dụ:
<SCRIPT SRC=" http://cse.com.vn ">
Các file JavaScript bên ngoài không được chứa bất kỳ thẻ HTML nào. Chúng chỉ được chứa các câu lệnh JavaScript và định nghĩa hàm.
Tên file của các hàm JavaScript bên ngoài cần có đuôi .js, và server sẽ ánh xạ đuôi .js đó tới kiểu MIME application/x-javascript. Đó là những gì mà server gửi trở lại phần Header của file HTML. Để ánh xạ đuôi này vào kiểu MIME, thêm dòng sau vào file mime.types trong đường dẫn cấu hình của server, sau đó khởi động lại server:
type=application/x-javascript
Nếu server không ánh xạ được đuôi .js tới kiểu MIME application/x- javascript, Trình duyệt sẽ tải file JavaScript được chỉ ra trong thuộc tính SRC về không đúng cách.
Trong ví dụ sau, hàm bar có chứa xâu "left" nằm trong một cặp dấu nháy kép:
Function bar(widthPct){
document.write(“<HR Align = ‘left’ width = “+ widthPct +”%>”)
}
c. Thẻ <NOScript> và </NOSCRIPT>
Cặp thẻ này dùng để định rõ nội dung thông báo cho người sử dụng biết trình duyệt không hỗ trợ JavaScript. Khi đó trình duyệt sẽ không hiểu thẻ <NOSCRIPT> và nó bị lờ đi, còn đoạn mã nằm trong cặp thẻ này sẽ được
Navigator hiển thị. Ngược lại, nếu trình duyệt có hỗ trợ JavaScript thì đoạn mã trong cặp thẻ <NOSCRIPT> sẽ được bỏ qua. Tuy nhiên, điều này cũng có thể xảy ra nếu người sử dụng không sử dụng JavaScript trong trình duyệt của mình bằng cách tắt nó đi trong hộp Preferences/Advanced.
2.2.5.2. Kiểu dữ liệu trong JavaScript.
Có 3 kiểu dữ liệu cơ bản trong JavaScript là: kiểu boolean, kiểu chuỗi và kiểu số. Ngoài ra còn có 2 kiểu dữ liệu đặc biệt là kiểu Null và không định kiểu (undefined). Ngoài 3 kiểu dữ liệu cơ bản, JavaScript còn có các kiểu đối tượng phức tạp: mảng và hàm. Các đối tượng hàm là các lớp đầu tiên trong JavaScript, điều đấy có nghĩa là nó được thực thi giống như các đối tượng khác: truyền tham số, sử dụng các phương thức. Có thể tạo ra một khởi tạo cho một đối tượng bằng từ khóa new và có thể thêm các thuộc tính vào các đối tượng mới một cách linh hoạt.
Ví dụ:
var box = new Object(); box.height = 20;
box.shrink = new Function(); box.contents = new Array();
Mặc dù cú pháp được sử dụng để định nghĩa đối tượng box gần giống với cú pháp tạo ra một đối tượng của các ngôn ngữ lập trình phía server. Tuy nhiên cũng có một cách khác trong JavaScript được sử dụng để tạo các đối tượng.
var box = {}; box.height = 20;
box.shrink = function() {}; box.contents = [];
Cụ thể chúng ta định nghĩa một đối tượng bằng cách sử dụng kết hợp mảng với các ký hiệu. Thông thường để truy cập các thuộc tính của đối tượng chúng ta sử dụng dấu chấm (.), tuy nhiên trong JavaScript chúng ta phải sử dụng các ký hiệu như sau:
var boxHeight = box["height"];
2.2.5.3. Closure
Closure được tạo ra khi có một hàm được khai báo trong thân của một hàm khác – được gọi là hàm ở trong hàm. Khi một hàm được định nghĩa trong thân của một hàm khác và truy nhập đến các biến được định nghĩa trong hàm cha ngay cả khi hàm cha kết thúc thực thi.
function Foo() {
var bar = "foobar";
// create the inner function or closure var showFoobar = function() {
alert(bar); };
// return a reference to the dynamically created closure return getFoobar;
}
Trong ví dụ này, khi gọi hàm Foo nó sẽ trả về một đối tượng kiểu hàm mà có thể thực thi một cách linh hoạt như sau:
var myClosure = Foo();
myClosure(); // alerts "foobar" // or
Foo()(); // alerts "foobar"
Kết quả của cả 2 câu lệnh trên đều đưa ra màn hình dòng thông báo “foobar”. Tuy nhiên thực thi này là không rõ ràng. Closure trong JavaScript sẽ giải quyết vấn đền này.
2.2.5.4 Tính hướng đối tượng trong JavaScript
Tính đối tượng trong JavaScript khác so với các ngôn ngữ lập trình hướng đối tượng khác. Nó được thể hiện bằng các mẫu, trong khi đó tính đối tượng trong Java lại được thể hiện bằng các lớp. Điểm khác biệt quan trọng thứ hai: JavaScript là một ngôn ngữ lập trình động, điều đấy có nghĩa là chúng ta có thể định nghĩa các lớp tại thời điểm biên dịch. Ngoài ra còn có một số điểm khác nhau cơ bản nữa. Bảng dưới đây sẽ liệt kê ra một số sự khác nhau đó.
Các đặc trưng Java JavaScript
Lớp ngôn ngữ Static Dynamic Định kiểu Định kiểu mạnh Định kiểu yếu Classes public class foo {} function foo() {} Constructors public class foo {
public foo() {} }
function foo() {}
Các phương thức
public class foo { public foo() {} public void Bar() {} }
function foo() { this.Bar = function() {}; }
Khởi tạo foo myFoo = new foo();
var myFoo = new foo();
Kế thừa public class foo extends bar {}
foo.prototype = new bar();
Có nhiều ý kiến khác nhau về tính đối tượng trong JavaScript, nhưng nhìn chung đều mong muốn tính đối tượng trong JavaScript hoạt động một cách hiệu quả, an toàn kiểu và mạnh mẽ hơn như các kỹ thuật hướng đối tượng khác: interface, abstract class.
- Public Member (Biến toàn cục)
Để có thể sử dụng được các thành phần của một đối tượng bên ngoài đối tượng đấy, cần phải chuyển thành phần đó thành kiểu dùng chung (public) và chỉ định nó thành đối tượng đặc biệt this. Khi sử dụng đối tượng this để truy cập các trường hay các phương thức trong một lớp thì cách sử dụng this trong JavaScript và Java là giống nhau. Trong cả JavaScript và Java, this có thể được xem như là một đối số vô hình được truyền vào một cấu trúc và sử dụng nó để chỉ đến đối tượng chứa cấu trúc hay phương thức đó. Do JavaScript là một ngôn ngữ động nên việc sử dụng this trong JavaScript có sự khác biệt so với Java. Điều này được thể hiện như sau: Đối với Java, đối tượng this chỉ được sử dụng để chỉ đến các trường mà đã được định nghĩa trong các lớp. trong khi đó trong JavaScript đối tượng this có thể được sử dụng để chỉ đến các trường, phương thức ảo của đối tượng. Sự khác biệt được thể hiện ở ví dụ sau:
this.firstName = "John"; this.lastName = "Smith"; }
var john = new Customer(); function Customer() {} function createCustomer() {
var temp = new Customer();
temp.firstName = “John”; temp.lastName = “Smith”; return temp;
}
var john = createCustomer() - Private member (Biến cục bộ)
Biến cục bộ là biến chỉ có ý nghĩa trong một phạm vi nhỏ, như là trong một hàm, hay một đoạn lệnh. Để định nghĩa một biến là cục bộ, sử dụng từ khóa var.
2.2.5.5 Kiểm soát lỗi
Bắt lỗi là một trong những vấn đề quan trọng trong quá trình phát triển. Bắt lỗi tốt là một trong những yếu tố dẫn đến sự đảm bảo an toàn cho các ứng dụng. Giống như các ngôn ngữ như Java, C#,… JavaScipt cũng hỗ trợ việc kiểm soát lỗi trong việc lập trình. Cú pháp kiểm soát lỗi được JavaScript đưa ra như sau: try/catch/finally. Bất kỳ một đoạn chương trình nào tiềm ẩn những nguy cơ xảy ra lỗi đều có thể được đặt trong khối lệnh try. Khi có lỗi xảy ra, máy JavaScript hay kiểm soát ngoại lệ sẽ điều hướng tới các dòng lệnh được đặt trong khối lệnh catch, vì vậy trong khối lệnh catch trường là các câu lệnh thông báo lỗi, chứ không phải là các câu lệnh xử lý chính của chương trình. Một thông báo lỗi cụ thể thường bao gồm các phần: Tên lỗi, mô tả chi tiết lỗi, dòng xảy ra lỗi. Khối lệnh cuối cùng được xử lý trong quá trình kiểm soát lỗi là khối lệnh finally. Các dòng lệnh trong khối lệnh này được thực hiện để đảm bảo cho các thực thi trước đó được hoàn thành, các tài nguyên sử dụng liên quan đến lỗi được giải phóng,…Sau đây là một ví dụ về việc kiểm soát lỗi trong JavaScript.
try {
var n = Math.random();
}
catch(err) {
// Deal with the native error object here
alert(err.message + " – " + err.name + " – " + err.number); }
finally {
// Do cleanup here if need be }
2.3. Kết luận.
Web 2.0 (AJAX) là một sự phát triển về mặt công nghệ của các ứng dụng nền tảng web. Với sự bùng nổ của Internet, với xu hướng tích hợp thông tin, các ứng dụng dần dần được web hóa. Với web truyền thống thì việc đưa các ứng dụng quản lý lên trên web gặp nhiều khó khăn. Tuy nhiên sự ra đời của web 2.0 (Ajax) đã tạo một bước chuyển biến quan trọng, rút ngắn khoảng cách giữa ứng dụng destop với ứng dụng web. Nhiều ứng dụng web 2.0 (Ajax) thành công gần đây như: Gmail, Google, YouTube,… là một động lực to lớn để thúc đẩy sự phát triển của các ứng dụng web, việc ứng dụng web 2.0 (Ajax) đã trở thành một nhân tố dẫn đến thành công của nhiều doanh nghiệp, đã và đang trở thành một tiêu chí lựa chọn của khách hàng.
Chương 3: ỨNG DỤNG CÔNG NGHỆ WEB 2.0
(AJAX) VÀO XÂY DỰNG CỔNG THÔNG TIN ĐIỆN
TỬ TRONG CƠ QUAN BỘ.
3.1 Nhu cầu về việc quản lý thông tin công việc.
Từ trước đến nay, quản lý công việc là một trong những yếu tố quan trọng dẫn đến thành công của một con người. Người biết tổ chức và giải quyết công việc một cách khoa học sẽ có nhiều cơ hội thành công hơn. Có nhiều người phải giải quyết nhiều công việc cùng một lúc (việc cơ quan, việc cá nhân), có những việc phải giải quyết trong một thời gian dài. Nếu không tổ chức công việc tốt thì quên việc, lọt việc sẽ thường xuyên xảy ra. Với sự phát triển của công nghệ hiện nay, máy tính đã giúp con người giải quyết nhiều công việc. Vì vậy nhu cầu áp dụng công nghệ vào quản lý công việc là một trong những nhu cầu tất yếu. Đặc biệt trong các cơ quan cấp Bộ, công việc nhiều, nhiều người tham gia trong một thời gian dài, nên nếu quản lý công việc không tốt, không kiểm tra được tiến độ thực hiện công việc một cách thường xuyên thì yếu tố rủi ro xảy ra trong công việc cao.
3.2. Mục tiêu, yêu cầu của hệ thống.
3.2.1. Mục tiêu:
Quản lý và theo dõi được các thông tin cơ bản của từng công việc, thông tin về việc xử lý công việc một cách đầy đủ, chính xác, kịp thời, trên cơ sở đó quản lý toàn bộ công việc của một đơn vị và của cá nhân. Giúp cán bộ lãnh đạo chỉ huy quản lý được các công việc đã giao, kịp thời chỉ đạo với các tình huống phát sinh, tránh quên việc.
Ngoài ra hệ thống còn có các chức năng khác hỗ trợ công tác quản lý và giải quyết công việc của một cá nhân như: Lịch công tác, danh bạ điện thoại,…
3.2.2. Yêu cầu:
+ Quản lý đầy đủ, chính xác tất cả các công việc, đảm bảo không để sót lọt việc.
+ Bảo đảm các khả năng tìm kiếm, tra cứu thông tin đã được lưu trữ trên CSDL một cách nhanh chóng, chính xác.
+ Thiết lập hệ thống báo cáo phân tích, tổng hợp số liệu theo yêu cầu của người sử dụng.
3.3. Các nghiệp vụ thực tế xảy ra trong quá trình quản lý
thông tin về công việc.
3.3.1. Các quy trình xử lý công việc trong thực tế
3.3.1.1. Quy trình giao việc
- Giao việc tuần tự: Công việc được giao theo cấp quản lý từ trên xuống dưới.
Lãnh đạo cấp trên giao việc cho cấp dưới trực tiếp của mình. Cấp dưới có thể trực tiếp xử lý công việc hoặc giao xuống cho cấp dưới nữa. Quy trình cứ như vậy cho đến khi có người trực tiếp đảm nhận việc thực hiện công việc.
Công việc khi giao xuống có thể được chia nhỏ cho các bộ phận cùng tham gia.
Nguyên tắc:
+ Lãnh đạo các cấp chỉ đạo và quản lý công việc theo phân cấp.
+ Bộ phận làm công tác Tham mưu Tổng hợp ghi nhận và theo dõi công việc.
+ Bộ phận trực tiếp nhận việc nắm bắt công việc, tiến hành các thao tác nghiệp vụ theo chỉ đạo của Lãnh đạo cấp trên.
+ Đối với các công việc do cấp dưới đề xuất thực hiện thì phải được sự đồng ý của lãnh đạo, đồng thời phải thông báo để bộ phận tham mưu tổng hợp nắm việc.
- Giao việc trực tiếp: Cán bộ lãnh đạo giao trực tiếp việc cho một người
hoặc một nhóm người thực hiện. Cán bộ được giao việc sẽ thực hiện các công việc theo ý kiến chỉ đạo của lãnh đạo giao việc. Quy trình này thường xảy ra đối với các công việc có yêu cầu bí mật.
Nguyên tắc:
+ Cán bộ lãnh đạo của đơn vị thực hiện (không phải là cán bộ giao việc) sẽ được thông báo về công việc mà đơn vị cấp dưới của mình đang thực hiện
+ Bộ phận tham mưu không nắm bắt được các công việc này.
3.3.1.2. Quy trình nhận việc và xử lý.
Cán bộ nhận việc, nghiên cứu nội dung công việc, nghiên cứu ý kiến chỉ đạo của lãnh đạo cấp trên, nghiên cứu các quy định liên quan, đề xuất kế
hoạch thực hiện, thời gian hoàn thành và thực hiện các thao tác nghiệp vụ theo quy trình để giải quyết công việc được giao.
3.3.1.3 Quy trình báo cáo.
- Đối với giao việc tuần tự:
Các bộ thực hiện báo cáo hoặc xin ý kiến chỉ đạo của lãnh đạo trực tiếp của mình về tiến độ và kết quả của công việc được giao. Cán bộ lãnh đạo có trách nhiệm báo cáo và xin ý kiến chỉ đạo của cấp lãnh đạo cấp cao hơn. Quy trình cứ như vậy cho đến khi báo cáo hoặc xin được ý kiến chỉ đạo của cấp lãnh đạo có thẩm quyền cao nhất về công việc.
- Đối với trường hợp giao việc trực tiếp, cán bộ, tổ, nhóm thực hiện báo cáo đề xuất hướng giải quyết và tiến độ, kết quả thực hiện công việc với Lãnh đạo trực tiếp giao việc và nhận chỉ đạo bổ sung.
3.3.2. Các thông tin cần quản lý về một công việc.
Công việc được đưa ra theo các kế hoạch công việc hoặc do cán bộ, nhân viên đề xuất. Các nội dung trong một công việc bao gồm: