cancel Submit code not working - javascript

I have a problem with my cancel submit code.
I have used the javascript code for canceling/stopping the submit function on my page but it's not working properly.
It is working in some point but it's not enough.. I'm looking for a solution to this problem please try to help me..
Here's my code for stopping the submit function..
<script language="JavaScript">
function mySubmit(evt)
{
evt.preventDefault();
try
{
someBug();
}
catch (e)
{
throw new Error(e.message);
}
return false;
}
}
</script>
And in form
<form id="form1" runat="server" onsubmit="return mySubmitFunction()">
At first it seems that it's working properly because my page is not blinking or refreshing after I click a button but suddenly I noticed that the page is still refreshing but its not blinking .. look at this screenshot
Notice that the logo is loading after I click the move to left button? look at the red line with arrowhead ..
So I tried to use the onclientclick function and put the return mySubmitFunction in it but same result
Here is the code
<asp:Button ID="Button2" runat="server" Text=">>>"
CssClass="button button-primary"
onclick="Button2_Click" onclientclick="return mySubmitFunction()" />
hope you can help me with this thank you i'm new to javascript ^_^
I'm using ASP.NET C#
Ignore the total data in the screenshot ^_^ I didn't click save that's why its not updating yet..

Check this Example..specify event in onclick onclick="mySubmitFunction(event)"
<!DOCTYPE html>
<html>
<body>
<a id="myAnchor" onclick="mySubmitFunction(event)" href="http://w3schools.com/">Go to W3Schools.com</a>
<p>The preventDefault() method will prevent the link above from following the URL.</p>
<script>
/*document.getElementById("myAnchor").addEventListener("click", function(event){
event.preventDefault()
});*/
function mySubmitFunction(event){
alert(event)
event.preventDefault();
}
</script>
</body>
</html>

I see that in the tags you said you use jquery, this can be done easy with jquery instead pure javascript, hre you have an example.
http://codepen.io/xploshioOn/pen/ogJWKp
html
<form id="form1">
<input type="text">
<input type="submit">
</form>
jquery
$('#form1').submit(function(e){
e.preventDefault();
alert("asd");
});
the alert is just to be sure the function is executing...

Related

jQuery hide doesn't hide any content in vb.net/asp.net webform

I am trying to hide my content by clicking the button. But when the page is loading, content is hiding but after finishing page load content is showed. This content doesn't hide. I am using Visual Studio 2017 community and asp.net/vb.net framework. But the same JQuery code is working on my text editor and my browser.
Here is my sample code:
<p id="justp" class="testcls">Hi Hide me!</p>
<asp:Button ID="testbtn" runat="server" Text="hide me" />
<script>
$(function () {
$('#testbtn').click(function () {
$('.testcls').hide();
});
});
</script>
I am try to passing alert inside hide() and it is run successfully :
$('.testcls').hide(alert("Hello"));
What is the problem?
How can I solve this?
In case your are just using this button to hide/show your content on the client side (no server side calculation or something like that) use a normal input / button tag:
Replace this:
<asp:Button ID="testbtn" runat="server" Text="hide me" />
With this line:
<button type="button" id="testbtn">Hide me!</button>
As mentioned above this solution will only work if you don't need to submit any data.
What is the problem?
The button submits your form after the click so the page will be refreshed and the view will return to the default status.
How can I solve this?
You've several ways to change this behavior :
if you have got a control on the asp code you could remove the runat="server" to prevent the button from submitting :
<asp:Button ID="testbtn" Text="hide me" />
You could simply add the return false; statement at the end of the event.
Another way is preventing the default behavior using preventDefault() like :
$('#testbtn').click(function (e) {
e.preventDefault();
$('.testcls').hide();
});
The one that I recommend to you is using UseSubmitBehavior:
<asp:Button ID="testbtn" runat="server" UseSubmitBehavior="false" Text="hide me" />
Last choice is using the plain HTML code like :
<button type="button" id="testbtn">Hide me!</button>

submit a form without using a submit button

