Step by Step: T?o cascading lookup trong SharePoint 2010 s? d?ng jQuery

ID c?a bài: 2420085 - Xem s?n ph?m mà bài này áp d?ng vào.
Bung t?t c? | Thu g?n t?t c?

? Trang này

V? tác gi?:

Thu g?n b?ng nàyBung r?ng b?ng này
Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
2401266
Bài vi?t này đư?c cung c?p b?i MVP Nguy?n Bá Quang. Microsoft chân thành c?m ơn nh?ng MVP đ? chia x? nh?ng kinh nghi?m chuyên môn c?a m?nh v?i nh?ng ngư?i s? d?ng khác. Bài vi?t này s? đư?c đăng trên website ho?c blog c?a MVP sau đây. N?u b?n mu?n xem các bài vi?t khác đư?c chia x? b?i MVP, vui l?ng nháy chu?t vào đây.

TÓM T?T

Trong SharePoint 2010 form, b?n có 2 drop-down list A và B. B?n mu?n khi ch?n giá tr? cho List A th? các giá tr? có th? ch?n cho list B ti?p theo đư?c l?c d?a theo giá tr? l?a ch?n c?a list A.

THÔNG TIN THÊM

L?y ví d? c? th? cho vi?c nh?p đ?a ch?. B?n có 4 custom list như sau:
- Cities (T?nh thành ph?)
- Districts (Qu?n huy?n): List này có m?t Column là City đư?c lookup t? Cities list ? trên b?ng Title
- Ward (Phư?ng x?): List này có m?t Column là District đư?c lookup t? Districts list ? trên b?ng Title
- Addresses (Đ?a ch?): List này có 4 Column
o Title: c?t m?c đ?nh
o City: Lookup t? Cities list b?ng Title
o District: Lookup t? Districts list b?ng Title
o Ward: Lookup t? Ward list b?ng Title
V?i SharePoint, m?c đ?nh khi chúng ta ch?n City th? danh m?c District phía dư?i v?n gi? nguyên (như h?nh dư?i)

Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
2420172


Gi? chúng ta s? tùy bi?n đ? khi chúng ta ch?n City là Hà N?i như ? trên th? danh m?c District ch? hi?n th? ra các qu?n huy?n thu?c Hà N?i.

Các bư?c th?c hi?n như sau: Chúng ta s? s? d?ng jQuery trong thư vi?n SPServices đ? làm vi?c này

  1. Trư?c h?t chúng ta c?n ph?i t?i v? thư vi?n m?i nh?t SPServices (version 0.5.6) t?i đ?a ch? http://spservices.codeplex.com/
  2. Ti?p đ?n chúng ta download phiên b?n m?i nh?t c?a jQuery (version 1.4.2) t?i đ?a ch? http://docs.jquery.com/Downloading_jQuery
  3. Chúng ta m? SharePoint site b?ng SharePoint Designer 2010. Trong ph?n Navigation click vào “All Files”.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442094
  4. Trong “All Files” tab, chúng ta thêm m?i m?t folder và đ?t tên là “jQuery Libraries” như h?nh dư?i.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442095
  5. Trong thư m?c jQuery Libraries, chúng ta Import 2 files .js v?a m?i download t? thư vi?n SPServices và jQuery ? trên bao g?m như h?nh dư?i.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2420175
  6. Đóng SharePoint Designer 2010 l?i
  7. Bây gi? chúng ta m? Addresses list b?ng IE và ch?n Modify Defaul Form Web Part à Default New Form như h?nh dư?i.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442096
  8. Trong Design page, chúng ta ch?n Add a Web Part link.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442097
  9. Chúng ta ch?n Content Editor Web part đ? Add vào trang.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442098
  10. Ch?n “Click here to add new content” liên k?t.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442099
  11. Ch?n Edit HTML Source như h?nh dư?i.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442100
  12. Chúng ta thêm đo?n scripts sau vào HTML Source page dialog.
    <script src="/TimeSheet/jQuery%20Libraries/jquery-1.4.2.min.js" type="text/javascript"/> 
    <script src="/TimeSheet/jQuery%20Libraries/jquery.SPServices-0.5.6min.js" type="text/javascript"/> 
    <script language="javascript" type="text/javascript"> 


            $(document).ready(function() {
                $().SPServices.SPCascadeDropdowns({
                    relationshipList: "Districts",
                    relationshipListParentColumn: "City",
                    relationshipListChildColumn: "Title",
                    relationshipListSortColumn: "ID",
                    parentColumn: "City",
                    childColumn: "District",
                    promptText: "Choose District...",
                    debug: true
                });

                $().SPServices.SPCascadeDropdowns({
                    relationshipList: "Ward",
                    relationshipListParentColumn: "District",
                    relationshipListChildColumn: "Title",
                    relationshipListSortColumn: "ID",
                    parentColumn: "District",
                    childColumn: "Ward",
                    promptText: "Choose Ward...",
                    debug: true
                });

      }); </script>    
  13. B?m OK đ? k?t thúc.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2442101
  14. Quay tr? l?i t?o m?i m?t Addresses item, chúng ta th?y k?t qu? hi?n th? như ? mu?n như h?nh dư?i.
    Thu g?n h?nh ?nh nàyBung r?ng h?nh ?nh này
    2420188

