I have this line that works when I click the word Test:
Test
How can I re-code this so I do not have to click the word Test or select anything, just have it execute?
This should be simple, just starring at it to long.......
Update: This sort of works. It will open SearchThis.php but not in the target window, only the window it was executed from. This is inside php and the last line. I am close to a solution.....
header("Location:\\SerchThis.php target=SearchThisFrame");
Thanks to Gerben we have a solution. I cant tell you how many post and how many searches I did for this solution, nothing worked except this one. I have added code to include passing a php generated variable. I placed this script at the very end, past the last ?> and before the /body tag in order to pick up the varable.
<script>
window.open('SearchThis.php?passthis=<?php echo "Variable"; ?>', 'SearchThisFrame');
</script>
<script>
window.open('SearchThis.php', 'SearchThisFrame');
</script>
Related
We're working on adding a number of custom pages to our LMS solution which act as simple redirects to other areas of the system. We have been through a few iterations of trying to get this to work (as the system only likes certain code) and we've managed to get the following to work:
<script>
setTimeout(function(){location.href="/redirect/to/newpage.html"} , 250;')
</script>
However, we want to make it a bit simpler for them to update (as we fear they'll break something) and want them to put the URL in a variable at the start of the code and call that in the redirect code. We'll also use the variable to drive a "if you're not redirected within x, click here" link at the bottom.
We've tried a number of things including adding:
<script>
redir = "/redirect/to/newpage.html";
</script>
and then calling back into the redirect code... but no matter what we try, it doesn't seem to recognise it. The rest of the page is purely a loading image within the main LMS framework.
Help?
Try this:
<script>
var redir = "/redirect/to/newpage.html"; // declare variable with var
</script>
Then
<script>
setTimeout(function(){location.href=redir} , 250); // fixed a little typo here
</script>
I have many pages on my website with some 404 errors because some pages are down under construction. How can i add something to my 404.html page to redirect the user back to the page they came from before they come to visit the 404.html
You can use javascript. Check this:
http://www.w3schools.com/jsref/met_his_back.asp
<script>
function goBack()
{
window.history.back()
}
</script>
<body>
<button onclick="goBack()">Go Back</button>
</body>
If you want to redirect the user back automatically, just use the history.back() method, but instead make it a script that runs onload:
<body onload="history.back()"></body>
You should probably only run this function after a couple of seconds though, otherwise the reader would have no idea what happened to them, and they'll just keep trying that link. To make the function run after 5 seconds, change your onload to:
setTimeout('history.back()', 1000*5)
the multiplication by 1000 is to change seconds to milliseconds (setTimeout works with milliseconds only).
Is this question about adding a back button, or about adding something to the 404 error page?
If it's the latter this may be a solution if you are using apache: https://www.digitalocean.com/community/articles/how-to-create-a-custom-404-page-in-apache
In an attempt to fudge a workaround for the weird "viewers cannot leave comments" issue in google sites*, I wrote the following silly test script:
function addComment(e) {
var currentPage = SitesApp.getActivePage();
var pageHTML = currentPage.getHtmlContent();
var newHTML = pageHTML.replace("BEGIN", "BEGIN "+Session.getActiveUser().getEmail());
currentPage.setHtmlContent(newHTML);
};
When the user presses the button, the current page content should be changed to include the current user's email address right after the word BEGIN (which I manually inserted- if this works I can just stick in a comment tag thingamabob.
This more or less works. The problem is that the setHtmlContent call does all sorts of weird things to the apps script gadget that contains the button in the first place. Here's the gadget before:
<img src="https://www.google.com/chart?chc=sites&cht=d&chdp=sites&chl=%5B%5BGoogle+Apps+Script'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22Apps+Script+Gadget%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D197'dim'%5C%3D10'%3D10'%3D500'%3D197'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&sig=TbGPi2pnqyuhJ_BfSq_CO5U6FOI" data-origsrc="https://sites.google.com/a/macros/kstf.org/s/AKfycbzEsLBQucXCZZJwEh9c3RYhn81uJucvz3R5vHeJ2w/exec" data-type="maestro" data-props="align:left;borderTitle:Apps Script Gadget;height:200;showBorder:false;showBorderTitle:false;" width="500" height="200" style="display:block;text-align:left;margin-right:auto;"></div>
and here it is after:
<img src="https://www.google.com/chart?chc=sites&cht=d&chdp=sites&chl=%5B%5BGoogle+Gadget'%3D20'f%5Cv'a%5C%3D0'10'%3D499'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22Include+gadget+(iframe)%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D500'%3D197'dim'%5C%3D10'%3D10'%3D500'%3D197'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&sig=CvjXRgodwYVKPvmsyZR7EbHx2uM" data-igsrc="http://0.gmodules.com/ig/ifr?mid=0&synd=trogedit&url=http%3A%2F%2Fwww.gstatic.com%2Fsites-gadgets%2Fiframe%2Fiframe.xml&up_iframeURL=%2Fa%2Fmacros%2Fkstf.org%2Fs%2FAKfycbzEsLBQucXCZZJwEh9c3RYhn81uJucvz3R5vHeJ2w%2Fexec%3Fmid%3DACjPJvFOqF88RUUrqDeapp1PHF_lI3Xc3g5Hd3euTifzUYeaILmTTlMfBQ13yI_6%26bc%3Dtransparent%26f%3DArial%2C%2BVerdana%2C%2Bsans-serif%26tc%3D%2523444444%26lc%3D%25230033cc&up_scroll=no&w=100%&h=200" data-type="ggs-gadget" data-props="height:200;igsrc:http#58//0.gmodules.com/ig/ifr?mid=0&synd=trogedit&url=http%3A%2F%2Fwww.gstatic.com%2Fsites-gadgets%2Fiframe%2Fiframe.xml&up_iframeURL=%2Fa%2Fmacros%2Fkstf.org%2Fs%2FAKfycbzEsLBQucXCZZJwEh9c3RYhn81uJucvz3R5vHeJ2w%2Fexec%3Fmid%3DACjPJvFOqF88RUUrqDeapp1PHF_lI3Xc3g5Hd3euTifzUYeaILmTTlMfBQ13yI_6%26bc%3Dtransparent%26f%3DArial%2C%2BVerdana%2C%2Bsans-serif%26tc%3D%2523444444%26lc%3D%25230033cc&up_scroll=no&w=100%&h=200;mid:0;spec:http#58//www.gstatic.com/sites-gadgets/iframe/iframe.xml;up_iframeURL:/a/macros/kstf.org/s/AKfycbzEsLBQucXCZZJwEh9c3RYhn81uJucvz3R5vHeJ2w/exec?mid=ACjPJvFOqF88RUUrqDeapp1PHF_lI3Xc3g5Hd3euTifzUYeaILmTTlMfBQ13yI_6&bc=transparent&f=Arial,+Verdana,+sans-serif&tc=%23444444&lc=%230033cc;up_scroll:no;width:100%;" width="500" height="200" style="display:block;text-align:left;margin-right:auto;" class="igm"></div>
As best as I can tell, the "hey please set this as your HTML" method seems to be doing some chicanery to make certain that the document is properly parsed, but it's getting caught up in a tail-chasing effect of the iframe redirect. If I could hand in some DOM or something similar, this wouldn't be an issue.
Any advice? This was just a kind of exercise to see if I could finesse the visitor comment system anyway, so I'll probably just take another approach.
*: I know about several other ways to handle visitor comments, but this system needs to be able to work on many site pages, for many site authors in an apps domain, without needing complicated setup on the part of the site author. Eventually, I'll use something else (probably a variation on one of the two app engine forum systems I found this morning), but this was a quick stab at an interim solution. Next interim step is to save these data to the site DB and lay out the comments in the gadget itself. Gadget sizing is unsatisfying, however - I'd rather have the comments right in the page instead of in a separate iframe that has its own scroll bars.
First of all, the getEmail() method doesn't work with consumer accounts or when people outside your domain visit the site (unless your script runs as the user accessing the app)
Next, when you change the HTML of a page, it doesn't make the change immediately, but should happen on the next refresh.
Having said that, what you could do is have your script display the comments as well. You can have labels in your script that display previous comments.
I am simply trying to increment the amount of page views per visit with CodeIgniter's active record. For some reason, the following code is incrementing twice. So it adds 2 page views per visit. What is strange is that this is used on another website that shares the same table and the same method code and it works properly on the other website. The views field is a simple int(11). I am only calling this method once in the controller, I thought maybe I had a duplicate but I do not.
function increment_video_view($video_pk) {
$this->db->where('video_pk', $video_pk);
$this->db->set('views', 'views+1', FALSE);
$this->db->update('videos');
}
Any ideas or help would be great! Thanks!
Try putting an echo (or log) statement inside the function to see if it actually gets called twice. Let us know if it only echo's once.
function increment_video_view($video_pk) {
echo "We in increment_video_view";
$this->db->where('video_pk', $video_pk);
$this->db->set('views', 'views+1', FALSE);
$this->db->update('videos');
}
Are you sure that the controller is executed only once?
This happens when you have a 404 link (image/css/favicon) in your HTML, or if you have a missing favicon.ico
Chrome looks for a favicon.ico even if you don't insert it in your HTML, and when it finds it missing, I think it calls another request.
I'm currently trying to build a new website, nothing special, nice and small, but I'm stuck at the very beginning.
My problems are clean URLs and page navigation. I want to do it "the right way".
What I would like to have:
I use CodeIgniter to get clean URLs like
"www.example.com/hello/world"
jQuery helps me using ajax, so I can
.load() additional content
Now I want to use HTML5 features like pushstate to
get rid of the # in the URL
It should be possible to go back and forth without a page refresh but the page will still display the right content according to the current URL.
It should also be possible to reload a page without getting a 404 error. The site should exist thanks to CodeIgniter. (there is a controller and a view)
For example:
A very basic website. Two links, called "foo" and "bar" and a emtpy div box beneath them.
The basic URL is example.com
When you click on "foo" the URL changes to "example.com/foo" without reloading and the div box gets new content with jQuery .load(). The same goes for the other link, just of course different content and URL.
After clicking "foo" and then "bar" the back button will bring me back to "example.com/foo" with the according content. If I load this link directly or refresh the page, it will look the same. No 404 error or something.
Just think about this page and tell me how you would do this.
I would really love to have this kind of navigation and so I tried several things.
So far...
I know how to use CodeIgniter to get the URLs like this. I know how to use jQuery to load additional content and while I don't fully understand the html5 pushstate stuff, I at least got it to work somehow.
But I can't get it to work all together.
My code right now is a mess, that's the reason I don't really want to post it here. I looked at different tutorials and copy pasted some code together. Would be better to upload my CI folder I guess.
Some of the tutorials I looked at:
Dive into HTML5
HTML5 demos
Mozilla manipulating the browser history
Saner HTML5 history
Github: History.js
(max. number of links reached :/)
I think my main problem is, that everybody tries to make it compatible with all browsers and different versions, adds scripts/jQuery plugins and whatnot and I get confused by all the additional code. There is more code between my script-tags then actual html content.
Could somebody post the most basic method how to use HTML5 for my example page?
My failed attemp:
On my test page, when I go back, the URL changes, but the div box will still show the same content, not the old one. I also don't know how to change the URL in the script according to the href attribute from the link. Is there something like $(this).attr('href'), that changes according to which link I click? Right now I would have to use a script for every link, which of course is bad.
When I refresh the site, CodeIgniter kicks in and loads the view, but really only the view by itself, the one I loaded with ajax, not the whole page. But I guess that should be easy to fix with a layout and the right controller settings. Haven't paid much attention to this yet.
Thanks in advance for any help.
If you have suggestions, ideas, or simple just want to mention something, please let me know.
regards
DiLer
I've put up a successful minimal example of HTML5 history here: http://cairo140.github.com/html5-history-example/one.html
The easiest way to get into HTML5 pushstate in my opinion is to ignore the framework for a while and use the most simplistic state transition possible: a wholesale replacement of the <body> and <title> elements. Outside of those elements, the rest of the markup is probably just boilerplate, although if it varies (e.g., if you change the class on HTML in the backend), you can adapt that.
What a dynamic backend like CI does is essentially fake the existence of data at particular locations (identified by the URL) by generating it dynamically on the fly. We can abstract away from the effect of the framework by literally creating the resources and putting them in locations through which your web server (Apache, probably) will simply identify them and feed them on through. We'll have a very simple file system structure relative to the domain root:
/one.html
/two.html
/assets/application.js
Those are the only three files we're working with.
Here's the code for the two HTML files. If you're at the level when you're dealing with HTML5 features, you should be able to understand the markup, but if I didn't make something clear, just leave a comment, and I'll walk you through it:
one.html
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script src="assets/application.js"></script>
<title>One</title>
</head>
<body>
<div class="container">
<h1>One</h1>
Two
</div>
</body>
</html>
two.html
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script src="assets/application.js"></script>
<title>Two</title>
</head>
<body>
<div class="container">
<h1>Two</h1>
One
</div>
</body>
</html>
You'll notice that if you load one.html through your browser, you can click on the link to two.html, which will load and display a new page. And from two.html, you can do the same back to one.html. Cool.
Now, for the history part:
assets/application.js
$(function(){
var replacePage = function(url) {
$.ajax({
url: url,
type: 'get',
dataType: 'html',
success: function(data){
var dom = $(data);
var title = dom.filter('title').text();
var html = dom.filter('.container').html();
$('title').text(title);
$('.container').html(html);
}
});
}
$('a').live('click', function(e){
history.pushState(null, null, this.href);
replacePage(this.href);
e.preventDefault();
});
$(window).bind('popstate', function(){
replacePage(location.pathname);
});
});
How it works
I define replacePage within the jQuery ready callback to do some straightforward loading of the URL in the argument and to replace the contents of the title and .container elements with those retrieved remotely.
The live call means that any link clicked on the page will trigger the callback, and the callback pushes the state to the href in the link and calls replacePage. It also uses e.preventDefault to prevent the link from being processed the normal way.
Finally, there's a popstate event that fires when a user uses browser-based page navigation (back, forward). We bind a simple callback to that event. Of note is that I couldn't get the version on the Dive Into HTML page to work for some reason in FF for Mac. No clue why.
How to extend it
This extremely basic example can more or less be transplanted onto any site because it does a very uncreative transition: HTML replacement. I suggest you can use this as a foundation and transition into more creative transitions. One example of what you could do would be to emulate what Github does with the directory navigation in its repositories. It's an intermediate manoever that requires floats and overflow management. You could start with a simpler transition like appending the .container in the loaded page to the DOM and then animating the old container to {height: 0}.
Addressing your specific "For example"
You're on the right track for using HTML5 history, but you need to clarify your idea of exactly what /foo and /bar will contain. Basically, you're going to have three pages: /, /foo, and /bar. / will have an empty container div. /foo will be identical to / except in that container div has some foo content in it. /bar will be identical to /foo except in that the container div has some bar content in it. Now, the question comes to how you would extract the contents of the container through Javascript. Assuming that your /foo body tag looked something like this:
<body>
foo
bar
<div class="container">foo</div>
</body>
Then you would extract it from the response data through var html = $(data).filter('.container').html() and then put it back into the parent page through $('.container').html(html). You use filter instead of the much more reasonable find because from some wacky reason, jQuery's DOM parser produces a jQuery object containing every child of the head and every child of the body elements instead of just a jQuery object wrapping the html element. I don't know why.
The rest is just adapting this back into the "vanilla" version above. If you are stuck at any particular stage, let me know, and I can guide you better though it.
Code
https://github.com/cairo140/html5-history-example
Try this in your controller:
if (!$this->input->is_ajax_request())
$this->load->view('header');
$this->load->view('your_view', $data);
if (!$this->input->is_ajax_request())
$this->load->view('footer');