JSON in .Net

Bài viết hướng dẫn chuyển đổi(convert) một chuỗi(string) định dạng JSON sang đối tượng (object) của .Net và ngược lại, sử dụng JavaScriptSerializer trong thư viện System.Web.Extensions.

Chúng ta đều biết đối tượng kiểu JSON cực kỳ thuận tiện trong tương tác javascript.
Nhưng khi tương tác với server thông qua Ajax, nó có một hạn chế. Ta ko thể truy xuất sâu hơn các thuộc tính trực tiếp của đối tượng.

Chẳng hạn, ta có đối tượng JSON như sau:

var person = {
     name    : "svincoll",
     address : {
          street : "Le Lai"
          city   : "hcm"
     }
 }

 

sau đó, ta dùng ajax đưa dữ liệu này về server thông qua POST.

 

$.post("jsonDemo.aspx", person);

Hãy xem, ta lấy được gì ở server nhé:



Như vậy, với thuộc tính name ta lấy được giá trị, còn address thì không.
Bởi vì giá trị của address là đối tượng JSON, và browser đã sử dụng hàm toString() trong trường hợp này.

Có lẽ vì điều đó mà bạn nên đọc bài viết này bigsmile

1. Javascript Serialize

Trong Ajax Extensions, có hỗ trợ cho chúng ta một lớp đối tượng JavaScriptSerializer, lớp đối tượng này cho phép ta chuyển đổi một đối tượng C# thành một chuỗi theo định dạng JSON và ngược lại.

Để minh họa điều này, ta sẽ xây dựng hai đối tượng PersonPersonAddress như sau:


Tiếp theo, ta sẽ khởi tạo đối tượng Person, và serialize nó thành chuỗi JSON:



kiểm tra giá trị của biến json, ta được chuỗi JSON như sau:

 

{"Name":"svincoll","Address":{"Street":"Le Lai","City":"hcm"}}

Với chuỗi JSON trên, ta hoàn toàn có thể deserialize để nhận về đối tượng Person ban đầu



Tới đây, việc xử lý dữ liệu phía codebehind (code server) đã xong. Vấn đề mấu chốt là chúng ta cần 1 chuỗi JSON, để từ đó convert qua object.

2. Ajax

Từ browser, chúng ta cần gửi đi một chuỗi JSON, ko phải đối tượng JSON, để server nhận được và chuyển đổi thành object tương ứng.

Việc này không quá khó. Chúng ta có thể viết một hàm riêng, chuyển đổi đối tượng JSON thành chuỗi, hoặc sử dụng các thư viện có sẵn như jQuery JSON

Nguồn: http://my.opera.com/svincoll4/blog/2009/10/18/json-in-net

10 hướng dẫn tạo Form Validation với jQuery

jQuery là một framework mạnh mà bạn nào làm thiết kế website cũng nên tìm hiểu. Sau đây xin giới thiệu với các bạn 10 hướng dẫn làm form kiểm tra thông tin rất hay và đẹp với jQuery.

Các bạn click vào hình mô tả để đến với bài viết hướng dẫn nhé   Khác...

jQuery Validation: Add custom rule for validate

Để tạo thêm một rule trong jQuery Validation plugin, ta làm từng bước như sau:
(Ví dụ sau xây dựng rule kiểm tra tag html)
Xây dựng hàm kiểm tra dữ liệu, hàm nhận vào hai đối số và trả về giá trị bool.

 

function validateScript(value, element){

        var reg = new RegExp("[]+\s*?[>]");
        if( reg.test(value) ){
            //The input data contains words or phrases which are not allowed.;
            return false;
       }
       return true;
}

 

Đặt tên (rule name) cho hàm, tên này sẽ được sử dụng khi user gọi validate, tham số thứ 3 là thông báo lỗi khi hàm kiểm tra dữ liệu bên trên trả về giá trị false.

 

jQuery.validator.addMethod("scriptbadword", validateScriptOrBadWord, "The data contains invalid words.");

Gọi hàm thực thi

 

 

jQuery(function (){
       jQuery.noConflict();
       jQuery('#formid').validate({
            rules : {
                ContactName : "required scriptbadword",
                LastName : "required scriptbadword"
            }
       });
});

 

 

 

Custom Date Validator - DatePicker JQuery

jQuery.validator.addMethod(
           "customDateValidator",
            function(value, element) {
                // parseDate throws exception if the value is invalid
                try { jQuery.datepicker.parseDate('d/m/yy', value); return true; }
                catch (e) { return false; }
            },
                " Nhập ngày hợp lệ (d/m/yyyy)"
            );
$("#frm").validate();
$("#WorkingDate").rules("add", { customDateValidator: true });
$("#WorkingDate").datepicker({
      dateFormat: 'd/m/yy'
});

Chỉ cho phép nhập số vào textbox

Đoạn code bên dưới giúp ta chỉ cho phép nhập số vào textbox

$(document).ready(function(){
$("#<%= txtNumbers.ClientID%>").keydown(function(event) {
   if (event.keyCode == 46 || event.keyCode == 8) {
   }
   else {
        if (event.keyCode < 95) {
          if (event.keyCode < 48 || event.keyCode > 57) {
                event.preventDefault();
          }
        }
        else {
              if (event.keyCode < 96 || event.keyCode > 105) {
                  event.preventDefault();
              }
        }
      }
   });
});