Develop Reference

Register which image has been clicked in form

I have multiple images in a HTML document and I want them to render unique values when they are clicked (in some retrievable way). I have tried having them as form elements, like so:
<form id="myform" method="post" action="">
<input type="hidden" name="action" value="submit" />
<div class="flex-item"><input type="image" name="submit" value="alt1" alt="alt1" src="images/<?php echo $data[$counter] ?>"></div>
<div class="flex-item"><input type="image" name="submit" value="alt2" alt="alt2" src="images/<?php echo $data[$counter+1] ?>"></div>
</form>
In this case I would like to access the POST data with PHP, something like:
if (isset($_POST['action'])) {
echo '<br />The ' . $_POST['submit'] . ' button was pressed';
}
But this doesn't work, as it's the image input type, which doesn't seem to be able to send data. I have tried using a button with the image as background, but this way I would have to adapt the size of each image to make it fit in the button (which I want to avoid, as I have many images).
I know I could use an image as a submit button with Javascript, but as I said, information about which image has been clicked also needs to be available somehow. Any ideas about the best solution?

HTML / CSS - Only way.
Set up the CSS to hide the radio buttons:
.hidden {
display: none !important;
}
In your form, use radio buttons to track which image is selected. Put the image inside of a label that is "for" the relevant radio button . Be sure to put whatever info you want in PHP inside the value attribute of the radio buttons:
<form method="post" name="myForm">
<div>
<input type="radio" name="image" value="image1" id="image1" class="hidden">
<label for="image1"><img src="path-to-your-image.jpg"></label>
</div>
<div>
<input type="radio" name="image" value="image2" id="image2" class="hidden">
<label for="image2"><img src="path-to-your-other-image.jpg"></label>
</div>
<div>
<input type="submit" name="save" value="Save Image Selection">
</div>
</form>
If you need the form to submit when they click an image, then add this bit of javascript:
<script>
// No-conflict-mode-safe document ready function (waits until page is loaded to run, which ensures radio buttons are available to bind to)
jQuery(function($) {
// Hide / suppress the submit button
$('input[type="submit"]').closest('div').hide();
// Bind to change event for all radio buttons
$('input[type="radio"]').on('change', function() {
// Submit the form ("this" refers to the radio button)
$(this).closest('form').submit();
});
});
</script>
Then, when you submit this form, in your PHP you'd be able to do this:
$image = $_POST[ 'image' ]; // 'image' is the name of the radio buttons
var_dump( $image );
// Will result in "image1" or "image2", etc - whatever "value" you assigned to the radio buttons

When you use your code, you get the submit param (because of the button's attribute name) in your $_POST object. The value will be the value attribute.
So you can check this like this:
<form id="myform" method="post" action="">
<input type="hidden" name="action" value="submit" />
<div class="flex-item"><input type="image" name="submit" value="alt1" alt="alt1" src="images/img1"></div>
<div class="flex-item"><input type="image" name="submit" value="alt2" alt="alt2" src="images/img2"></div>
</form>
<?php
if (isset($_POST['submit'])) {
if ($_POST['submit'] == 'alt1') {
echo 'alt1 clicked';
// First button clicked
}
else {
echo 'alt2 clicked';
// second button clicked
}
}
?>

Codeigniter doesn't return first submit name from multi form page

I have a multi form page in view:
<?php echo form_open("account"); ?>
// input fields
<input type="submit" name="change-password" value="Change Password"/>
</form>
<?php echo form_open("account"); ?>
// input fields
<input type="submit" name="change-email" value="Change Email"/>
</form>
And in controller I'm checking:
if (!empty($_POST['change-password']))
{
//
}
if (!empty($_POST['change-email']))
{
//
}
$_POST['change-password'] is always null.
So I tried to switch them places and even added third form. Whatever I do, I can't get submit name from FIRST submit form, but can get them from second, and third.
UPDATE:
I have found the bug.
I didn't mention this, but my submit buttons on forms have an id="submit-btn"
and JavaScript that prevent double submit is making all the trouble:
$("form").one('submit', function() {
$('#submit-btn').prop("disabled", true);
});
And I don't understand why, but this is another question.

Add unique hidden fields for both forms and check that fields name in method (here post) in controller.
<?php echo form_open("account"); ?>
// input fields
<input type="hidden" name="first_form" value="first_form"/>
<input type="submit" name="change-password" value="Change Password"/>
</form>
<?php echo form_open("account"); ?>
// input fields
<input type="hidden" name="second_form" value="second_form"/>
<input type="submit" name="change-email" value="Change Email"/>
</form>
if ($_POST['first_form'])
{
// inside first form
}
if ($_POST['second_form'])
{
// inside second form
}

PHP page bookmark with GET

1) Why does the URL show "&submit=Submit" at the end? What should be done to get only the two variables name and age?
2) Does isset function work well with GET method as well? Is there another function or way to handle this?
Result screenshot
<html>
<head>
<title>My first PHP page</title>
</head>
<body>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get">
Name: <input type="text" name="name"/>
Age: <input type="text" name="age"/>
<input type="submit" name="submit"/>
</form>
</body>
</html>
<?php
if ( isset($_GET['submit']) ) { //was the form submitted?
echo "Welcome ". $_GET["name"] . "<br>";
echo "You are ". $_GET["age"] . "years old<br>";
}
?>

The URL is showing variable -> value key pairs. The name= attribute supplies the var name, the element value provides the value. Remove the name= from the submit button. Problem solved.
Yes, isset works with both GET and POST methods.

jQuery.get to read a file and use the data into a form

