We Keep Coding

Button onclick event does not redirect to another page although it calls the functions

The following code does not redirect to the given webpage
<form>
<button onclick='window.location.replace("../magnet/index.php")'>Replace document</button>
</form>

It is so because when you create a button within the form tags, it is created as a submit button by default. So, instead of redirecting the webpage, it submits the data and reloads the current webpage.
The following code will do the required job because now, the type of the button is button and not submit.
<button type="button" onclick='window.location.replace("../magnet/index.php")'>Replace document</button>

Even better, you can place your redirect code into a JavaScript function. Then you can call that function from within your HTML code. Like this
<script type="text/javascript">
<!--
function redirectTo(sUrl) {
window.location = sUrl
}
//-->
</script>
<button onclick="redirectTo('../magnet/index.php')">Get HTML!</button>
Hope this will work for you. Cheers

The answer was to add type="button" like #shivamag00 explained.
But be careful with replace(), it's not possible to use "back" to navigate back to the original document since you are replacing the history state.
An alternative is to use the assign() function, (documentation here)
Suppose you have a base url as
www.website.come
and want to go to
www.website.come/new-page
it's simple
<button type="button" onclick='window.location.assign("new-page")'>Go to new page</button>
It's worked for me, hope it's useful for someone else.

entering input causing link change

This sort of links back to a previous question that I made. The goal was to change the iframe src with a text input. After lots of experimentation, it worked. However, this has arisen a new problem. After I enter the link and submit it, it adds /?link=linkhere to the end of the page and refreshes it. Then, once it's refreshed, the original src comes back, making it useless.
Here's the most important code:
<iframe
id="minecraftFrame"
src="//classic.minecraft.net"
height="500"
width="800"
frameborder="0"
scrolling="no"
allowfullscreen="true">
</iframe>
<input type="text" id="myInput" name="input">
<button class="button" onclick="changeChannel()">Go</button>
<script>
function changeChannel(){
document.getElementById("iFrame").src = document.getElementById("myInput").value;
}
</script>
I'm unsure of what to try at this point, since I'm not too experienced with javascript. I just don't want the main page to refresh after change the src.

You need to prevent default, i.e. stop event bubbling which is resulting in reload. See if that works for you. Seems like it should as you are submitting the form which would result in refresh of the page.
function changeChannel() {
event.preventDefault();
// ...
}

Your code included this --- document.getElementById("iFrame").src
the id of the iframe is "minecraftFrame" and not "iFrame"
or you could use document.querySelector('iFrame')
and stop the page reload with
function changeChannel(e) {
e.preventDefault();
// Code goes here
}

How can I cancel/stop uploading of a file in IE javascript

I have a page with two forms. One of them is not visible and contains input type="file". I am uploading file with the hidden form(target of the form is an iframe element). My question is how to stop/cancel uploading of the file with javascript under IE. I have tried to remove the hidden form with JQuery and the file is still uploading.
Thanks in advance.

OK. I found this site looking for the same thing but these solutions did not work for my scenario. I too have an iframe target for my form and wanted to cancel the upload. These solutions did not work for some reason (IE7). I hope the following helps.
The issue was that the response sent from the servlet indicating 'file too big' was not triggering the target iframe onload event.
Try:
targetIframe.contentWindow.document.open()
targetIframe.contentWindow.document.close()
This fooled the iframe onload event into triggering and cancelled the upload automatically.

You probably want something along the lines of window.stop() (applied to the iframe).
This old thread reports that while window.stop() doesn't work in IE, the undocumented window.document.execCommand("Stop") does (at least in IE5).
You might also consult this StackOverflow page, which has basically the same answer, although a few other tricks are proposed.

Thanks for the replies.
As far as I debugged that case I got the following result :) - it is not possible to cancel upload. The methods above cancelled the page to receive the response and the file is uploading to the server side.
Here is the mark up of my prototype:
<form id="form1" runat="server">
<div>
<asp:ScriptManager runat="server" ID="ScriptManager1"></asp:ScriptManager>
<input type="button" id="button1" value="stopUpload" onclick="stopUpload()"/>
<script type="text/javascript">
function stopUpload() {
var frame = $get("iframe1");
frame.contentWindow.document.execCommand("Stop");
}
</script>
</div>
</form>
<form id="form2" enctype="multipart/form-data" action="http://localhost/TestingSite/Default.aspx"
method="POST" target="iframe1">
<input type="submit" />
<input type="file" name="FileUploadTest" id="FileUploadTest"/>
</form>
<iframe id="iframe1" name="iframe1" width="500px" height="500px" ></iframe>

jquery form submit

I have a jquery fancyzoom box. In that box ,I have a contact form which sends an email on submission. But I am not able to call form submit function due to fancyzoom.
Code is like :
("req_quote.php")
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/fancyzoom.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#popup1_link').fancyZoom({width:610});
$("#submit").css('cursor', 'pointer');
$('.reqfrm').submit( function(){
alert("hell");
});
});
</script>
<body>
<form class="reqfrm" id="frm">
<input type="text" name="name" />
<input type="submit" name="submit" id="submit" value="Submit" />
</form>
</body>
</html>
Above file is included in "index.php" which contains the actual link to open the form in fancyzoom box.
(index.php)
< a href="#popup1" id="popup1_link">< div class="blink">Request a Quote< /a>"
If I remove $('#popup1_link').fancyZoom({width:610}); then i get alert on submission otherwise it goes on form action directly.

Are you getting any JavaScript errors with the fancyZoom call in? Are you including the script file you need to use it? It's hard to say without seeing some more data, or a jsbin / jsfiddle.

The form is submitted in the fancybox js file.

As mentioned by Raul, you need to provide more info for us to help out. You could try any of these things:
See if you can reproduce this issue within a simple html file, that doesn't have any of the extra stuff that your current page may have. If the issue still persists, put it into jsFiddle and post the link here.
If you haven't already, install the Firebug addon for Firefox, and use it's console to check for any JS errors.
Have a look at the jsFiddle that I've created. Is this similar to what you are doing? Mine works wihtout any issues.

JS Function to create link - how?

I have the following code in my html
<input type="image" src=images/more.png onClick="showInviteInfo() />
When clicked it brings up a pop up box via this js function.
function showInviteInfo(){
document.getElementById("divsignup").style.visibility = "visible";
document.getElementById("txtemail").focus();
}
But I no longer want it to bring up pop up rather when clicked take user to a new page. What do I need to change? Probably easy, but I am a newbie.

Use
window.location = "new location path";
in your function.
window.location
If you can use an anchor tag then it would be like this.
Click here to navigate to new page

change
<input type="image" src=images/more.png onClick="showInviteInfo() />
to
<img src="images/more.png" />
EDIT: sorry, the editor was giving me grief with the second line