I have a form almost all form elements are generated by clicking a button dynamically, for example
<input type="file" id="upload_1_1" name="upload_1_1">
the form elements's name is useful to my webapps which represent the position (e.g row = 1, col = 2), and it will be saved to DB later.
I found that, if the user change the name to "upload_2_1", they can still submit the form, and the $_POST will contains "upload_2_1". I use laravel 5.2, are there any ways to protect the form elements from being edit in browser console?
(the only way is check the sequence of the name in backend program?)
You cannot do it on front end level. Rather you can place a check on server side, for example: if(isset($_POST['upload_1_1]));
Sof if you have dynamic names, then you could somehow dynamically check them as well.
Related
I have an HTML form that sends information via post to a PHP file.
On the user's second visit the page should remember the last search input. So if on their first visit they were looking for pencil then on their second visit, the form would already have prefilled the Product Name input with pencil. I'm doing this via a session variable that is shared between the two files.
For example this is what my code looks like:
<label for="minPrice">Minimum Price</label>
<input id="minPrice" type="text" value="<?php echo $_SESSION['minPrice'];?>" name="minPrice">
<input class="clearForm" type="reset" value="Clear Form">
As you can see, I'm setting the value of the input field using the session variable. Which means the initial value on the second visit of the input will be the value of $_SESSION['minPrice'], so the typical type="reset" for clearing forms doesn't work. Reset just resets the form to it's initial values.
My first thought was to unset the session variables, but that wouldn't change the current values in the input fields of the form.
There are 2 ways to make it happen
Using PHP session the correct way
Using Javascript local storage
Using PHP sessions
Make sure your .php file has session_start() at the top.
Now you need to request the server to save the value(s) you wanna use on "the next visit". This means, requesting the server without refreshing the page through an HTML form submit, using AJAX.
Following JS snippet will post a form to the server, you can modify what to post as easily as eating an apple pie.
fetch(url, {method: 'POST', body: new FormData(form)})
But you have to POST when the user types something so add an eventListener that triggers the fetch method.
document.getElementById('minPrice').addEventListener('keydown', () => {fetch...})
url is the name of the file or the url you wanna POST to,
form is the form you wanna submit, in case you wanna submit some input field(s) alone, replace new FormData(form) by {minPrice: document.getElementById('minPrice').value} and so on.
assign the fetch method to a variable and you can get the server's response using
variable.then(res => res.json()).then(response => //do whatever you want)
On the server side, get the value(s) using the superGlobal $_POST, such as $_POST['minPrice'] and you can save it in the $_SESSION['minPrice'] variable and whenever the user reloads or makes a second visit, the $_SESSION['minPrice '] will assign the last written minPrice to the input field.
Using Javascript local storage
localStorage is built-into javascript and is quite easier to use. Read more about localStorage on MDN docs. Use
localStorage.setItem('minPrice', document.getElementById('minPrice').value)
And assign the localStorage value to the field on every page load.
document.getElementById('minPrice').value = localStorage.getItem('minPrice')
That's it!
Take a look at this !
Make page to tell browser not to cache/preserve input values
Stop browser from filling textboxes with details
Alternatively, try adding this in Jquery :
$("form :input").attr("autocomplete", "off");
Use JavaScript to clear out the values of the form fields.
Something like:
<button onclick="() => {
document.querySelectorAll('input').value = '';
}" />
That way when you click the reset button, it sets all inputs value to empty string.
If you're never going to want the field autofilled by the browser it seems like you'd simply want to use the autocomplete="off" flag on the input field you desire to be dynamically filled by your php script.
You can read more about the specific of this on the MDN docs.
Basically though you'd take the input, store it as a session variable, load the next page and populate the search variable into the input field as a value and turn the autocomplete functionality off so that the browser cannot override the value you provide from the session value.
The support for for this seems fairly broad. and should in most cases prevent the browser from overriding whatever it has stored for the field.
If you're still running into issues with it filling you cvould maybe look to adding some javascript functionality with the reset() function. However depending on how this is fired it might actually end up overriding whatever you populate with the PHP function at the time the DOM is actuall rendered
I have created a drop down menu where, if user opens link 1 it directs it into form containing 3 text boxes.
In the same way with link 2 will contain 5 text boxes.
It's totally depend's upon user request. Each may contain different no of text boxes. So now I need to save input from form automatically in database,
when ever user press submit!!!!.
Form input must be saved in database.
Can be any language and any type of database I will learn.
Any help will be highly appreciated!!.
Thank you
In PHP, form "submission" leads to another web page, carrying the values in the form either in $_GET or $_POST. Clue it in thus: <form action=next.php method=POST> (or method=GET).
That other web page should do several steps.
Connect to the database. (The previous page's connection is gone.)
Parse the args.
Build INSERT statements (or whatever). Recommend studying the "mysqli" and/or "PDO" set of routines.
Perform them.
You did not say anything that indicated the necessity of AJAX.
Problem
I am developing an application (in PHP) in which, I will show the user a report of some derived values based on previous entries he had done and the user will check for correctness - if correct, then the user can press Save button to submit it to database. Otherwise, the user should be able to edit previous entries, but he should not be able to change derived values in that report.
For that purpose, I have enclosed these values in a hidden input field, so a normal user can not alter these values, but if web developers could inspect the element in their browser and change these values.
Can we prevent these type of attack? If so, how?
My thoughts
I can make a string of all hidden fields, encrypt it and save in another hidden field - after postback I can cross-verify actual value and encrypted value.
Is this the correct way to achieve this? and how to do this
What do you think?
It's very hard to get a good idea of what you are trying to do but perhaps a solution could be to display a form with input fields disabled (http://www.w3schools.com/tags/att_input_disabled.asp) then have at the bottom of your page e.g. Is this information correct? .. Then 1 option to Save, and one option for No/Edit. Then do an if(isset($_POST['edit'])) { .. run form again but with input fields not disabled }
Only have your SQL update code in the 'edit' section of the code, and have a seperate SQL update code for the save section which just moves the values from wherever you are grabbing them from, to wherever they need to be.
Hope that helps.
If there are derived values that you need to fill out your form, but don't want to use hidden fields - I suggest using session variables that would contain those derived values as needed. Depending on how many of these forms there are, and how many users will be using them - the overhead is usually negligible with this number of fields (in the 30s)... if you discard them when not needed of course.
I'm building a virtual tour application and have hit a bit of a stumbling block during the setup process. Currently, the administrator is the one responsible for determining which stop belongs to which panorama as well as the choices for the next move. In order to complete this, I need to be able to insert the photo name into the database along with the other information of the current stop.
My form solution was to add the photo names of a certain directory into an array, count the number of images in the folder, and create the corresponding number of mini-forms on the page. Each form has its own save button that works via ajax, so all information is updated as the user works through the stops.
My issue has to do with adding the photo name via the submit process. The photo itself is not a user-defined field in the form, and I'm using POST to pass the variables to the insert function. Is there a way to include the filename in the $_POST array just before submission?
what you have to do its use a hidden input with the filename in the value attribute.
<input type="hidden" name="filename" value="the filename" />
also, you can add the filename as a parameter in the ajax call, but i think that the input its cleaner.
My client wants to have a 3 page form. The first page allows the user to enter data including a uploaded file. the second page confirms this data. and the third page submits the data to the database and directories.
Via post, I can keep saving the data to a hidden input fields, thats no problem. My problem is the uploaded file. how do I hold that document from page to page ? I am using Cakephp but any advice would help, thanks
You can always just create the illustion that the form is utilising three different pages. Use AJAX to accept and validate/request the user confirm their submitted data. If in this view they accept it initiate a POST to submit all that data.
You really don't need three physically different files to achieve this but you can still let it appear in three stages to keep your client happy.
You just upload the file to temp directory and keep the value in hidden variables just like other form data . If form successfully submitted then the image copy to desired location other wise delete the image
You can easily fake these 3 pages using CSS. Or even 2, as "third page" is actually a server script which has nothing to do with pages in the browser.
Just make your form, then put an event on the submit button which changes divs to whatever "confirmation page" he wants. and then actually send the form using a button on this page.
that's all
An uploaded file is always held temporarily. The server env var should tell you where it is. In Ruby's rack it is stored in the params var. So I guess there is a similar params var in php which has a hash with all the necessary information.
Since the file would be uploaded on the first step, one option is to put the file's location in a hidden input field along with the rest of the data (either there, or put it in the session). With CakePHP, if your file field looks somewhat like that:
<input type="file" name="data[User][image]" id="UserImage" />
Then you will be able to capture the location through
$location = $this->data['User']['image']['tmp_name'];
Which will correspond to something like /var/tmp/xxxxxx
On the last page, if the user confirms all the data, you just use move_uploaded_file() to put the file wherever you want on the server.
move_uploaded_file($location, '/new/location');