I use invision power board n i added little plugin for admin control panel. In this plugin is for changes some value in DB i added form. When i submited form all ok, but when i reload all page with F5, the form submited again.
there is my code
<form method="post" id='xp_form' name='xp_form' enctype="multipart/form-data" action="" style='margin: 5px;'>
<label style='font-weight: bold;'>New value</label>
<p style='margin-top: 3px;'>
<input size="5" maxlength="7" name="xpValue" value="" tabindex="1" style='width: 98%; border-radius: 7px;'>
</p>
<fieldset style='text-align: center;border-top: 1px solid #ccc;margin-top:5px;'>
<input value='Cancel' name='xn_value' onclick='closeEdit()' type='button' style='padding: 4px;cursor: pointer;-webkit-border-radius: 4px; border-radius: 4px;border-color: #2b2b2b;'>
<input value=' Save ' type='button' onclick='return testPost()' style='padding: 4px;cursor: pointer;-webkit-border-radius: 4px; border-radius: 4px;border-color: #2b2b2b;'>
</fieldset>
</form>
and javascript code for form submiting
document.forms["xp_form"].submit(); //first submit
document.forms["xp_form"].reset(); //and then reset the form values
I can't redirect to the another page or disable submit button. Let me explain. I use cms. For for dashboard i added plugin ->image. When admin selected row and click on the button with pencil icon showing popup window. In this window admin can edit value and then save value and then edit others records
Redirecting to a non-submitted page is one of the easiest ways to do it.
If you are using JavaScript anyway, you can disable "submit" button and do an AJAX post to the server. If request fails you can enable button again, if it succeed you can redirect user without enabling button.
The secend option is to write server code in way that when post data came you process the form and send redirection to user for another page which does not support post (like "thank you" page).
If you have access to the code processing the POSted value, you can allow resubmission BUT only update the database value if it is different than the previous value posted.
To do this you need to remember the previous value, perhaps by using a session or cookie or maybe a hidden input which each time stores the value (or maybe use md5(value)) which is POSTed. In your processing you can then compare the received value with the previous remembered value and only call the database update code if these values are different.
This is how I do and it works perfectly fine. I submit the data to a server-side handler, say temp.php (change to your handler). Handler stores the $_POST or $_GET variables inside session. I believe every server-side technology has some session handling. Then immediately redirect to the page where you want user to be after page submit (in php, this is done using header() call). This solves the multiple submits by refresh.
If you do not want the user to be redirected to another page, use ajax with disable/enable submit button and clearing form fields after submit.
Related
I have a single page React app with a simple login form with two buttons LOGIN and BACK. If I click BACK LastPass still offers to save the entered username/password, even though I didn't login.
Is there any way to tell LastPass that the back button is a cancel button for the login form and that it shouldn't try to save the username/password in that case?
HTML looks something like this:
<input name="username" type="text" />
<button type="submit">LOGIN</button>
<button>BACK</button>
You can use <input type="reset" /> or <button type="reset">.
As its name says, a reset button is ment to cancel a form. When it is activated, all user inputs are cancelled and the fields are reset back to their default values, i.e. the ones that were specified in the HTML code.
In JavaScript, You may intercept an activation of the reset button by using the reset event on the parent form, i.e. form.onreset=..., form.addEvementListener('reset', ...) or <form onreset="...">.
Note that, as for submit buttons, it's a bad practice to intercept the click event directly on the button by using onclick: although there is no universal standard way to cancel the form as there is with the enter key to submit it (escape key don't cancel the form by default), you can't be sure that there is no other way to cancel the form than click on the reset button.
I have a button that is this <button id="btnSubmit">Submit</button> the problem is, I want the form tags to use this id so that is designed the way I want. And also this code, I have a few questions.
<form action="demo_form.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
what is the action="demo_form.php",input type="submit" do? And does the input type has any other "What do you call this stuff" besides submit?
The action="demo_form.php" sets the action, in this case, "navigate to file demo_form.php and send it the data".
<input type="submit" (...) > creates and element which submits the form e.g. executes the "action".
The method sets the way the data is submitted to the target of the action ("form_demo.php"), in this case get, which allows you to refer to the submitted data as $GET["name"] in PHP.
Possible input types are listed here.
You either give your <input type="submit" (...) > the id="btnSubmit" property or use javascript to submit the form after an event has been triggered.
MOr info on that is available here (i short: document.<get_the_form_element>.submit();).
I suggest you to take a look at this link. It describes all the basic concepts about how using forms. And you can also find a lot of information by Googling it.
The action attribute
The action attribute defines the action to be performed when the form is submitted.
The common way to submit a form to a server, is by using a submit button.
The input attribute
<input type="submit"> defines a button for submitting a form to a form-handler.
The form-handler is typically a server page with a script for processing input data.
If i understand your question correctly, these are my answers.
action
The action attribute describes the page to which the contents of the form are sent to. So if you have a sign up form with an input for an email, the text that is typed will be sent to the action path. It will be sent using the method described in the method attribute. So you can find your values in either the $_POST variable, or the $_GET variable, get is easy for being able to share the url and post is great for private information.
input
The input element is the actual way to input information (who guessed it). You've got an input of the type text for just text input, you've got checkbox for a true or false input and way way more see: w3schools
why don't you use
<input type="submit" value="Submit" id="btnSubmit">
Or if you want to use a button
<button id="btnSubmit">Submit</button>
Then from jquery or js you can submit the form.
And for this question,
what is the action="demo_form.php",input type="submit" do?
You should probably google it out. This is so basic.
Anyway, just a concise explanation:
action is the attribute where you will specify the code that will handle the form data submitted and input type="submit" will display a button in the page, clicking on it will submit the form.
There are a lot of types in input, the most common ones are
text
password
submit
I have two button on page first submit and other save but one there is one condition if admin log in Save button shows and if client log in submit button show. But bug is any one who log in can easily change disable to enable or enable to disable from view source and click the button
#{
if((Utility.GetUserRoleFromSession().ToString().ToLower().Equals(UserRole.Client.ToString().ToLower())
{
<input type="button" value="Submit" title="submit" class="blueBtn" id="btnSubmit" />
}
if (Utility.GetUserRoleFromSession().ToLower().Equals(UserRole.Admin.ToString().ToLower())
{
<input type="button" value="Submit" id="btnSubmitEE" class="btnSubmitEE blueBtn" />
}
}
Make the button visible = false according to user. If button is invisible, then it will not appear in the viewsource.
Make the button invisible to ensure that the button is not emitted to the rendered HTML.
As a second line of defense, put logic into the code-behind to verify that the user should be able to click the button before actually performing the logic on the server-side. This is analogous to performing both client-side validation and server-side validation, because the user can turn off JavaScript on the client-side, at that point server-side validation is all that is executed.
Note: Bottom line is the server-side should NEVER trust anything the client provides to it.
I have a page that will display a search form with 3 fields, and a submit button.
when the user clicks on submit, i'm going to make an ajax call, get the data, and then populate the bottom half of the page.
What I'm wondering is if you're using ajax calls, would you still create the form using the tag?
So for example, here's some sample HTML:
<H2> Search Options</H2>
<DIV ID="searchform" class="">
<input type='text' id='id'></input>
<input type='text' id='firstname'></input>
<input type='text' id='lastname'></input>
<input type='button' id='submit'></input>
</DIV>
as you can see, I don't have a tag with post attrib set.
can you tell me why i should / shouldn't include the form tag while using ajax?
Thanks.
There is nothing wrong with it at all.
The only problem comes when a user doesn't have JavaScript enabled. How will your form behave then?
*Assuming javascript is enabled in client's browser
If you are handling Ajax call on button click event, then no need of using <form />.
Because each fields you'l get in javascript by using document.getElementByID or some other mechanism (JQuery selectors). moreover the Ajax call also you are making manually so you can avoid use of <form />.
Using <form /> will just add few bytes overhead to html page, there isn't any other advantage of using <form/> in this case, if you are handling ajax call on button Click event.
What is the difference between HTML <input type='button' /> and <input type='submit' />?
<input type="button" /> buttons will not submit a form - they don't do anything by default. They're generally used in conjunction with JavaScript as part of an AJAX application.
<input type="submit"> buttons will submit the form they are in when the user clicks on them, unless you specify otherwise with JavaScript.
The first submit button of the form is also the one being clicked for implicit submission, f.e. by pressing enter in a text input.
A 'button' is just that, a button, to which you can add additional functionality using Javascript. A 'submit' input type has the default functionality of submitting the form it's placed in (though, of course, you can still add additional functionality using Javascript).
It should be also mentioned that a named input of type="submit" will be also submitted together with the other form's named fields while a named input type="button" won't.
With other words, in the example below, the named input name=button1 WON'T get submitted while the named input name=submit1 WILL get submitted.
Sample HTML form (index.html):
<form action="checkout.php" method="POST">
<!-- this won't get submitted despite being named -->
<input type="button" name="button1" value="a button">
<!-- this one does; so the input's TYPE is important! -->
<input type="submit" name="submit1" value="a submit button">
</form>
The PHP script (checkout.php) that process the above form's action:
<?php var_dump($_POST); ?>
Test the above on your local machine by creating the two files in a folder named /tmp/test/ then running the built-in PHP web server from shell:
php -S localhost:3000 -t /tmp/test/
Open your browser at http://localhost:3000 and see for yourself.
One would wonder why would we need to submit a named button? It depends on the back-end script. For instance the WooCommerce WordPress plugin won't process a Checkout page posted unless the Place Order named button is submitted too. If you alter its type from submit to button then this button won't get submitted and thus the Checkout form would never get processed.
This is probably a small detail but you know, the devil is in the details.
IE 8 actually uses the first button it encounters submit or button. Instead of easily indicating which is desired by making it a input type=submit the order on the page is actually significant.