I have a controller that in nutshell is as follows:
public function download($id) {
$data = array();
force_download($data['brochure']->location, $data['brochure']->name);
$this->renderPage('site/download', $data); // simple method basically same as load->view
}
I want the page view and then after a second to force download the file - the current function downloads the file but not the view, can anyone suggest how to get around this?
Remove the line the following line from download function
force_download($data['brochure']->location, $data['brochure']->name);
Write another function
public function download_file($id) {
$data = array();
force_download($data['brochure']->location, $data['brochure']->name);
}
Now in the download view add the following javascript/jquery script:
$(document).ready(function(){
setTimeout(function(){
downloadFile('<your file location>')
},1000);
});
function downloadFile(url)
{
var iframe;
iframe = document.getElementById("download-container");
if (iframe === null)
{
iframe = document.createElement('iframe');
iframe.id = "download-container";
iframe.style.visibility = 'hidden';
document.body.appendChild(iframe);
}
iframe.src = url;
}
You need to have two actions:
To display the download page ($this->renderPage(...)).
To make the browser download the file (force_download(...)).
In the first one, you add some javascript or a meta-tag in the head to redirector to the second action after a second.
The download page will be displayed and then after a second, the download offered.
Related
I am working on making a dynamically loaded website using some php code to swap out content from various other files. While on top of that I am using jquery to beautify this swap out.
Relevant PHP:
<?php
// Set the default name
$page = 'home';
// Specify some disallowed paths
$disallowed_paths = array('js.php','css.php','index.php');
if (!empty($_GET['page'])){
$tmp_page = basename($_GET['page']);
// If it's not a disallowed path, and if the file exists, update $page
if (!in_array($tmp_page, $disallowed_paths) && file_exists("{$tmp_page}.php"))
$page = $tmp_page;
}
// Include $page
if(!file_exists("$page.php")){
$page = 'home';
}
else{
include("$page.php");}
?>
Relevant jquery:
$(function (a) {
var $body = $('body'),
$dynamo = $('.dynamo'),
$guts = $('.guts');
$body.fadeIn('slow');
if (history.pushState) {
var everPushed = false;
$dynamo.on('click', 'a', function (b) {
var toLoad = $(this).attr('href');
history.pushState(null,'',toLoad);
everPushed = true;
loadContent(toLoad);
b.preventDefault();
});
$(window).bind('popstate', function () {
if (everPushed) {
$.getScript(location.href);
}
everPushed = true;
});
} // otherwise, history is not supported, so nothing fancy here.
function loadContent(href) {
$guts.hide('slow', function () {
$guts.load(href, function () {
$guts.show('slow');
});
});
}
a.preventDefault();
});
What is happening is when I link to a page using ?page=about it will work but it will instead of just swapping out the content it will load the entire page including the content inside the dynamically loaded div.
If I were to link straight to about.php it would work beautifully with no fault whatsoever, but anybody who wanted to share that link http://example.com/about.php would get just the content with no css styling.
If I were to change the jquery in "loadContent" to:
$guts.load(href + ' .guts', function () {
EDIT 1:
, ' .guts'
to
+ ' .guts'
It would then work but any script, java, jquery, or the like would not work because it gets stripped out upon content load.
check out http://kazenracing.com/st3
EDIT 2:
It also seems to be that the site does not work properly in the wild either.
No background and none of the icons show up, but it still gets the general problem across.
I can fix that myself, it will just take some time. For now my focus is on the recursion problem.
EDIT 3: Site no longer needs to be worked on, problem never solved but we are letting that project go. So the link no longer is a valid URL.
I've created a php template with variables library and what not all pulled into an index page I've created a basic script with fades the page in and out on load and have got that working the next thing I wanted to do is to use my navbar links to pull formatted content into the page (as I'm using foundation 4 framework) now the code I tried is as follows
$(document).ready(function() {
var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
var href = $(this).attr('href');
if(hash==href.substr(0,href.length-5)){
var toLoad = hash+'.html #content';
$('#content').load(toLoad)
}
});
$('#nav li a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide('fast',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show('normal',hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
});
the idea is that onclick it removes the content with the wrapper displays a loading gif and then loads the page content which is stored in the link referred to in the
but its not working is just reloading the whole page . . . . i have tried reading up and it says that you can use
You can extract from another page using the load method thus >$('#targetElement').load('page.htm #container') syntax.
and using the get function but im not to good at all this jquery is there a way I can do it in php or where am I going wrong with what I've done.
Try this....You were calling the load, and functions inside improperly...
$('#nav li a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide('fast',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
//window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,showNewContent);
}
function showNewContent() {
$('#content').show('normal',hideLoader);
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
When a user clicks a link the browser by default unloads the current page and loads the page indicated by that link.
You need to prevent the default behavior of the browser, in order to do this you need to call the .preventDefault() method on the click event that was triggered for that link.
$('#your-context').click(function(event) {
event.preventDefault();
/**
* the rest of your code here
*/
});
How can I add redirect URL link to JS function (example form action to : session.php) in below code.
I've tried with another way code, but it still can't function.
$(document).ready(function() {
$("#submit_butt").click(function() {
var conf = {
frequency: 5000,
spread: 5,
duration: 600
};
/* do your AJAX call and processing here...
....
....
*/
// this is the call we make when the AJAX callback function indicates a login failure
$("#login").vibrate(conf);
// let's also display a notification
if($("#errormsg").text() == "")
$("#loginform").append('<p id="errormsg">Invalid username or password!</p>');
// clear the fields to discourage brute forcing :)
$("#password").val("");
document.forms['login_form'].elements['username'].focus();
});
});
You can try this
// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");
// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";
https://developer.mozilla.org/en-US/docs/DOM/window.location
Ref: How to redirect to another webpage in JavaScript/jQuery?
you can use this..
window.location.href = "http://www.google.com";
you can try
<script>
function name(){
window.location ='abc.php';
}
</script>
you can by breaking into php code inside your javascript
$(document).ready(function()
{
<?php
someFunction();
?>
});
but only if your javascript is in a php file so it can be processed by php. So if your linking to a .js file that needs to be changed to .php
I want to call an function after a href loaded new page
<a title="invitation.jpg" target="_blank" class="tabmouserptr filestuffText" href="test.html?hiddenAction=viewfile&fileIndex=5675568">invitation.jpg</a>
Javascript function need to excecute after the new page is loaded.
FileOpenCount() {
//stuff needed
}
window.onload = function(){
// your code...
};
Basically you can use as above.
As per your question, you could just call the function inside script tag, like
<script type="text/javascript">
FileOpenCount() {
//stuff needed
}
//call the function
window.onload=FileOpenCount;
</script>
Try this instead. I think you want the original page to load something once the second page is done loading. It's not directly possible using the a tag by itself. But doing something like this might work.
"atag".onclick = function() {
// open new browser window like _blank
var win = window.open("test.html?hiddenAction=viewfile&fileIndex=5675568");
// have a reference to the new window so once it's done loading, run my function
win.onload = FileOpenCount
};
I'm excited on how to do the download page similar to premiumpixels.com
Example - http://www.premiumpixels.com/freebies/custom-audio-player-skin-psd/
If we click on "download":
1) page reloads to url like premiumpixels.com/download/?file=audio-player
2) after some timeout download begins.
3) file downloads from cdn.premiumpixels.com/uploads/audio-player.zip
How do I make the same? How its done on php?
Also, I would like to send some mysql request when download page is opened, to update file downloads stats.
Thanks.
Use Javascript's setTimeout function and then redirect the browser to the download resource.
Looks like this is the source that site uses:
jQuery(function () {
// get the GET variables
var theme = getUrlVars();
var downloadLink = 'http://cdn.premiumpixels.com/uploads/' + theme['file'] + '.zip';
if(theme['file'])
{
jQuery('#downloadLink').attr('href', downloadLink);
delayedDownload();
}
function delayedDownload()
{
timeoutID = window.setTimeout(downloadTheme, 1000);
}
function downloadTheme()
{
window.location.replace(downloadLink);
//window.open(downloadLink,'','menubar=1,location=1,toolbar=1,width=600,height=500');
}
// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}
});
1.) User clicks on a link - e.g. download.php?id=my-app-id;
2.) In download.php you do your fancy mysql update stuff
3.) Then you redirect to the actual download file: header("Location: /folder/for/downloadcontent/download.zip");
For SEO Friendly urls use RewriteRule in .htaccess file
Or, you could use a response of type MIME/Multipart, where you send the HTML page in the first part, and the file in the other part, then you don't need to use javascript at all :)
Or even a simple meta tag refresh in your page header:
<meta http-equiv="refresh" content="5; url=http://example.com/myfile">