javascript : window.location.href/window.open is not working on iframe - javascript

Updated Code
<div>
<button type="button" class="submit btn btn-default" id="btnSubmit">Submit
</button>
<button type="button">Cancel</button>
</div>
<script>
$("#btnSubmit").click(function(e)
{
e.preventDefault();
//btn Click validation and code submission goes here..
alert("Form has been successfully submitted");
window.open("http://....../viewmyrequest.aspx","_self");
}
</script>
window.location.href is working only on debug mode and redirect to other window is not happening if i turned off debug mode.
i have explored many StackOverflow questions with the same topic but i haven't got any solid response for this issue.
window.location.href = "http://testwebsite.com/viewtickets.aspx"
i have tried for other options too
window.location = "http://testwebsite.com/viewtickets.aspx"
window.location.replace = "http://testwebsite.com/viewtickets.aspx"

Try this. Works cross browser in all my sites.
loc = "http://testwebsite.com/viewtickets.aspx";
window.open(loc,'_self');
EDITED:
This may work better for you..
<script>
function setURL(url){
document.getElementById('iframe').src = url;
}
</script>
<iframe id="iframe" src="idreesinc.com/research.html" />
<input type="button" onclick="setURL('URLHere')" />
It will insert the correct URL into the iframe.

I am 99% sure the issue is you are using a submit button and that is submitting the form which is not allowing your JavaScript to run. So either you need to set the type to be a button and not a submit button OR you need to cancel the click action.
<button type="button" ... >
or
<button onclick="foo(); return false;" ... >

Related

Change url onclick without javascript or jquery

How can I change url location in same window onlick without script for this button:
<button type="submit" name="select" value="true" onclick="window.open('/newurl')" class="btn btn-default2 btn-block"><i class="fa fa-car"></i>Search</button>
Now it goes back 1, but instead I want it to go to some url.
EDIT: how can I do it with javascript instead?
HTML
changing the script
'onclick="location=\'somewhereelse.html\'; return false ', 'cancel');
using a link
Cancel
Best solution if you need to submit the form: redirect from server using a redirect header
Please try to use window.open in your button text.
'onclick="window.open(\'<url>\')"'
Try this :
<button type="button" onclick="window.location.href='your_link_here.html'">Click me</button>
window.location.href returns the href (URL) of the current page (_self).

Redirecting to site from an existing button being clicked

I'm quite new to coding. I have a button with the ID='test'. I want to run a line of code in javascript or HTML to redirect users to a site when that button is clicked.
Button:
<button id="test" type="submit" onclick="setNick(document.getElementById('nick').value); return false; return false" class="btn btn-play-guest btn-success btn-needs-server primaryButton" data-itr="play_as_guest">
I tried running this:
<script>
document.getElementById("test").onclick = window.location='http://www.google.com/'
</script>
However, this would redirect straight away. I want it to redirect only when the button is clicked. Please help me fix this.
Many thanks.
You are assigning the redirect to the button where you need to assign it to a function.
You can try something like this:
document.getElementById("test").onclick = function(){
window.location='http://www.google.com/';
}
I would suggest use onclick on button, for example
your button will look like this
<button id="test" onclick="redirect()">Redirect</button>
Now in the script write the redirect function as
<script>
function redirect() {
window.location.href = "http://www.google.com/";
}
</script>

window.history.back() not working.

