When I execute an alert, the alert shows and disappears too quickly. I want it to stay open. What is problem?
After I submit form:
newAlert('success', 'saved');
function newAlert(type, message) {
$('#alert-area').append($("<div class='alert " + type + "'><p> "
+ message + "
</p></div>"));
}
<div id="alert-area"></div>
Im not good at jquery, so I try your question with js, its ok. The "alert-area" div did not disappear. This is my code :
<html>
<head></head>
<body>
<div id="alert-area"></div>
<script type="text/javascript">
window.onload = newAlert('success', 'saved');
function newAlert(type, message) {
document.getElementById('alert-area').innerHTML="<div class='alert " + type + "'><p> " + message + "</p></div>";
}
</script>
</body>
<html>
Related
Trying to print PDF through iframe
WebDriverWait wait_iframe = new WebDriverWait(driver, 20000);
wait_iframe.until(ExpectedConditions.visibilityOfElementLocated((By.id("printpdf"))));
Expected result is bill pdf print should be visible on the screen, but actual output it is throwing an error message i.e Error: Permission denied to access property "print"
Browser code:
var urlBase = url + '?title=' + escape(data.url);
var iframe = '<iframe id="printpdf" src="' + urlBase + '" frameborder="0" width="100%" height="100%"></iframe>';
$("#loadPdf").empty().html(iframe);
$('#printpdf').on("load", function() {
printPDF();
});
function printPDF() {
var frame = document.getElementById("printpdf");
frame.focus();
frame.contentWindow.print();
}
I created a java script for creating a PDF file using jsPDF and its working on all the latest version of browser including IE11,chrome and firefox .
below is the code
<html>
<head>
<link rel="stylesheet" type="text/css" href="Wrs_Export_Report.css">
<script src="html2canvas.js"></script>
<script src="jspdf.debug.js"></script>
<script type="text/javascript">
function PDF()
{
var vTable = '<br>';
vTable += '<table class="wrs_export">';
vTable += '<tr class="wrs_export">';
vTable += '<th class = "wrs_export">Radio ID</th>';
vTable += '<th class = "wrs_export">Description</th>';
vTable += '<th class = "wrs_export" colspan="2">Additional Info</th>';
vTable += '<th class = "wrs_export">Location</th>';
vTable += '<th class = "wrs_export">Start Time</th>';
vTable += '<th class = "wrs_export">Duration</th>';
vTable += '<th class = "wrs_export">Result</th>';
vTable += '<th class = "wrs_export">Failure Type</th>';
vTable += '<th class = "wrs_export">Corrective Action</th>';
vTable += '</tr>';
var vDiv = document.getElementById('test');
vDiv.innerHTML = vTable;
alert("vDiv is");
alert(vDiv);
var pdf = new jsPDF('p', 'pt', 'letter');
alert("pdf is");
alert(pdf);
html2canvas(vDiv, {
onrendered: function (canvas)
{ alert("html2canvas is");
var imgData = canvas.toDataURL('image/png',1.0);
pdf.addImage(imgData, 'PNG', 0, 0);
pdf.save('example.pdf');
}
});
}
</script>
</head>
<body onload = "PDF();">
<div id="test" class="but">Some text </div>
</body>
</html>
But when i am putting this HTML page in a remote server then this line var pdf = new jsPDF('p', 'pt', 'letter'); does not execute for IE-11 and i am not able create the PDF. But I am able to do it with Chrome and Firefox.
My remote server is an arm board running Linux and has an IP address . Using the IP address i am accessing the HTML page from my computer and executing it .
So is it that jsPDF is not supported in remote server for IE-11 ??
[ Sorry i kept some alert messages for debugging purpose]
Please need some assistance on this
Cheers,
Sid
I have the following script that I'm trying to run with PhantomJS v 1.9.8.
var page = require('webpage').create();
page.content =
"<!DOCTYPE html>" +
"<html> " +
" <head></head> " +
" <body> " +
" <h1>Test</h1> " +
" </body> " +
"</html>";
page.onLoadFinished = function(status) {
//page.render('C:\\PDFTemp\\test.pdf', { format: 'pdf' }); // <-- Works
page.render('/dev/stdout', { format: 'pdf' }); // <- Gives me 0 bytes
phantom.exit();
};
When I run the page.render to write as a file, it works perfectly. However, rendering to stdout gives me nothing.
Note: I'm running version 1.9.8. Version 2.0 doesn't like to play nice with ASP.Net, but 1.9.8 works great.
What am I doing wrong here?
I need to create a screen which automates Google search.
I know JavaScript and I'm trying to get GSE works.
I have a search engine and an API key.
The problem is Google's documentation is cyclic i.e. pages point to each other.
There is no working sample from where I can start my research.
Please help if you know of a working sample.
The documents I have read are:
cselement-devguide
introduction
I know this is an old question, but here is what I did to make the API results formatted like the Google Site Search used to give since they are ending the paid accounts and will have ads now. The API way has an option to pay still for over 100 searches per day, so going with that but had to format the results still, and used the existing one to build the css to do similar styling also.
Search form going to this page is just a simple:
<form action="search-results.htm" id="cse-search-box">
<div>
<input class="" name="q" type="text">
<input class="" type="submit">
</div>
</form>
and then the search results page:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>JSON/Atom Custom Search API Example</title>
<!--<link href="default.css" rel="stylesheet" type="text/css">-->
<link href="google.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="gsc-result-info" id="resInfo-0"></div>
<hr/>
<div id="googleContent"></div>
<script>
//Handler for response from google.
function hndlr(response) {
if (response.items == null) {
//Sometimes there is a strange thing with the results where it says there are 34 results/4 pages, but when you click through to 3 then there is only 30, so page 4 is invalid now.
//So if we get to the invalid one, send them back a page.
window.location.replace("searchresults.htm?start=" + (start - 10) + "&q=" + query);
return;
}
//Search results load time
document.getElementById("resInfo-0").innerHTML = "About " + response.searchInformation.formattedTotalResults + " results (" + response.searchInformation.formattedSearchTime + " seconds)";
//Clear the div first, CMS is inserting a space for some reason.
document.getElementById("googleContent").innerHTML = "";
//Loop through each item in search results
for (var i = 0; i < response.items.length; i++) {
var item = response.items[i];
var content = "";
content += "<div class='gs-webResult gs-result'>" +
"<table class='gsc-table-result'><tbody><tr>";
//Thumbnail image
if (item.pagemap.cse_thumbnail != null)
content += "<td class='gsc-table-cell-thumbnail gsc-thumbnail'><div class='gs-image-box gs-web-image-box gs-web-image-box-portrait'><a class='gs-image' href='" + item.link + "'>" +
"<img class='gs-image' class = 'gs-image-box gs-web-image-box gs-web-image-box-portrait' src='" + item.pagemap.cse_thumbnail[0].src + "'></a></td>";
//Link
content += "<td><a class='gs-title' href='" + item.link + "'>" + item.htmlTitle + "</a><br/>";
//File format for PDF, etc.
if (item.fileFormat != null)
content += "<div class='gs-fileFormat'><span class='gs-fileFormat'>File Format: </span><span class='gs-fileFormatType'>" + item.fileFormat + "</span></div>";
//description text and URL text.
content += item.htmlSnippet.replace('<br>','') + "<br/><div class='gs-bidi-start-align gs-visibleUrl gs-visibleUrl-long' dir='ltr' style='word-break:break-all;'>" + item.htmlFormattedUrl +"</div>" +
"<br/></td></tr></tbody></table></div>";
document.getElementById("googleContent").innerHTML += content;
}
//Page Controls
var totalPages = Math.ceil(response.searchInformation.totalResults / 10);
console.log(totalPages);
var currentPage = Math.floor(start / 10 + 1);
console.log(currentPage);
var pageControls = "<div class='gsc-results'><div class='gsc-cursor-box gs-bidi-start-align' dir='ltr'><div class='gsc-cursor'>";
//Page change controls, 10 max.
for (var x = 1; x <= totalPages && x<=10; x++) {
pageControls += "<div class='gsc-cursor-page";
if (x === currentPage)
pageControls += " gsc-cursor-current-page";
var pageLinkStart = x * 10 - 9;
pageControls+="'><a href='search-results.htm?start="+pageLinkStart+"&q="+query+"'>"+x+"</a></div>";
}
pageControls += "</div></div></div>";
document.getElementById("googleContent").innerHTML += pageControls;
}
//Get search text from query string.
var query = document.URL.substr(document.URL.indexOf("q=") + 2);
var start = document.URL.substr(document.URL.indexOf("start=") + 6, 2);
if (start === "1&" || document.URL.indexOf("start=") === -1)
start = 1;
//Load the script src dynamically to load script with query to call.
// DOM: Create the script element
var jsElm = document.createElement("script");
// set the type attribute
jsElm.type = "application/javascript";
// make the script element load file
jsElm.src = "https://www.googleapis.com/customsearch/v1?key=yourApikeyhere&cx=yoursearchengineidhere&start="+start+"&q=" +query +"&callback=hndlr";
// finally insert the element to the body element in order to load the script
document.body.appendChild(jsElm);
</script>
</body>
</html>
I'm trying to use MediaElement.js on a site and everything works great in every browser but IE, most specifically IE9 (I'm not too concerned with supporting below IE9 at the moment). I'm populating the ME dynamically which I've read can cause problems in IE specifically, but I'm just not sure if there is a workaround. The reason I'm doing it this way is because this is a portfolio site where all project data gets loaded through a getJSON call and once loaded all projects get populated with their appropriate data and created on the fly. There are several video projects. I've dumbed the code down to an example outside of my project which essentially goes through this same behavior. If I just write the HTML out and control in JS it works but when I create the HTML through JS and then try to play I get the error log (in the creation of ME player in the code). Here is the code:
$(function() {
var details = {
width: 640,
height: 480,
src: 'work/television/1'
},
$body = $('body'),
$vid = $('<video width="' + details.width + '" height="' + details.height + '" preload="none" id="vidPlayer1"></video>'),
$mp4 = $('<source src="' + details.src + '.mp4" type="video/mp4" title="mp4">'),
$webm = $('<source src="' + details.src + '.webm" type="video/webm" title="webm">'),
$ogg = $('<source src="' + details.src + '.ogv" type="video/ogg" title="ogg">'),
$flash = $('<object width="' + details.width + '" height="' + details.height + '" type="application/x-shockwave-flash" data="swf/flashmediaelement.swf"><param name="movie" value="swf/flashmediaelement.swf"><param name="flashvars" value="controls=true&file=' + details.src + '.mp4"></object>'),
$error = $('<p>The available video formats are not supported by your browser. :(</p>'),
$controls = $('<div class="videoControls playBtn"></div>');
$body.append($controls);
$vid.append($mp4);
$vid.append($webm);
$vid.append($ogg);
$vid.append($flash);
$vid.insertAfter($controls);
var vidPlayer = new MediaElementPlayer('#vidPlayer1', {
features: [],
// mode: 'shim',
pluginPath: 'swf/',
success: function(mediaElement) {
console.log('success', mediaElement);
},
error: function() {
console.log('Error loading player. Please try again.');
}
});
$body.on('click', function(evt) {
vidPlayer.play();
});
});
Any help would be tremendously appreciated.
problem solved. for anyone interested, had to combine my appends into one call so $vid became:
$vid = $('<video width="' + details.width + '" height="' + details.height + '" preload="none" id="vidPlayer-' + row + '-' + slide + '"><source src="' + details.src + '.mp4" type="video/mp4" title="mp4"><source src="' + details.src + '.webm" type="video/webm" title="webm"><source src="' + details.src + '.ogv" type="video/ogg" title="ogg"><p>The available video formats are not supported by your browser. :(</p></video>')
just had to put it all in one statement and IE9 recognized it properly. The issue was by appending as I was doing the source variables never got appended and thus IE didn't know what the source of my video was.
Hope this helps someone in the future.