Below is the script used to display a attachment of a list item using web service.
<script type="text/javascript" src="/Test/js/SPAPI_Core.js"></script>
<script type="text/javascript" src="/Test/js/SPAPI_Lists.js"></script>
<script type="text/javascript">
function getAttachments(List,ID){
var lists = new SPAPI_Lists('Your File name');
var items = lists.getAttachmentCollection(List,ID);
if (items.status == 200){
var rows = items.responseXML.getElementsByTagName('Attachment');
var str="";
for (var i=0; i<rows.length; i++){
temp=rows[i].childNodes[0].nodeValue;
fileName=temp.substring(temp.lastIndexOf('/')+1);
str+=''+fileName+''+"<br />";
}
document.getElementById("att"+ID).innerHTML = str;
}else{
alert('There was an error: ' + items.statusText);
}
}
</script>
<xsl:if test="normalize-space(#Attachments) != '0'">
<div id="att{#ID}" style="padding: 10px;"></div>
<script type="text/javascript">
getAttachments("Posts",<xsl:value-of select="#ID"/>);
</script> </xsl:if>
reference URL: http://www.codeproject.com/Articles/31895/Displaying-Attachments-with-the-Data-View-Web-Part
The above script is used to display attachments... but no use...
please help me if im missing something
Thanks in advance
I followed instructions from your reference link and it worked.
This is what I did.
Downloaded SPAPI_Core and SPAPI_list hs files under siteassets/js folder.
dropped your script above in a content editor web part in the page.
Added your XSL Code above to my xsl file.
It worked. Just make sure to change your site path and list name.
Related
I am using the following remarketing tag on the ecommerce sites provided by Adwords:
<script type="text/javascript">
var google_tag_params = {
ecomm_prodid: "REPLACE_WITH_STRING_VALUE",
ecomm_pagetype: "REPLACE_WITH_STRING_VALUE",
ecomm_totalvalue: REPLACE_WITH_STRING_VALUE
};
</script>
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = xxxxxxxx;
var google_custom_params = window.google_tag_params;
var google_remarketing_only = true;
/* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/xxxxxxxx/?value=0&guid=ON&script=0"/>
</div>
</noscript>
In some cases (user added a product to the cart, user made an order) I am using webhooks to inform about the actions and it is necessary to send the remarketing data server side. My question is how does the remarketing tag look like using Measurement protocol?
Thanks.
In Wicked_pdf I have several sections. Each section is starts a new page and is started by a header like so:
<h2 class="section" style="color: #0050b2;font: arial, sans-serif;font-size: 17;">Application details</h2>
In my header I would like to display the section name on the first and all subsequent pages that belong to this section. I know that this would be Javascript / jQuery, but my skills in this area are woefully inadequate.
Any help would be greatly appreciated.
Take a look at this code snippet below, taken from WickedPDF Readme:
<html>
<head>
<script>
function number_pages() {
var vars={};
var x=document.location.search.substring(1).split('&');
for(var i in x) {var z=x[i].split('=',2);vars[z[0]] = unescape(z[1]);}
var x=['frompage','topage','page','webpage','section','subsection','subsubsection'];
for(var i in x) {
var y = document.getElementsByClassName(x[i]);
for(var j=0; j<y.length; ++j) y[j].textContent = vars[x[i]];
}
}
</script>
</head>
<body onload="number_pages()">
Page <span class="page"></span> of <span class="topage"></span>
</body>
</html>
Especially this line:
var x=['frompage','topage','page','webpage','section','subsection','subsubsection'];
These are special parameters made available on each PDF pages, accessible via document.location.search. For your case, luckily subsection contains the text content of element in your PDF pages.
Now, to achieve the dynamic header, in your controller you need to specify the :header, and point it to an erb file which contains:
<html>
<head>
<script>
function subst() {
var vars={};
var x=document.location.search.substring(1).split('&');
for(var i in x) {var z=x[i].split('=',2);vars[z[0]] = unescape(z[1]);}
document.getElementById('dynamic-header').innerHTML = vars['section'];
}
</script>
</head>
<body onload="subst()">
<h2 id="dynamic-header">Replace me!</h2>
</body>
</html>
The header will be replaced by the element found inside your PDF page. This also solves your dynamic requirement, because vars['section'] will contain the same content until it finds another with different content. Please note that I haven't tested the code above, but I hope you get the idea.
I have a Razor for loop:
#foreach (var user in Model.Users)
{
<p class="active-text">Active: #user.LastActive</p>
}
I've just installed moment.js to format this DateTime() date using js.
How can I pass the Razor model into a javascript function? I do have a JS viewmodel for this page, I'm just trying to avoid serializing the entire Model just because I need to apply some JS to a single field. How my viewModel stands right now:
<script type="text/javascript">
$(document).ready(ko.applyBindings(new SubjectVm()));
</script>
I would wrap the date text in another span for later processing:
<p class="active-text">Active: <span class="active-text-date">#user.LastActive</span></p>
Then loop through and apply the formatting, inside document.load:
<script>
$(document).ready(function() {
$(".active-text-date").each(function() {
var date = $(this).text();
var formatted = moment(date).calendar();
$(this).text(formatted);
});
});
</script>
I have two pages. For explanations sake I'll call them page A and Page B. When I open page B in my browser it is rendered with all the styling and jquery ui code working properly, but when I open page B inside of a div in Page A via the load() method, the only thing that renders is the raw html, no styling, no interfaces. What is the problem? Directly below is the code from page B and all the way at the bottom is the code from page A:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> //jquery ui
<link rel="stylesheet" href="http://spilot.koding.com/lbStyle.css"/> //stylesheet
<script src="http://www.parsecdn.com/js/parse-1.2.2.min.js"></script> //parse database
<script>
$(function(){
var crowd = ' ';
var ageGroup = ' ';
var activity = [];
var scene = [];
var neighborhood = [];
var date = [];
var details = [];
var time = [];
Parse.initialize("ivHLAO7z9ml1bBglUNuPSgcWabXe3UeE2yCgKM2x","gNeGt04lU7xcew893EvbEJ05qqc4POVhBsIBSCVj");
$(".menu").menu({
select: function (event, ui) {
$('.selected', this).removeClass('selected');
var selection = ui.item.addClass('selected').children('a').attr('name'); //add background color to selected menu item and get its attribute name
var choice = ui.item.text(); //get text of menu selection
if(selection == "ageGroup"){
$("#ageGroup").text(choice); //change the text in the first <a> of ageGroup menu to ageGroup selection.
ageGroup = $("#ageGroup").text();
}else{
crowd = selection;
};
} // closes select function
}); // closes menu
$("button").click(function(){
var city = JSON.parse( localStorage.getItem('city') );
var niche = Parse.Object.extend(crowd);
var query = new Parse.Query(niche);
query.equalTo("ageGroup", ageGroup);
query.equalTo("city", city);
//query.include([activity.date.details.location.neighborhood.time])
query.find({
success: function(results) {
for (i = 0; i < results.length; i++){
activity = results[i].get("activity");
scene = results[i].get("location");
neighborhood = results[i].get("neighborhood");
date = results[i].get("date");
details = results[i].get("details");
time = results[i].get("time");
};
},
error: function(error) {
alert("Error: " + error.code + " " + error.message);
}
});
//alert("working");
}); //closes click()
}); // close function()
</script>
<script>
$(function(){
$( "button" ).button();
});
</script>
</head>
<body>
<div id="div1">
<button>Button label</button>
<div id="div2">
<ul class="menu">
<li>
Age Group
<ul>
<li>18-21</li>
<li>21-30</li>
<li>30-40</li>
<li>40-50</li>
<li>50-60</li>
<li>60-70</li>
<li>70-80</li>
<li>80-90</li>
<li>90-100</li>
</ul>
</li>
</ul>
</div>
<div id="div3">
<ul class="menu" id="menu">
<li><img src="" alt="" /><h2>Academic: Art Studies</h2></li>
<li><img src="" alt="" /><h2>Academic: Literature</h2></li>
<li><img src="" alt="" /><h2>Academic: Social Sciences</h2></li>
<li><img src="" alt="" /><h2>Academic: Physical/Natural Sciences</h2></li>
</ul>
</div>
</div>
</body>
</html>
--------------//PAGE A//--------------
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(function(){
$("#mainDiv").load("http://myURl.com/find2.html"); //this is where I call load()
});
</script>
</head>
<body>
//this is the div where I want the other page to load
<div id="mainDiv">
</div>
</body>
</html>
since you are loading page "b" into page "a", you need to have all page "b" stylesheets/js in page "a" header.
please note that you are loading a complete html page into page "a", that includes html,header,body and that is not desirable, you should make page "b" a template that only contains the markup you need.
UPDATE:
you are embedding your scripts in the html, that is a bad practice, separate the JS code to different files.
When you include JS code in your file it will run as soon as the page loads, so if you put 'pageb' code in 'pagea' it will run as soon as 'pagea' was loaded and when you load 'pageb' the code will not run again.
You need to put 'pageb' code in a function and call it only after you loaded 'pageb' content.
I'm not asking how to get a fixed footer.
I've a structure with both multi-page and single page.
I'd like to know how to use only one html fragment for the whole site. I'm really looking for a solution because I'd like to edit the footer in only one place and see the modification in all pages.
Thanks.
EDIT:
I'm developing a mobile application to be wrapped with PhoneGap, so I'm looking for client side solutions.
SOLUTION (pushing together the solutions by #maco and adapting them to my case):
$(function() {
// load the templates
$('body').append('<div id="module"></div>');
$('#module').load('templates/module.html :jqmData(role="page")',function() {
// save the actual footer and header
var hdhtml = $('#module :jqmData(role="header")').clone();
var fthtml = $('#module :jqmData(role="footer")').clone();
// removes the header/footer
$(':jqmData(role="header")').remove();
$(':jqmData(role="footer")').remove();
// load at the correct place the header/footer
$(':jqmData(role="page")').prepend(hdhtml).append(fthtml).page().trigger('pagecreate');
// delete the temporary div
$($(this).html()).replaceAll(this).attr('id', 'module');
});
// set the class "ui-btn-active" for the active page
$(document).live('pagecreate', function() {
// get the current page
var currentPage = window.location.pathname;
currentPage = currentPage.substring(currentPage.lastIndexOf("/") + 1, currentPage.length).split("&")[0];
// remove the class from the footer
$($.mobile.activePage + ':jqmData(role="footer") li a')
.removeClass('ui-btn-active ui-state-persist');
// add the class to the link that points to the particular href
$($.mobile.activePage + ':jqmData(role="footer") li a[href="' + currentPage + '"]').addClass('ui-btn-active ui-state-persist');
});
});
module.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>module header</h1>
</div>
<div data-role="footer" class="ui-bar">
<h3>module footer</h3>
</div>
</div>
</body>
</html>
module.js (load this in all pages)
function module() {
var fthtml = $('#module :jqmData(role="footer")').clone();
$(':jqmData(role="footer")').remove();
$(':jqmData(role="page")').append(fthtml).page().trigger('pagecreate');
}
$(function(){
$('body').append('<div id="module"></div>');
$('#module').load('YOUR_module.html_PATH :jqmData(role="page")',function(){
$($(this).html()).replaceAll(this).attr('id','module');
module();
});
$(':jqmData(role="page")').live('pageinit',module);
});
YOUR_module.html_PATH (eg. "../module.html", "../module/module.html")
If you are generating HTML pages server side,
You can use your server language (php,java,node) templating capabilities to insert a HTML from common file.
i.e. for jsp
</div>
<jsp:include page="scripts/footer.jsp" />
.....
</body>
And if you are doing heavy stuff in javascript than use any javascript templating engine.
ie.e http://handlebarsjs.com/
I solved this by creating partial footer view and calling it where I need it: #Html.Partial("Footer")