We Keep Coding

prevent redirect on form submit in HTML

I made a form in html that makes login request to this website: https://kintai.jinjer.biz/sign_in
Here is my html code:
<form method="post" class= "login-form" action="https://kintai.jinjer.biz/v1/sign_in">
<input class="login-input--text jcompanycode" id="company_code" name="company_code" type="hidden" value="1234" />
<input class="jemail login-input--text" name="email" type="hidden" value="1234" />
<input class="jpassword login-input--text" name="password" placeholder="パスワード" type="hidden" value="1234" />
<input type="submit" value= "submit" id= "submit" />
</form>
I wrote a javascript code to prevent redirect on submission of form.
<script>
$(document).ready(function(){
$('.login-form').submit(function(e){
e.preventDefault();
});
});
I want to prevent redirect on form submission.
However, when i add the javascript, the post request doesn't work.
Any ideas to send form data to server while remaining on current html page?
Note: please don't tell me to use ajax or jquery to make the login request.
I tried making post request using ajx/jquery a lot of times but it doesn't work. Perhaps due to same origin policy I presume.

HTML form redirect page is its feature.
If you want to avoid, please try to using formdata with ajax.
MDN FromData
MDN Fetch with FormData

How to reset the form data in html using jquery/javascript && and also how to send the form data to an email using jquery?

I'm new to jquery
I'm working on a form data html,
now i need to reset the data on click on the reset button and also need to transfer the form data to email on click on submit button.
Can anyone help me in solving this??
Before Posting the question I have gone through the link which Pierre C. has updated and my question is different from that question and even how to add /can we add "type" attribute in anchor tag.??
here is the html:
<form id="form" method="post">
<fieldset>
<label>
<input type="text" value="Name">
</label>
<label>
<input type="text" value="Email">
</label>
<label>
<input type="text" value="Phone">
</label>
<label>
<textarea>Message</textarea>
</label>
<div class="btns">
Clear
Send
</div>
</fieldset>
</form>

To clear all the data within a form, all you have to do is add an
<input type="reset" name="reset" value="Reset"></input>
However, reset buttons are annoying and no one ever uses them, so I suggest you just leave that. With regards to sending the form, the way I would do it is write this app in ASP.NET MVC and just put the mail logic in the controller, or create an API for your app, then create an Ajax POST on the button click using the form data as API parameters.

Submit a Form without redirecting

I want to submit a form without redirecting page. Form is submitted to third party so i can't make changes in php.
What I want to do is:-
Submit for without visiting third party page.
After successful submit show alert.
Current I am using hidden iframe and form target to hidden iframe but I am not satisfied. Is there is any better way to do this using javascript or jquery.
My Form:-
<form target="iframe" action="http://www.example.com" type="post" id="myform">
<input type="text" value="" name="name">
<input type="submit" name="submit">
</form>
My Iframe:-
<iframe style="display:none" id="iframe"></iframe>

You need to use Ajax for that kind of request.
Please look at some tutorials, this for example http://www.w3bees.com/2013/08/submit-form-without-page-refresh-with.html

Change the iframes id attribute to name:
<iframe style="display:none" name="iframe"></iframe>

You can use jquery here
<form action="http://www.example.com" id="myform">
<input type="text" value="" name="name">
<input type="submit" name="submit">
</form>
and after in jquery you write like
// bind to the form's submit event
$('#myform').submit(function() {
alert("ok");
return true;
});

Consider using a PHP proxy.
Copy the script from here to anywhere you like on your own server.
Modify line 11 so that it points to the URL you are posting to at the moment.
// Destination URL: Where this proxy leads to.
$destinationURL = 'http://www.otherdomain.com/backend.php';
Then in your ajax script, change the URL to your proxy.php script.

Form action affects only the form itself

I'm working on a single PHP file, which has 2 different forms.
Example:
<form action="index.php" method="POST">
<input type="checkbox" name="box1">
<input type="submit" value="submit1" name="submit">
</form>
<br>
<form action="index.php" method="POST">
<input type="checkbox" name="box2">
<input type="submit" value="submit2" name="submit">
</form>
My problem is, I want to make both of them work at the same time, independent from each other. For example, when I hit 'submit1', the whole index.php reloads since action is set to that page. The other checkbox might lose it's condition, if I set it to checked before submitting the first form. Might be confusing, I know.. Since I have PHP code behind, I can' really handle the whole thing between 1 form tag. That's why I'm asking if there's another option like javascript, or something. Thanks in advance!

You can use a javascript cookie. You could set it so the cookie will have the fields and values of everything in both forms, and then is saved/created upon submit. Then once the page is reloaded, javascript can split the cookie and refill the field values for the other form. You might need a hidden field in both forms so that you can identify which form was submitted. Here's a tutorial that might explain cookies to you in greater detail: http://www.tutorialspoint.com/javascript/javascript_cookies.htm

Voting/rating system: How to fail gracefully when javascript isn't supported/enabled?

I'm implementing a voting system like the one used by stackoverflow. It's working with ajax sending POST request to an url. I'd like a way to fail gracefully when javascript/ajax isn't supported or enabled, a GET like /voteup/id isn't even considered because i'm altering the database.
What's the best solution? I'm either considering a form or simply removing the feature if js isn't enabled.
There are at least three related entries on SO but i can't insert more than one hyperlink
POST with links without JavaScript

Make the basic voting actions mini-forms, then use javascript to disable their posting action.
<form method=post action="hit-url">
<input type=hidden name=vote value="1" />
<input type=submit value="Vote Up" onSubmit="doVote(1);return false;" />
</form>
<form method=post action="hit-url">
<input type=hidden name=vote value="-1" />
<input type=submit value="Vote Down" onSubmit="doVote(-1);return false;" />
</form>
To replace these with links for javascript-enabled users:
<div id="voteupbutton">
<form method=post action="hit-url">
<input type=hidden name=vote value="1" />
<input type=submit value="Vote Up" onSubmit="doVote(1);return false;" />
</form>
</div>
<script>
document.getElementById("voteupbutton").innerHTML="<a href='script:return false' onClick='doVote(1);return false;'>Vote up</a>";
</script>
I haven't tested the above. If you're using jQuery or some other framework, there will be more elegant ways of doing all of this.

The straightforward option is just a regular form POST, even if it is to the URL /voteup/id, and I'm not sure why you can't do that (or even the GET you mentioned).
Put onsubmit="return false" into the tag to prevent POSTing by users who do have JS enabled.

While you can't use links to submit forms, you can certainly use links to trigger database actions if you want to, via the querystring. In no particular scripting language:
<===
if (querystring("v")) then {
v.value.writeToDatabase
}
===>
Vote A, Vote B