Wednesday, February 29, 2012

Article 3: Get data from Field Choice to DropdownList Using SPService


Bước 1: Tạo 1 list tên Employees, tạo 1 Field kiểu choice tên là Gender với 2 giá trị là Male và Female
Bước 2: Mở SPD viết code như sau
·         Import 2 thư viện JQuery và SPServices vào page
<script type="text/javascript" src="JS/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="JS/jquery.SPServices-0.5.7.min.js"></script>
·         Thêm thẻ Select để hiển thị dữ liệu
<select  id="ddlGender" >
</select>
·         Viết hàm hiển thị giá trị của Choice Field

function LoadChoiceFielFromList(idSelect, fielName) {
        $().SPServices({
            operation: "GetList",
            listName: "Employees",
            completefunc: function (xData, Status) {
                AssignDataToChoiceFile(xData, Status, idSelect, fielName);
            },
            async: false
        });
    }

·         Gọi hàm AssignDataToChoiceFile
function AssignDataToChoiceFile(xData, Status) {
        if (status == 'success') {
            $(xData.responseXML).find("Field[DisplayName='" + fieldName + "'] CHOICE").each(function () {
                $(idSelect).append("<option value='" + $(this).text() + "'>'" + $(this).text() + "'</option>");
            }
                     );
        }
    }
·         Trong sự kiện ready của page gọi hàm LoadChoiceFielFromList

Xây dựng lớp dùng chung


function LoadChoiceFielFromList (idSelect,fielName)
                {
                                $().SPServices({
                                                operation: "GetList",
                                                listName: "HoSoHocVien",
                                                completefunc: function(xData, Status) {
                            LoadDataFromChoiField(xData, Status,idSelect,fielName);
                        },
                                                async: false
                                });
                }
function LoadDataFromChoiField(xData, status,idSelect, fieldName) {
                                if(status == 'success') {
                                                $(xData.responseXML).find("Field[DisplayName='"+fieldName+"'] CHOICE").each( function () {
                                                                $(idSelect).append("<option value='" + $(this).text() + "'>'" + $(this).text() + "'</option>");
                                                                }
                                                );
                                }
                }
//Gọi hàm
$(document).ready(function () {
              LoadChoiceFielFromList("#ddlGender""Gender");
       });

0 comments:

Post a Comment