2012-11-20 11 views
5

Tôi có một URL SharePoint chỉ là danh sách SharePoint với một số cột và hàng dữ liệu.Đọc danh sách SharePoint và đặt dữ liệu trên tệp HTML thông qua chức năng JavaScript

Tôi muốn đọc thông tin đó từ URL cụ thể đó và đặt dữ liệu trên tệp HTML thông qua hàm JavaScript.

Tôi không có kinh nghiệm về JavaScript & HTML5 vì vậy, tôi không chắc chắn cách gọi đến các chức năng đó để truy xuất dữ liệu.

Đó là những gì tôi có cho đến nay và nó không phải đang làm việc tại tất cả:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <title></title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width"> 
</head> 

<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script> 
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script> 
<script language="javascript" type="text/javascript"> 
    $(document).ready(function() { 
     $().SPServices({ 
     operation: "GetListItems", 
     webURL: "http://myURL.aspx", 
     async: false, 
     listName: "Announcements", 
     CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>", 
     completefunc: function (xData, Status) { 
      $(xData.responseXML).SPFilterNode("z:row").each(function() { 
      var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>"; 
      $("#tasksUL").append(liHtml); 
      }); 
     } 
     }); 
    }); 
</script> 
<ul id="tasksUL"/> 
<body> 
</body> 
</html> 

Nếu tôi cố gắng để mở index.html có gì xảy ra vì vậy tôi không biết làm thế nào để gọi tới chức năng của tôi trên của tôi Tệp HTML. Ngoài ra, tôi không biết làm thế nào để xác định SP.ClientContext trong tệp HTML.

Cảm ơn rất nhiều trước.

+0

bạn xác định collList ở đâu? Bạn lấy đoạn này từ đâu? – Christophe

+0

Tôi nhận được nó từ: http://msdn.microsoft.com/en-us/library/hh185009.aspx – NASM

+0

ok, xem câu trả lời của tôi. Ngoài ra, bạn có ý nghĩa gì bởi "không có gì xảy ra"? Bạn có nhận được một trang trống không? – Christophe

Trả lời

2

SPServices library sẽ làm điều đó cho bạn rất dễ dàng.

Bạn sẽ muốn sử dụng cuộc gọi this. Tôi thường đóng gói nó trong chức năng của riêng tôi để làm cho mã đẹp hơn, đặc biệt là nếu tôi đang thực hiện rất nhiều truy vấn danh sách AJAX.

Về cơ bản những gì sẽ xảy ra là SharePoint sẽ trả về một tài liệu XML xấu xí có tất cả các mục danh sách của bạn như được xác định bởi Microsoft Documentation. Bạn sẽ đi qua tài liệu này sử dụng SPServices như thế này:

<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script> 
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script> 
<script language="javascript" type="text/javascript"> 

$(document).ready(function() { 
    $().SPServices({ 
    operation: "GetListItems", 
    async: false, 
    listName: "Announcements", 
    CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>", 
    completefunc: function (xData, Status) { 
     $(xData.responseXML).SPFilterNode("z:row").each(function() { 
     var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>"; 
     $("#tasksUL").append(liHtml); 
     }); 
    } 
    }); 
}); 
</script> 
<ul id="tasksUL"/>` 

từng dòng:
<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script>
JQuery là yêu cầu của SPServices
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script>
Bao gồm SPServices
$(document).ready(function() {
"Khi DOM được tải , thực hiện chức năng này "
$().SPServices({
"Đây là một chức năng SPServices"
operation: "GetListItems",
"Chúng tôi đang sử dụng dịch vụ web 'GetListItems"
async: false,
"Không không đồng bộ, làm điều đó ngay bây giờ"
listName: "Announcements",
"Chúng tôi đang sử dụng danh sách' Thông báo "
CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>",
Đừng lo lắng về dòng này
completefunc: function (xData, Status) {
" Chạy chức năng này khi yêu cầu hoàn tất . Dữ liệu được chuyển dưới dạng xData, trạng thái hoàn thành được chuyển thành Trạng thái "
$(xData.responseXML).SPFilterNode("z:row").each(function() {
" Lấy chuỗi phản hồi và chỉ lấy các nút XML "hàng". Đối với mỗi nút này, hãy chạy hàm này ..."
var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>";
'Tạo một biến gọi là liHtml bằng thẻ li và XML thuộc tính ows_Title'
$("#tasksUL").append(liHtml);
'Nối mục danh sách này để các phần tử với một ID của' tasksUL'

+0

Vậy ... làm thế nào tôi có thể nhúng mã đó vào một tệp html? Tôi không rõ về điều đó. Chức năng trỏ đến URL SharePoint như thế nào? – NASM

+0

Sau khi xem tài liệu, tôi phải thêm một "đối số" khác vào cuộc gọi đó: URL: "MyURL.aspx". Sau đó, khi tôi mở index.html của mình, không có gì xảy ra, có vẻ như tôi đang thiếu thứ gì đó ở đây. Tôi đã sửa đổi mục nhập đầu tiên của mình để thay đổi tệp index.html – NASM

+0

Tôi rất tiếc về điều đó nhưng tôi không sở hữu danh sách SharePoint đó nên tôi không thể cung cấp URL mà không có quyền. Tôi hiểu rằng bạn giúp đỡ có thể được giới hạn về điều đó nhưng tiếc là nó không phải là dưới bàn tay của tôi. Mặc dù, cảm ơn rất nhiều cho tất cả – NASM

0

Có một số vấn đề với mã của bạn.

Đầu tiên, nó sẽ chỉ làm việc trong một trang SharePoint, không phải là độc lập, như bạn đang sử dụng chức năng SharePoint như SP.ClientContext.

thứ hai, thứ ere có vẻ là lỗi trong đoạn mã. Ví dụ: tôi nghĩ this.collList thực sự phải là var collList.

Có thể thử tham khảo khác này (nhưng một lần nữa nó sẽ chỉ làm việc trong một SharePoint 2010 hoặc 2013 trang):

http://msdn.microsoft.com/en-us/library/hh185007(v=office.14).aspx

0

Trên thực tế mã bạn đang sử dụng là cho các thư viện SPServices được viết bởi Sympmarc và trong tài liệu của nó đề cập đến nó được sử dụng trong các trang chạy trên SharePoint Context như để thực hiện cuộc gọi nó sử dụng biến __REQUESTDIGEST và điều này sẽ không có sẵn trên các trang HTML5 bình thường, các tùy chọn tôi có thể cung cấp cho bạn là:

1) Bật xác thực HTTP cơ bản vào ngày thứ e Trang web SharePoint và sau đó sử dụng chức năng $ ajax của jquery với thông tin Xác thực cơ bản trong cuộc gọi đến dịch vụ của bạn.

2) Tạo trình xử lý http có mã để thực hiện công việc của bạn và sau đó chuyển json từ jquery để đưa dữ liệu từ trình xử lý này.