I cant get this to work. I have been trying for ages. Please help me.
<script>
function goBack() {
window.history.back()
}
</script>
<button onclick="goBack()">Go Back</button>
Please have a look at this question: Inconsistency with window.history.back().
this
<button type="button" onclick="goBack()">Go Back</button>
could be what you're looking for
As Kevin B suggests
The browser could be interpreting the button as a submit button and
submitting the form, thus causing a page refresh. Adding type="button"
will prevent that.
First of all, you should make sure that your script tag have the proper type set:
<script type="text/javascript">
...
</script>
Also, I would suggest using the "go" function of the history object instead since the compatibility is higher. To simplify things you can simply do this:
<button onclick="javascript:history.go(-1)">Go Back</button>
Hope this helps.
This can stop it appearing to work
<a href="#" onclick=DoSomething()>Stop it working</a>
That's because the href will effectively add a new page in the history, the present page again
Incidently if you call
event.preventDefault()
in DoSomething then # will never get added to the history and it will appear to work again
This worked for me
<button type="reset" onclick="goBack()">Go Back</button>
The window.history.back() method does not work if it does not have any previous URL to go to. Your program needs to have a start URL and you will need to have your program moving forward to the next page to be able to go back and forward.
Try preventing the default action of the button. Note that nothing will happen if you have accessed no other pages in the current tab.
Javascript:
<button id="goBack">Go Back</button>
<span id="result"></span>
<script>
document.getElementById("goBack").addEventListener("click", function(event){
event.preventDefault();
document.getElementById("result").innerHTML = "Going back";
window.history.back();
});
</script>
jQuery:
<button id="goBack">Go Back</button>
<span id="result"></span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$('#goBack').click(function(event){
event.preventDefault();
document.getElementById("result").innerHTML = "Going back";
window.history.back();
});
</script>
Go Back
The 'return false;' bit helped fix it for me
Actually for working of this you need to redirect to this website from any other website or if you are doing on local html file then you can just open any website and paste the link of your local file in search bar in that tab(don't open a new tab) and then it will work. Basically this fuction just press the back button of your browser so you need to have something so that it can go back.

Form dynamic attribute changing and submission not working

I have the following code:
Html:
<form action="/" id="mainForm" method="get">
<input type="text" name="val1" />
<button id="cmdSubmit">Submit</button>
</form>
<button id="cmdSubmit2">Submit 2</button>
Javascript:
$("#cmdSubmit2").bind('click', function () {
Submit2();
});
var Submit2 = function() {
var form = $("#mainForm").clone();
form.attr("action", "/testing");
form.submit();
}
What I'm trying to do is dynamically change the action attribute of a form with javascript and then submit it (to a different url).
What I expect to happen (in JsFiddle) is that clicking the submit button should load the jsfiddle home page, and clicking the Submit2 button should load a 404 page since the /testing url doesn't exist.
This works fine in chrome (28.0.1500.95), but does not work in Firefox (23.0.1) or IE for that matter(10.0.9200.16660).
None of these browser show any errors in the console either - I'm stumped. Any ideas?
JSFiddle
EDIT: I do actually have to clone the form, forgot to mention that. Also, this works fine in Safari (v5.1.7).
You need to somehow insert it in the DOM :
function Submit2() {
var form = $("#mainForm").clone();
form.attr("action", "/testing");
form.hide().appendTo('body');
form.submit();
}
fiddle
Works for me (FF 23.0)
You don't need to clone() the form. Try this:
var Submit2 = function() {
var form = $("#mainForm");
form.prop("action", "/testing");
form.submit();
}
Updated fiddle

Button disable after clicking issue

I have a submit button in my login page. I want to disable the submit button after clicking once.I'ts working fine with this.disabled = true; query and after disable the button it's going to the next page. The problem is that when I press back button it's still is disable because the page is not reloaded from server,It's loading from the local cache. I want to enable the button every time when I come back to the login page. I can clear the cache but there is some problem like if it will load from the server and project will be slow. What will be the best way to do this?
<script>
$(document).ready(function(){
$(document).on('click','button',function(){
this.disabled = true
window.location="https://www.google.co.in/"
})
})
</script>
<body>
<button type="submit" id="button">Click Me!</button>
</body>
I set the buttons initial disabled attribute to disabled in the body html to prove that the code does enable it again (so you can remove that in the body)
I hope this helps:
<script>
$(document).ready(function () {
$("#button").removeAttr('disabled');
$("#button").click(function(){
$(this).attr('disabled','disabled');
window.location="https://www.google.co.in/"
});
});
</script>
<body>
<button type="submit" id="button" disabled="disabled">Click Me!</button>
</body>
You need another event that ensures the button is enabled on page load. Kind of like:
<script>
$(document).ready(function(){
$("#button").disabled = false;
$(document).on('click','button',function(){
this.disabled = true
window.location="https://www.google.co.in/"
})
})
</script>
<body>
<button type="submit" id="button">Click Me!</button>
</body>
I didn't try running this so I'm not sure if the syntax is 100% but it should give you the right idea.

Categories