有没有办法从同一个列表中检索项目并将它们注入不同的页面?
Is there a way to retrieve items from the same list and inject them onto different pages?
我正在通过 ajax 调用从列表中提取项目。我构建 html 并将这些项目注入页面;我想抓取相同的项目并将它们注入不同的页面,样式不同。有没有办法 link 2 ajax 调用来获取相同的项目?
$.ajax({
url: "/cyberSecurity/_api/web/lists/GetByTitle('phishingExamples')/items",
method: 'GET',
headers: {
'Accept': 'application/json; odata=verbose'
},
success: function(data) {
var items = data.d.results;
console.log(items);
var phishing = $('#phishing');
var phishingCards;
//Max of cards on page
var start = Math.max(0, items.length-4);
console.log(start);
for (let i = start; i < items.length; i++) {
phishingCards = '<div class="col-sm-6 col-md-6 col-lg-3 mb-3">' +
'<div style="background-color: #004685; height: 340px; position: relative;" class="card backImg2 ">' +
'<div style="color: #fff;" class="card-body ">' +
'<h5 style="color: #ffe01a;" class="card-title ">' + items[i].Title + '</h5>' +
'<p style="margin-bottom: -5px;" class="card-text ">' + items[i].Description + '</p>' +
'<div style="width: 100%; margin: 0 auto; position: absolute; bottom: 0;right: 0" class="row "><a style=" background-color: #ffe01a!important; color: black!important; border: none; width: 100%;" href= "'+ items[i].Image.Url +'"class="btn btn-primary btn-sm" target=_blank>More Info</a></div>' +
'</div>' +
'</div>' +
'</div>';
phishing.prepend(phishingCards);
}
},
error: function(data) {
console.log('Error: ' + data);
}
});
// End Service Icons //End Service Icons
这是我目前的代码
您可以将代码分成不同的部分。并专注于不同的任务。
var build_phishingCards = function(items){
var phishing = $('#phishing');
var phishingCards = ;
...
phishing.prepend(phishingCards);
}
var url1 = "/cyberSecurity/_api/web/lists/GetByTitle('phishingExamples')/items";
var handle_ajax = fucntion(url){
$.ajax({
url: url,
method: 'GET',
headers: {
'Accept': 'application/json; odata=verbose'
},
success: function(data) {
var items = data.d.results;
// only check out the data here. like, Array.isArray(items)
// call different function to do
if(data.layout == 'another'){
build_phishingCards(items);
}else{
build_AnOtherCards(items); // same list param
}
},
error: function(data) {
console.log('Error: ' + data);
}
});
}
handle_ajax(url1);
编辑:
var build_AnOtherCards = function(items){
var phishing = $('#phishing');
// handle other page layout
var AnOtherCards = '<div ...>';
...
phishing.prepend(AnOtherCards);
}
我正在通过 ajax 调用从列表中提取项目。我构建 html 并将这些项目注入页面;我想抓取相同的项目并将它们注入不同的页面,样式不同。有没有办法 link 2 ajax 调用来获取相同的项目?
$.ajax({
url: "/cyberSecurity/_api/web/lists/GetByTitle('phishingExamples')/items",
method: 'GET',
headers: {
'Accept': 'application/json; odata=verbose'
},
success: function(data) {
var items = data.d.results;
console.log(items);
var phishing = $('#phishing');
var phishingCards;
//Max of cards on page
var start = Math.max(0, items.length-4);
console.log(start);
for (let i = start; i < items.length; i++) {
phishingCards = '<div class="col-sm-6 col-md-6 col-lg-3 mb-3">' +
'<div style="background-color: #004685; height: 340px; position: relative;" class="card backImg2 ">' +
'<div style="color: #fff;" class="card-body ">' +
'<h5 style="color: #ffe01a;" class="card-title ">' + items[i].Title + '</h5>' +
'<p style="margin-bottom: -5px;" class="card-text ">' + items[i].Description + '</p>' +
'<div style="width: 100%; margin: 0 auto; position: absolute; bottom: 0;right: 0" class="row "><a style=" background-color: #ffe01a!important; color: black!important; border: none; width: 100%;" href= "'+ items[i].Image.Url +'"class="btn btn-primary btn-sm" target=_blank>More Info</a></div>' +
'</div>' +
'</div>' +
'</div>';
phishing.prepend(phishingCards);
}
},
error: function(data) {
console.log('Error: ' + data);
}
});
// End Service Icons //End Service Icons
这是我目前的代码
您可以将代码分成不同的部分。并专注于不同的任务。
var build_phishingCards = function(items){
var phishing = $('#phishing');
var phishingCards = ;
...
phishing.prepend(phishingCards);
}
var url1 = "/cyberSecurity/_api/web/lists/GetByTitle('phishingExamples')/items";
var handle_ajax = fucntion(url){
$.ajax({
url: url,
method: 'GET',
headers: {
'Accept': 'application/json; odata=verbose'
},
success: function(data) {
var items = data.d.results;
// only check out the data here. like, Array.isArray(items)
// call different function to do
if(data.layout == 'another'){
build_phishingCards(items);
}else{
build_AnOtherCards(items); // same list param
}
},
error: function(data) {
console.log('Error: ' + data);
}
});
}
handle_ajax(url1);
编辑:
var build_AnOtherCards = function(items){
var phishing = $('#phishing');
// handle other page layout
var AnOtherCards = '<div ...>';
...
phishing.prepend(AnOtherCards);
}