I want to create a view for back button using HTML. Actually condition is that that view of backbutton should be connected to the another page when once if we operate the web page.
Hello you need to override the backbutton, then load your HTML page.
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown() {
document.getElementById("target_div").innerHTML='<object type="text/html" data="target_page.html"></object>';
}
Related
Hi guys I am trying to click a button in my Vue.js page to a different .html page that exist in my public folder.
So I am using this way
<button #click="window.location='public/test.html'">See Results</button>
However I get an error that says
"Property or method "window" is not defined on the instance but referenced during render"
How do i navigate to a different page in Vue.js?
I would recommend using vue-router if you're doing the spa approach. It will prevent your page from refreshing when you go to a different page and it will be much faster. But if you don't want to do that you could just use an anchor tag to handle the navigation for you.
<a href="/test.html">
<button>See Results</button>
</a>
You can try to call a method #click="navigateToTestHtml" and put your code in it
methods: {
navigateToTestHtml() {
window.location='public/test.html'
}
}
However, as Vue is a Single Page Application I think it would be better to create another page and add routing for it. Vue Routing Docs
You can't write 'window' into button tag, because window is not defined.I suggest that can write into 'methods',eg:
methods: {
goToHtml() {
window.location = 'public/test.html';
}
}
But, if you use vue.js, I recommend you use vue-router. One page navigate to another page, eg:
methods: {
goToPage() {
this.$router.push('/another/page');
}
}
vue-router navigation usage
I have a text message that my ionic app retrieves from an api that has an anchor link which needs to redirect to another page when tapped.
The html from the api is:
Tap Here
The ionic function is:
goToOtherPage(): void {
this.navCtrl.push(OtherPage);
}
I have tried:
<a onclick="goToOtherPage()">Tap Here</a>
and
Tap Here
but the first two give the message:
goToOtherPage is not defined
and the last one does nothing.
Does anyone know how I can trigger a function from dynamically retrieved html?
This will not work due to the DomSantizer that sanitizes unsafe html. I recommend retrieving the different parts of the message (eg. using JSON) and generating the page link and message via your page/component.
I am new to GWT. How do i load different and static HTML pages on the client side via button clicks. Have read up and do not wish to go into RPC, frames, client bundles and the following page:
best way to externalize HTML in GWT apps?
If client bundles are the closest i can get, may I have a very simple example, assuming that i have 4 HTML pages to be loaded on the client side, navigable by button clicks?
From my understanding, these individual pages may be created by UIBinders - please correct me if I'm wrong.
I have only the following code to display another page upon click, which is not working the way I want it. Also it gives a 403 error:
button.addClickHandler (new ClickHandler(){
#Override
public void onClick (ClickEvent event){
//Window.alert("Hello again");
String winUrl = GWT.getModuleBaseURL();
String winName = "Testing Window";
openNewWindow (winName, winUrl);
}
});
If you don't care about the state of your browser client page, then something like:
Window.Location.replace(newUrl);
Then the html page you point to in newUrl may or may not load the same java script as the current page.
If you do care about keeping the state of your browser client page and just want to avoid loading your static page at initial load time (by default all your pages get loaded at once), then code splitting is your friend. The principle is to wrap the code showing your new page around an async call defining the code split, something like:
GWT.runAsync(new RunAsyncCallback()
{
#Override
public void onFailure(Throwable reason)
{
Window.alert("Error in fetching the split javascript for page ...");
}
#Override
public void onSuccess()
{
// Code to setup and show your new static page instead of the current page.
// This code will be in a javascript file that won't be loaded at initial page load.
// You must make sure though that the below code does not use/include common code.
RootPanel.get().clear();
RootPanel.get().add(newWidget);
}
});
I guess it is as simple as:
Window.Location.assign("MenuPage.html");
This is my web structure. In which all link contents are opened in iFrame when link is clicked.
Say I have clicked on 1st link (not Home page) , it gets open in iFrame,contents are displayed properly,all ok. But as I press refresh button expected is shlould load same page whose link I have clicked,but instead of that it loads Home page.
How should I be on same page after refresh also?
I'm using php for server side scripting. Thanks!
Edit:
I tried to store visited page name in session variable and then while loading Home page I check like
$_Session['visited']='/pages/neworder.html';
if(isset($_Session['visited']))
{
echo "<script>window.location.href=</script>".$_Session['visited'];
}
But didnt work!
I think the simplest way is with Jquery. If you make your website use anchors, for example
http://yoursite.com/#page-example
example
When you refresh the page, you will still be accessing this anchor. With jquery you can get this value and do some stuff based on that. So!
var hash = $(this).attr('href').split('#')[1];
This will get that # value, you can compare that in javascript then, or use a switch to determine what to do or simulate the page change.
Server side: Link sends GET request to the page and the src of the iFrame is set by the server.
-OR-
Client side: Add onclick function on the links which changes the src atribute for example with the following code:
document.getElementById('Iframe').src="new link";
-OR-
<iframe src="startin_link" name="iframe_a"></iframe>
<p>link</p>
Pure html.
EDIT: If you want to stay in the page... I suggest you use the first option. Example:
<a href='?page=1'>Some link</a>
then on server side:
if(!is_null($_GET['page'])){
$iframeLink=arrayOfLinks[$_GET['page']];
}else{
$iframeLink="Starting Link";
}
and the iFrame should look like this:
<iframe src='<?php echo $iframeLink; ?>'></iframe>
I'm developing a web site where I want the left menu to stay fix, while the content of the clicked option is loaded.
Actually, what I do is that each menu link using AJAX it return the requested content. Everything works fine but I would like to avoid it because then statistics are difficult to follow (among some other things like Google boots).
How can I do the same affect/similar (http://www.foundcrelamps.com/) without javascript?
What I would do is a bit different. I'd make the links on the menu valid links that point to the content. Eg Contacte to point to http://www.foundcrelamps.com/contacte so that if you paste that link in the browser, it will load the page directly.
Then keep the ajax, so that the user does not reload the whole page on every click.
You can use History.js to keep the browser history and modify the URL so that back/next buttons work, even with ajax.
Edit, if you use conventional a elements with standard href it might look like this:
$('a').click(function(){
$('YOUR CONTAINER').load($(this).attr('href'));
return false; // so that it does not load the whole page
});
Then on the server you should do something like this:
/* AJAX check */
$isAjax = false;
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']==='XMLHttpRequest') {
$isAjax = true;
}
if (!$isAjax) {
outputHeader();
}
outputMainContent();
if (!$isAjax) {
outputFooter();
}
This way when you do ajax, you will load only the inner content. When not, it will load the whole page.
There is an alternative method - you might load the whole page with jQuery but only use inner part of the html to replace the original content.