Form submission in frame - html

I have a form which has a target, and I'd like after submission for only the form to be replaced by the target page, not the whole page. I've wrapped the form in <frame> tags but after form submission the whole page is reloaded with the form submission target, not just the form itself (which is contained by frame tags).
Anyway to get the form submission to only replace that frame. Ideally the URL in the browser will not change.

You can use iframe like this. If you set the iframe as the target of the form the response gets redirected to the iframe.
You just have to use iframe's name as the form's target attribute.
<form id='myform' action='action.php' method='POST' target='formresponse'>
<label for='name' >Your Full Name*: </label><br/>
<input type='text' name='name' id='name' maxlength="50" /><br/>
<label for='email' >Email Address*:</label><br/>
<input type='text' name='email' id='email' maxlength="50" /><br/>
<input type='button' name='Submit' value='Submit' />
</form>
<iframe name='formresponse' width='300' height='200'></iframe>
http://www.html-form-guide.com/web-form/submit-form-multiple-scripts.html
MDN Form target

Try This
<form action="your action" target="iframe name">
</form>
<iframe style="display:none" name="iframe name"></iframe>

This could work
<form action="Action 1 " target="iframe name"></form>
<iframe style="display:none" name="iframe name"></iframe>
Let me know what you get

Related

HTML tag form without "action" attribute

I'm using this HTML code in an HTML page:
<form method="post">
<div class="form-group">
<input type="text" class="form-control" name="username">
</div>
<div class="form-group">
<input type="password" class="form-control" name="password">
</div>
<input type="hidden" name="ref" value="post-ad.php"/>
<button type="submit" name="submit" id="submit" class="btn">S'identifier</button>
</form>
On clicking submit button which action will this form execute? I noticed that it execute the value of input named "ref" in this example "post-ad.php" or "index.php" or "dashboard.php". Is it normal?! As I know the action attribute is mandatory?
without action attribute it will POST/GET to the same page
see here
If I understood right you're asking about action attribute that goes inside <form>.
If you put nothing there, it'll send the POST to the same page it is right now. If that form is in "index.php" it'll send all <form> data to "index.php"
You call form without action with this code:
<form action="javascript:void(0);"></form>

How to submit a form after submitting other form?

I'm working with html and jsp, and I'm trying to do a custom search that performs the same action as that of a catalog search that is on another page. I have two pages:
There is a page (outside my app, so I can't modify at all) that is a catalog search:
<form name="formulario" id="formulario" method="post" action="Main">
<input tabindex="116" size="55" id="txtSimpleSearch" name="txtSimpleSearch">
<input value="Search" type="submit" name="btnSearch" tabindex="102">
</form>
I have to create a page in my app that works as a custom search in that catalog seach. So I created this form:
<form method="post" rel="external" action="http://example.com/pages/SimpleSearch" target="_blank">
<fieldset>
<label for="txt"><span class="label">Text:</span>
<input name="txtSimpleSearch" id="txt" type="text"></label>
</fieldset>
<div>
<input class="boton" value="Search" type="submit">
</div>
</form>
The action of the second form (my page) goes to the catalog search, with the value of txt input, but it isn't do the search on the first page (the catalog search page not execute the submit of the form formulario).
Maybe I could get the form of the catalog search page and do the submit using Javascript? Or isn't possible?
Thanks.
You'll have to use the same name attributes for your input, so the page will be able to get the search value.
<form method="post" rel="external" action="http://example.com/pages/SimpleSearch" target="_blank">
<fieldset>
<label for="txt"><span class="label">Text:</span>
<input name="txtSimpleSearch" id="txt" type="text"></label>
</fieldset>
<div>
<input class="boton" value="Search" type="submit" name="btnSearch">
</div>
</form>
change input type='submit' to type='button' , add attribute to the input onclick='actionSubmitForm1()' then use javascript submit
document.forms["myform"].submit();
then submit you'rs second form
document.forms["myform2"].submit();

Two submit buttons

I have two forms on a same page and I have two submit buttons...so how do I check if the user filled out the first form before clicking the submit button on second form? The first form posts the data to php page which presents on a same page as the html and the second form sends the data to another PHP page with thank you message....I mean how do force the user to finish the first form before clicking the submit button on the second form? if the user hits the submit button on the second form, the form directs to thank you page with out checking if the user finished the first form..how do I stop that?
<html>
<body>
<form action="" method="post" enctype="multipart/form-data">
<input type="hidden" name="submited" value="true" />
<label for="file">Choose Photo:</label>
<input type="file" name="file" onchange="file_selected = true;" required>
<input type="submit" value="Submit" name="submit">
</form>
<form action="Send.php" method="post">
First Name:<input type="text" name="fname" required><br>
Last Name:<input type="text" name="lname" required><br>
Choose Username:<input type="text" name="username" required><br>
Age:<input type="text" name="age" required><br>
<input type="submit" value="Submit" name="submit">
</form>
You can change the name field and then access the value on the server side.
For example:
<input type="submit" value="Submit" name="submitOne" />
If you're using php you could use something like this:
if(isset($_POST['submitOne'])){ /* first one pressed */ }
There are also some other options like using jQuery or javascript to validate first.
Try: http://bassistance.de/jquery-plugins/jquery-plugin-validation/

IE9 is auto-submiting form when <a> links clicked

While using IE9, every link (when clicked) the search form is being submitted. Every link seems as if it is redirecting to the action value of the search form.
There is no java script attached to the form element.
<form action="/my-search-url" method="post">
<input type="submit" value="search" />
<input type="text" value="" />
</form>
The issue was with the order of the form elements. Apparently the original developer decided to place the submit button before any input elements. By putting the submit input last (or removing it) fixed this issue.
<form action="/my-search-url" method="post">
<input type="text" value="" />
<input type="submit" value="search" />
</form>

How do I pass the value of input fields on one html page to input fields on another html page using dojo

I am trying to pass the values of input fields on one html page to another html page that has a form with input fields. How do I write the dojo or JavaScript code to accomplish this?
<form id="form1" method="post" action="form2.html">
First Name: <input id="tFName" name="tFName" type="text" tabindex="0" iclass="isCompleted" maxlength="50" />
<br/>
<br/>
Last Name: <input id="tLName" name="tFName" type="text" tabindex="0" iclass="isCompleted" maxlength="50" />
<br/>
<input type='submit' value='Submit'/>
</form>
here is form 2:
<form id="form">
First Name: <input id="tFName" name="tFName" type="text" tabindex="0" iclass="isCompleted" maxlength="50" />
<br/>
<br/>
Last Name: <input id="tLName" name="tFName" type="text" tabindex="0" iclass="isCompleted" maxlength="50" />
<br/>
<input type='submit' value='Save Your Name'/>
</form>
You can't simply send data from one .html page to another, with or without javascript.
A form POST causes the browser to send the form data to the server in the body of the HTTP request. You must then run some code on the server to do something with that data, even if it's just setting it as the initial values of fields on a different .html page.