I am trying to submit this for without using a submit button. Here I have used javascript and once the form has submitted user should be directed to the B.php.
html code
<form id="jsform" action="B.php" method="POST" target="_blank">
<input type="hidden" value="test" name="title"/>
</form>
java-script code
<script type="text/javascript">
document.getElementById('jsform').submit();
</script>
These 2 code lines run separately but not running together. Any mistakes have I done.
In javascript you can do this:
window.onload=function() {
document.getElementById("jsform").submit(); // using ID
}
And with jQuery
$(function() {
$("#jsform").submit(); // using ID
});
I write my comment as an actual answer this time.
Drop target="_blank" and it should work just fine. Otherwise your browser might see it as a popup.
Also make sure your JS is run after your form.
Use form name to submit
document.myform.submit();

Input with submit wont execute If/else statement

This looks very simple but I cant get it working. Im not experianced in web design but here is the following:
I am trying to make input bar(like search box) that when entered specific text it redirects you to other page or makes somethign else.
Here is what I have so far.
<!DOCTYPE html>
<html>
<body>
<form method="post">
<input id="search" type="text"/>
<button onclick="return abc()">test</button>
</form>
<script>
function abc() {
var textt = document.getElementById("search");
if (textt.value == "test") {
window.location.assign("http://www.google.com")
}
}
</script>
</body>
</html>
http://jsfiddle.net/uvnyd8vz/1/
this just refreshes page and thats it. Any ideas? thanks!
Compare the value as string
Like
textt.value =="test";
Also inside the function write
event.preventDefault();
This will stop the submit action of submit button
Also specify the else condition i.e.
else{return false;}
Adding event.preventDefault(); to function fixed my problem! thanks

Redirect with new tab in javascript

I did a new tab function if I click a submit button using java script. The problem is the location of the parent page, if I click submit button there's a new tab but if I insert a code of location changing it doesn't work . Please help me.
<script type="text/javascript">
$("form").submit(function() {
$("form").attr('target', '_blank');
return true;
});
</script>
<form action="test.php" method="POST" target="_blank">
<input type="submit" name="submit" value="Submit" onclick="document.location.href='home.php';"/>
</form>
Although I'm not really sure why you want to do this, it seems that mixing up the change of the document.location.href while the submit event is happening generates some kind of conflict.
In order to separate those two I came up with the following approach by postponing the setting of document.location.href using setTimeout. Here's a working DEMO.
HTML
<form action="test.php" method="POST" target="_blank">
<input type="button" id="submit-btn" value="Submit" />
</form>
JS
$('#submit-btn').on('click', function () {
setTimeout(function () { document.location.href = 'test.php'; }, 100);
$("form").attr('target', '_blank');
$("form").submit();
});
I would set the attributes like:
attr("action", "location.php");
Then edit the onclick like window.location.href
Don't know if this is what you wanted and if helped

More submit button disabling on click with Jquery, doesn't work

I got this code here:
It works fine as far as disabling and replacing the Submit button goes, but it will not submit the form. My form uses the 'get' method and submits data to another page.
<script type="text/JavaScript">
$('.button').click(function() {
$('.button').remove();
$('.holder').append("DONT DOUBLE CLICK ANYTHING IN A BROWSER");
$('.form').submit();
});
</script>
I have tried most things, including changing .form to the id of my form, still no joy, any ideas would be helpful.
HTML code
<form action="liftingConfirm.asp" method="get" id="frmArchiveConfirm">
<input name="con_id" type="hidden" id="con_id" value="<%=request.querystring("con_id")%>" />
<input name="sub_id" type="hidden" id="sub_id" value="1" />
<input name="liftingDate" type="hidden" id="liftingDate" value="<%=Session("currentUSDate")%>" />
<div class="holder"><input name="btnConfirm" type="submit" class="button" id="btnConfirm" value="Start New Lifting Gear Examination" /></div>
You're using the wrong selector, the .form is looking for a <form> with a class of form. Furthermore you should be using the on() syntax:
$('form').on('click', '.button', function() {
$('.holder').append("DONT DOUBLE CLICK ANYTHING IN A BROWSER");
$('#frmArchiveConfirm').submit();
$('.button').remove();
});
For your jQuery code to work you should include the frmArchiveConfirm to your jQuery code as below.
Replace $('.form').submit(); with $('#frmArchiveConfirm').submit();
else if you only having one form in the page just use $('form').submit();
When you come across bug like this don't forget to make use of the firebug or the browser development tools. You can easily figure out the bug and what's wrong in your code.

Categories

Resources