We are using jsPDF in aspnet core app. Here is the scripts section:
#section Scripts{
<script src="~/lib/jsPDF/jspdf.min.js" type="text/javascript" asp-append-version="true"></script>
<script src="~/lib/jsPDF/split_text_to_size.js" type="text/javascript" asp-append-version="true"></script>
<script src="~/lib/jsPDF/standard_fonts_metrics.js" type="text/javascript" asp-append-version="true"></script>
<script src="~/lib/jsPDF/html2canvas.min.js" asp-append-version="true"></script>
<script src="~/lib/jsPDF/html.js" type="text/javascript" asp-append-version="true"></script>
<script src="~/js/dailyjobreport.js" type="text/javascript" asp-append-version="true"></script>
}
The html is received from AJAX call, and is used for pdf rendering
function onSuccess(data) {
try {
var pdf = new jsPDF({
orientation: 'portrait',
format: 'a4'
});
pdf.html(data);
pdf.save('report.pdf');
} catch (e) {
console.error(e);
}
}
The pdf that is rendered is a balnk page. Can anyone please help find us what's wrong with the code or if we are missing something
Try to use callback function to save to pdf :
<script src="https://unpkg.com/jspdf#latest/dist/jspdf.min.js"></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
Js function :
$(function () {
var pdf = new jsPDF({
orientation: 'portrait',
format: 'a4'
});
pdf.html("<html><head></head><body><h2>2asdasda123dsdasd</h2></body></html>", {
callback: function (pdf) {
pdf.save('test.pdf');
}
});
})
Related
I am taking a screenshot of a div in php using html2canvas. Script
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/html2canvas.js"></script>
<script type="text/javascript" src="js/html2canvas.min.js"></script>
<script>
function genScreenshot() {
html2canvas(document.getElementById('screen1'), {
onrendered: function(canvas) {
if (navigator.userAgent.indexOf("MSIE ") > 0 ||
navigator.userAgent.match(/Trident.*rv\:11\./))
{
var blob = canvas.msToBlob();
window.navigator.msSaveBlob(blob,'Test file.png');
}
else {
$('#test').attr('href', canvas.toDataURL("image/png"));
$('#test').val(canvas.toDataURL("image/png"));
document.getElementById("screenshot").submit();
}
}
});
}
</script>
it is working fine with desktop
With mobile it takes screenshot worngly
Help me to sort out the issue
I've created an API in API Gateway which calls a lambda function to query my RDS database and return the query results as JSON. I'm trying to call my api from JavaScript using the following code but all I'm getting in the console of the browser is 'GET https://myurl/v1/it-requests net::ERR_TIMED_OUT'. But when I run call the API from the URL it returns the query result? My JavaScript is below.
var apigClient = apigClientFactory.newClient({
apiKey: 'myApiKey',
});
var params = {
};
var body = {
};
apigClient.itRequestsGet(params, body)
.then(function(result){
console.log = JSON.stringify(result);
}).catch(function(result){
console.log = "Sorry, API Gateway is not responding";
});
<script type="text/javascript" src="lib/axios/dist/axios.standalone.js"></script>
<script type="text/javascript" src="lib/CryptoJS/rollups/hmac-sha256.js"></script>
<script type="text/javascript" src="lib/CryptoJS/rollups/sha256.js"></script>
<script type="text/javascript" src="lib/CryptoJS/components/hmac.js"></script>
<script type="text/javascript" src="lib/CryptoJS/components/enc-base64.js"></script>
<script type="text/javascript" src="lib/url-template/url-template.js"></script>
<script type="text/javascript" src="lib/apiGatewayCore/sigV4Client.js"></script>
<script type="text/javascript" src="lib/apiGatewayCore/apiGatewayClient.js"></script>
<script type="text/javascript" src="lib/apiGatewayCore/simpleHttpClient.js"></script>
<script type="text/javascript" src="lib/apiGatewayCore/utils.js"></script>
<script type="text/javascript" src="apigClient.js"></script>
Browser's have default timeouts see this you can return 202 initially and keep the connection alive while u r doing stuff, then once your processing is done end the connection.
for example:
res.status(200);
res.type('application/json');
res.write(' ');
res.flush();
const writeInterval = setInterval(() => {
res.write(' ');
res.flush();
}, 15000);
After processing is done:
res.end(JSON.stringify({
success: 1
//blah...
}));
Using auto complete in jquery. I am facing a problem which
TypeError: $(...).autocomplete is not a function
I included all the necessary script files. I am not able to understand where I made the mistake. How can I resolve this?
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery-1.9.1.js" ></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery-1.7.1.min.js" ></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery.hashchange.min.js" ></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery.easing.1.3.js" ></script>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery.tools.min.js" ></script>
<script>
$(document).ready(function () {
$('#namanyay-search-box').keyup(function (e) {
var searched = $('#namanyay-search-box').val()
$.getJSON('get_data', 'title=' + searched, function (result) {
var elements = [];
$.each(result, function (i, val) {
elements.push(val.merchant_name)
})
$('#namanyay-search-box').autocomplete({
source: elements
})
})
});
var indicator = $('#indicator'),
indicatorHalfWidth = indicator.width() / 2,
lis = $('#tabs').children('li');
$("#tabs").tabs("#content section", {
effect: 'fade',
fadeOutSpeed: 0,
fadeInSpeed: 400,
onBeforeClick: function (event, index) {
var li = lis.eq(index),
newPos = li.position().left + (li.width() / 2) - indicatorHalfWidth;
indicator.stop(true).animate({
left: newPos
}, 600, 'easeInOutExpo');
}
});
});
</script>
you are missing jQuery UI library, include the script and css files from jQuery UI
Also remove the duplicate jquery library.
download this http://code.jquery.com/ui/1.10.3/jquery-ui.js and place it in assets and add the code below
<script type="text/javascript" src="<?php echo base_url();?>assets/js/jquery-ui.js" ></script>
I've been tasked with removing all Telerik controls from our website. I'm not that good with javascript, so this is a great learning experience for me. Most of the controls are easy to understand and fairly easy to replace, but I'm stuck on one. I need to replace the RadScriptBlock in the following code:
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/jquery-migrate-1.1.0.min.js" ></script>
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/jquery.json-2.4.min.js"></script>
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/Portal/main.js" ></script>
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/Portal/popup.js" ></script>
<script type="text/javascript" src="<%=ConfigurationHandler.getStaticContentBaseURL(Request)%>js/SeoTracking.js" ></script>
Based on everything I've read, I think I need to use the following, but I'm at a total loss as to how. Any help/suggestions/resource would be greatly appreciated!!!
new Ajax.Request('/your/url', {
onSuccess: function(response) {
// Handle the response content...
}
});
So this ended up being the fix...
<script type="text/javascript" src="http://localhost:44344/js/jquery-1.9.0.min.js">
</script>
<script>
$.ajax({
url: 'AjaxOrderStepServer.aspx',
success: function () {
debugger;
var baseurl = ConfigurationHandler.getStaticContentBaseURL(Request);
var url = baseurl + "/js/jquery-migrate-1.1.0.min.js";
$.getScript(url);
url = baseurl + "/js/jquery.json-2.4.min.js";
$.getScript(url);
url = baseurl + "/js/Portal/main.js";
$.getScript(url);
url = baseurl + "/js/Portal/popup.js";
$.getScript(url);
url = baseurl + "/js/SeoTracking.js";
$.getScript(url);
}
});
I am just new to XMPP, and I am making the first "HELLO" code. Please take your time look at the following code (the .zip is at the end of this topic):
<html>
<head>
<title>Hello - Chapter 3</title>
<style type="text/css">
body {
font-family: Helvetica;
}
h1 {
text-align: center;
}
.hidden {
display: none;
}
#log {
padding: 10px;
}
</style>
<script language="javascript" type="text/javascript" src="scripts/jQuery.js"></script>
<script language="javascript" type="text/javascript" src="scripts/jQueryUI.js"></script>
<script language="javascript" type="text/javascript" src="scripts/strophe.js"></script>
<script language="javascript" type="text/javascript" src="scripts/flXHR.js"></script>
<script language="javascript" type="text/javascript" src="scripts/strophe.flxhr.js"></script>
<link rel="stylesheet" href="hello.css"></link>
<script language="javascript" type="text/javascript">
var Hello = {
connection: null,
log: function(msg) {
$("#log").append("<p>" + msg + "</p>");
}
};
$(document).ready(function() {
$("#login_dialog").dialog({
autoOpen: true,
draggable: false,
modal: true,
title: "Connect to XMPP",
buttons: {
"Connect": function() {
$(document).trigger("connect", {
jid: $("#jid").val(),
password: $("#password").val()
});
$("#password").val("");
$(this).dialog("close");
}
}
});
$(document).bind("connect", function(ev, data) {
var conn = new Strophe.Connection("http://bosh.metajack.im:5280/xmpp-httpbind");
conn.connect(data.jid, data.password, function(status) {
if (status === Strophe.Status.CONNECTED) {
$(document).trigger("connected");
} else if (status === Strophe.Status.DISCONNECTED) {
$(document).trigger("disconnected");
}
});
Hello.connection = conn;
});
$(document).bind("connected", function() {
// Inform the user
Hello.log("Connection established");
});
$(document).bind("disconnected", function() {
Hello.log("Connection terminated.");
// Remove dead connection object
Hello.connection = null;
});
});
</script>
</head>
<body>
<h1>Hello</h1>
<div id="log"></div>
<!-- Login dialog -->
<div id="login_dialog" class="hidden">
<label>JID:</label><input type="text" id="jid">
<label>Pwd:</label><input type="password" id="password">
</div>
</body>
</html>
According to the document, and the code, it must either say "Connection establised" or "Connection terminated". But it doesn't. I tried to put alert("It runs to here!"); in every line of the code, and it still alert(). It doesn't alert anymore when I put it in bind("connected") and bind("disconnect"). So I guess the code can not run to there. I've never done it before, and there is rarely documents about this, so I don't know what to do now.
Question: Could you guys please take a look at it, and tell me what was wrong? I myself is still working on debugging it!
Extra information: These are what is in my web folder (I am afraid of missing javascript framework files). All js files are latest version.
index.html
scripts/
jQuery.js
jQueryUI.js
strophe.js
flensed.js
flXHR.js
flXHR.swf
flXHR.vbs
swfobject.js
updateplayer.swf
checkplayer.js
css/
Not important...
Here are my code, please take time to view it: http://xx3004.kodingen.com/XMPP
I would appreciate any view of help.
[x]
your code is alright,
the problem is in the URL provided to make the connection using Strophe.
var conn = new Strophe.Connection("http://bosh.metajack.im:5280/xmpp-httpbind");
Try to find the location of the server, otherwise install an xmpp server(vysper), locally on your machine, and change the URL as http://localhost:8080/bosh/
Also try to comment the flxhr inclusion.
If you are running Openfire on your localhost make sure
bosh_service_url = 'http://127.0.0.1:7070/http-bind/'
ie
var conn = new Strophe.Connection("http://127.0.0.1:7070/http-bind/");
And if you are running ejabberd on your localhost make sure
bosh_service_url = "http://127.0.0.1:5222/http-bind/"