Tuyên b? Không ch?u trách nhi?m N?i dung Gi?i pháp C?ng đ?ng

CÔNG TY MICROSOFT VÀ/HO?C CÁC NHÀ CUNG C?P C?A H? KHÔNG B?O Đ?M V? TÍNH PHÙ H?P, Đ? TIN C?Y HO?C TÍNH CHÍNH XÁC C?A THÔNG TIN VÀ H?NH ?NH LIÊN QUAN ? ĐÂY. M?I THÔNG TIN VÀ H?NH ?NH NHƯ V?Y ĐƯ?C CUNG C?P “NHƯ NGUYÊN M?U” MÀ KHÔNG CÓ B?T K? B?O Đ?M NÀO. MICROSOFT VÀ/HO?C CÁC NHÀ CUNG C?P C?A H? KHÔNG CH?U TRÁCH NHI?M Đ?I V?I M?I B?O Đ?M VÀ ĐI?U KI?N V? THÔNG TIN VÀ H?NH ?NH LIÊN QUAN NÀY, BAO G?M C? M?I B?O Đ?M VÀ ĐI?U KI?N LIÊN QUAN V? TÍNH THƯƠNG M?I, PHÙ H?P CHO M?T M?C ĐÍCH Đ?C BI?T, N? L?C C?A CÔNG VI?C, TƯ CÁCH VÀ CAM K?T KHÔNG VI PH?M. B?N Đ?NG ? M?T CÁCH C? TH? LÀ KHÔNG CÓ TRƯ?NG H?P NÀO MÀ MICROSOFT VÀ/HO?C CÁC NHÀ CUNG C?P C?A H? B? RÀNG BU?C VÀO B?T K? THI?T H?I TR?C TI?P, GIÁN TI?P, TR?NG PH?T, T?NH C?, Đ?C BI?T, H? QU? HO?C B?T K? THI?T H?I D?NG NÀO, BAO G?M NHƯNG KHÔNG GI?I H?N THI?T H?I DO M?T MÁT, D? LI?U HO?C L?I ÍCH, X?Y RA HO?C TRONG M?I CÁCH LIÊN QUAN Đ?N VI?C S? D?NG HO?C KHÔNG TH? S? D?NG THÔNG TIN VÀ H?NH ?NH LIÊN QUAN CÓ ? ĐÂY, DÙ LÀ D?A VÀO H?P Đ?NG, L?I GÂY THI?T H?I, SƠ SU?T, NGH?A V? PHÁP L? HO?C B?T K? CƠ S? NÀO KHÁC, NGAY C? N?U MICROSOFT HO?C B?T K? NHÀ CUNG C?P NÀO C?A H? Đ? ĐƯ?C TƯ V?N V? KH? NĂNG B? THI?T H?I.

Thu?c tính

ID c?a bài: 2420085 - L?n xem xét sau cùng: 17 Tháng Mười Một 2010 - Xem xét l?i: 2.1
Áp d?ng
  • Microsoft SharePoint Designer 2010
  • Microsoft SharePoint Foundation 2010
T? khóa: 
kbprb kbtshoot kbstepbystep kbgraphxlink kbmvp KB2420085

Cung cấp Phản hồi

 

Contact us for more help

Contact us for more help
Connect with Answer Desk for expert help.
Get more support from smallbusiness.support.microsoft.com