I want the script to do the following:
On page load, read a text file with a number (just one line)
Increment the number by 1
Insert the number in an <input> box of the form
Once <form> is submitted, write the number to the text file
When the form gets loaded again, it will rerun the code and the number will increment by 1. This is basically to pre-populate a field with a unique and progressive number prior to form submission.
I am currently using jQuery, PHP and of course HTML:
HTML:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js">
$.get("http://www.domain.com/tools/formdata.txt");
function test(){
$.get('http://www.domain.com/tools/formdata.txt', function(data){
x = data++;
});
}
</script>
</head>
<body onload="test()"/>
<form action="save_json.php" method="post">
Contract: <input type="number" name="contract" id="contract" value="x" /><br />
<input type="submit" id="submit" value="Invia" />
</form>
</body>
</html>
PHP
<?php
if(isset($_POST['contract'])) {
// if form fields are empty, outputs message, else, gets their data
if(empty($_POST['contract'])) {
echo 'All fields are required';
}
else {
// adds form data into an array
$formdata = $_POST['contract'];
if(file_put_contents('/var/www/domain/tools/formdata.txt', $formdata)) echo 'Data successfully saved';
else echo 'Unable to save data, try again or contact IT';
}
}
else echo 'Form fields not submitted';
?>

First: I recommend that instead of javascript, you do this with PHP file_get_contents('formdata.txt') at the start of your file, and then you echo it in. That way, the value will be there on load, rather than having to wait for the HTML to render and the javascript to run. Also, it is a much better practice and will let you do a lot more things if you choose to expand the page.
However, here's the solution to the issue presented:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
var x;
function test(){
$.get('file.txt', function(data){
console.log('data',data);
var x = ++data;
console.log('x',x);
$('#contract').val(x);
});
}
</script>
</head>
<body onload="test()"/>
<form action="aoeu.php" method="post">
Contract: <input type="number" name="contract" id="contract" /><br />
<input type="submit" id="submit" value="Invia" />
</form>
</body>
</html>
The things to note:
Close off your <script> tag including the jquery library, then open another one after it.
No need to do the first $.get() you have - save it for the function.
var x = data++; - this increments data AFTER its value has been assigned to x. So, it will never increase. Do ++data instead, and it increments before.
You need to place it somewhere afterwards. How you had the input (value='x') is just trying to put the character "x" into the input. Use javascript to edit the functions value, as in my example.
Your PHP works fine.

confusion passing variable to php through multiple scripts

I am having difficulty passing a variable from a first form to a second form. There are four scripts involved: debug.php, getVar.php, printme.php and scripta.php. Running debug.php and typing "blah" for a "password to continue", select scripta.php from the pulldown and hit "Submit", I expect to see $dbpass="blah" for all of the scripts. I see it for the first page, but after the second pages' "Submit" button is pressed, the value is forgotten once inside of "printme.php". I suspect this has to do with variable scope. Any help is appreciated.
debug.php:
<html>
<body>
<form name="gateway" action= "" method="POST">
<fieldset>
<label>password to continue:</label>
<input type="text" id="dbpass" name="dbpass">
<label>Select Script:</label>
<select name="scriptSelect" id="scriptSelect">
<option value="">Please make a selection</option>
<option value="scripta.php">scripta</option>
</select>
<input name="updateGateway" type="submit" value="Submit">
<input name="resetForm" id="resetForm" type="reset" value="Reset Form">
</fieldset>
</form>
</body>
</html>
<script type="text/javascript">
document.getElementById('scriptSelect').addEventListener('change', function(e){
var selected_value = e.target.value;
document.forms['gateway'].action = selected_value;
alert(selected_value);
});
</script>
scripta.php:
<html>
<body>
<?php require 'getVar.php'; ?>
<form name="secondform" action= "printme.php" method="POST">
<fieldset>
<label>Hit submit to continue:</label>
<input name="updateScripta" type="submit" value="Submit">
</fieldset>
</form>
</body>
</html>
getVar.php:
<?php
if (isset($_POST['dbpass'])) {
$dbpass = #$_POST["dbpass"];
}
echo "you entered $dbpass";
?>
printme.php:
<?php
echo "Inside of printme, you entered $dbpass";
?>
Thanks

In scripta.php, add the line: <input type="hidden" name="dbpass" value="<? echo $dbpass ?>" /> somewhere inside the form tag.
In printme.php, add this line at the top of the page <? $dbpass = $_POST['dbpass'] ?>
There may be other errors in the scripts you have provided. Check back once you have made the above changes.

Mate... that's not how it works... Each request is independent...
In order to pass a value from one script to the other you either use sessions ($_SESSION) or you need to repost the variable.
Also, I don't know what you're trying to accomplish but passing passwords around, in plain text...
Repost variables
In scripta.php add this
<input name="dbpass" value="<?php $dbpass; ?>" type="hidden"/>
to your form. This will send the value contained in $dbpass in a hidden value.
Then, in printme.php you need to retrieve the value so just require that getVar.php script
require 'getVar.php';
echo "Inside of printme, you entered $dbpass";
Using Sessions:
change your getVar.php
session_start();
if (isset($_POST['dbpass'])) {
$_SESSION['dbpass'] = $_POST["dbpass"]; // you don't need that #
} else {
$_SESSION['dbpass'] = null;
}
then in your subsequent scripts, everytime you want to access dbpass just use
session_start();
$_SESSION['dbpass']
example:
<?php
session_start();
$_SESSION['dbpass']
echo "Inside of printme, you entered $dbpass";