Retrieving data from dynamic form - php

I have a form which is dynamically generated based on user input.
Initially the user is shown 3 fields to select from (datefrom, dateto, and pitchtype), they select their options, click submit and the script generates a table with inputs for each date in the range for them to edit.
An example of the generated form is below:
<table id="avtable">
<thead>
<tr>
<th>Date</th>
<th>Current bookings</th>
<th>Max bookings</th>
</tr>
</thead>
<tbody>
<form action="index.php?page=availability&task=edit&action=submit" method="post"></form>
<input type="hidden" name="pitchtype" value="1" />
<tr>
<td>2012-05-13</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="max"></td>
</tr>
<tr>
<td>2012-05-14</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="max"></td>
</tr>
<input type="submit" value="Save" name="Submit" />
</form>
</tbody>
</table>
In the recieving PHP file I need to be able to process the data for each date, and am clueless where to start! Typically if it was a static form I would just use something like
$max = $_REQUEST['max'];
To get the edited field.
Obviously what I need to do is pair up each edited field with its date, for me to then process the data as I normally would. I presume I would need some sort of php loop with the array of data from the form, but I'm not quite sure where to start... any ideas?
EDIT :
I presume I would need to edit my outputed form to something like this, so the name of each input was the same as the date column, so what I need to know is then how to get all dates in the receiving php file:
<table id="avtable">
<thead>
<tr>
<th>Date</th>
<th>Current bookings</th>
<th>Max bookings</th>
</tr>
</thead>
<tbody>
<form action="index.php?page=availability&task=edit&action=submit" method="post"></form>
<input type="hidden" name="pitchtype" value="1" />
<tr>
<td>2012-05-13</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="2012-05-13"></td>
</tr>
<tr>
<td>2012-05-14</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="2012-05-14"></td>
</tr>
<input type="submit" value="Save" name="Submit" />
</form>
</tbody>
</table>
Many thanks!
Kevin

In order to pass information first you need to give the text input's different names something like:
<table id="avtable">
<thead>
<tr>
<th>Date</th>
<th>Current bookings</th>
<th>Max bookings</th>
</tr>
</thead>
<tbody>
<form action="index.php?page=availability&task=edit&action=submit" method="post"></form>
<tr>
<td>2012-05-13</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="SpinMax"></td>
</tr>
<tr>
<td>2012-05-14</td>
<td>0</td>
<td><input type="text" value="10" class="spinner" maxlength="3" name="SpinMax2"></td>
</tr>
<input type="submit" value="Save" name="Submit" />
</form>
</tbody>
</table>
From there, your PHP script should be something like this:
$SpinMax = $_POST["SpinMax"];
$SpinMax2 = $_POST["SpinMax2"];
By using $_POST, you are able to assign the PHP variable based on the "name" you give it in the text area.

Related

How to make edit button with php, html only no mysql

I want to bring many $_REQUEST from Tag but only $_REQUEDT['editid'] works. how to solve it.
echo "<td><a href=product.php?editid=$id, editname=$name, editqty=$qty, editprice=$price>Edit</a></td>";
//when I put $_REQUEST['editid'] in input it works but others not.
<form action="product.php">
<table>
<tr>
<td>ID</td>
<td><input type="text" name="tid" value="<?php if(isset($_REQUEST['editid'])){echo $_REQUEST['editid'];} ?>"></td>
</tr>
<tr>
<td>Name</td>
<td><input type="text" name="tname" value="<?php if(isset($_REQUEST['editname'])){echo $_REQUEST['editname'];}?>"></td>
</tr>
<tr>
<td>Qty</td>
<td><input type="text" name="tqty" ></td>
</tr>
<tr>
<td>Price</td>
<td><input type="text" name="tprice" ></td>
</tr>
<tr>
<td></td>
<td><button type="submit" name="btn-add">Add</button>
<button type="submit" name="btn-clear">Clear</button></td>
</tr>
</table>
</form>
The URL parameters after the 1st one should be separated by & (not ,)
Change from
<a href=product.php?editid=$id, editname=$name, editqty=$qty, editprice=$price>
to
<a href="product.php?editid=$id&editname=$name&editqty=$qty&editprice=$price">

clone column1 to column 2 using button

I need another name2 column where in it has a button(copy all) once you click it a dialog box will appear "Are you sure you want to copy |Yes/No". it'll clone the data from name to name2.
<table class="downpanel">
<thead>
<tr>
<th></th>
<th>Name</th>
<th></th>
<th>Name2</th>
<th></th>
<th colspan="">Count</th>
<th></th>
<th>Unit</th>
<th></th>
<th>Category</th>
<th></th>
<th>Data1</th>
<th></th>
<th>Data2</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="button" class="copyall">
</td>
<td>
<input type="text" size="25" name="name">
</td>
<td>
<input type="text" size="25" name="name2">
</td>
<td>
<input type="button" class="copy">
</td>
<td>
<input type="text" size="3" name="from">
</td>
<td>
<input type="text" size="3" name="to">
</td>
<td>
<input type="button" class="copy">
</td>
<td>
<select name="unit" style="width: 75px;">
<option value="blah">blah</option>
</select>
<br />
</td>
<td>
<input type="button" class="copy">
</td>
<td>
<select name="category" style="width: 275px;">
<option value="blah">blah</option>
</select>
<br />
</td>
<td>
<input type="button" class="copy">
</td>
<td>
<input type="text" size="10" id="datepicker" name="data1">
</td>
<td>
<input type="button" class="copy">
</td>
<td>
<input type="text" size="7" name="data2">
</td>
<td>
<input type="button" class="copy">
</td>
</tr>
</tbody>
</table>
http://jsfiddle.net/jakecigar/hq2GG/2/
check this http://jsfiddle.net/hq2GG/4/
var r = confirm("Are you sure you want to copy?");
in both copy and copy all
http://jsfiddle.net/hq2GG/6/
You are facing a mode mash up issue. You initiated your data using HTML and now you want to manipulate it via Javascript. The more complex your issues get, the more you will end up in coding chaos. This is NOT about mixing different coding practices but to break the conceptual rework by designing one part in HTML and the other in Javascript. So as javascript seems to be mandatory here first design everything as if your whole application would only consist of Javascript. Define a mode:
DOM-Node-Manipulation (would be state of the art and also easier for manipulation) OR
html compile style (using innerHTML)
Once you got a mode make your matrix a matrix. If you need to copy cells, respectively rows and columns, you need to be able to address those. In the DOM Model you could maintain a two-dimensional wrapper array, in the html compile style you would obviously fittle with IDs, such as cell1_3, which helps you to make use of the getElementById. At the point in time you are able to address elements, it is just a matter of formulating loops, to get things copied, moved or deleted in bulk mode.
Once you got all of the conceptional prework you can decide to prefill your html page with html (and not javascript) - however this must follow the rules you set yourself for the scripting mode.

How to use associate arrays to get the id from the checkbox and appropreate value from the text field

Hi everyone, i'm new to programming. I need to develop a rating system with check boxes and text-fields where user clicks the subjects from the list and add his rating/experience in the text field. All these subjects and ratings are added to the database with the subject id and the rating. So the issue is, I don't know how to write the associate array to get the selected subjects and their appropriate rating to insert into the database. Can anyone please provide me some codes or samples similar to this. So, I can get some idea how to do this. Thanks in advance :)
This is the HTML sample code
<form action="" method="post">
<table width="372" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="24"><input type="checkbox" name="subid1" value="1" id="subid1"></td>
<td width="203">Maths</td>`enter code here`
<td width="145"><input type="text" name="sub1" id="sub1"></td>
</tr>
<tr>
<td><input type="checkbox" name="subid2" value="2" id="subid2" /></td>
<td>Physics</td>
<td><input type="text" name="subid2" id="subid2" /></td>
</tr>
<tr>
<td><input type="checkbox" name="subid3" value="3" id="subid3" /></td>
<td>Computing</td>
<td><input type="text" name="subid3" id="subid3" /></td>
</tr>
<tr>
<td><input type="checkbox" name="subid4" value="4" id="subid4" /></td>
<td>Chemistry</td>
<td><input type="text" name="subid4" id="subid4" /></td>
</tr>
<tr>
<td><input type="checkbox" name="subid5" value="5" id="subid5" /></td>
<td>Biology</td>
<td><input type="text" name="subid5" id="subid5" /></td>
</tr>
<tr>
<td><input type="checkbox" name="subid7" value="6" id="subid7" /></td>
<td>Human Biology</td>
<td><input type="text" name="subid6" id="subid6" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><input type="submit" name="button" id="button" value="Submit" /></td>
<td> </td>
</tr>
</table>
</form>
This will do the job on client side:
<input type="checkbox" name="cb[myID1]" value="1" />
<input type="text" name="t[myID1]" value="" />
<input type="checkbox" name="cb[myID2]" value="1" />
<input type="text" name="t[myID2]" value="" />
and this can be used on server side:
$usedTexts = array();
if ( array_key_exists("t", $_POST) && is_array($_POST["t"])
&& array_key_exists("cb", $_POST) && is_array($_POST["cb"])
)
{
$usedTexts = array_intersect_key($_POST["t"], $_POST["cb"]);
}
see manual for server side: http://us3.php.net/array_intersect_key
edit: fixed to POST; added array_key_exists() and is_array()

Chained Selects with Jquery Ajax

I new to programming, and have just finished the jquery course on CodeAcademy.I'm currently trying to create a chained select using Jquery's AJAX function to call a php page which runs a query on my database and echoes it out to my main html page.
Currently, I am able to load only my first , the second and third selects do not seem to be working, and i do not know what exactly it is that i'm doing wrong.
Jquery Code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#category").load("AddItemCat.php");
});
$("#category").onchange(function(){
var category=$("#category").val();
$("#subcat").load("AddItemSubCat.php?category="+category);
});
$("#subcat").onchange(function(){
var category=$("#category").val();
var subcat=$("#subcat").val();
$("#subcat").load("AddItemSubCat.php?category="+category+"&subcat="+subcat);
});
My HTML Form:
<form action="<?PHP echo $_SERVER['PHP_SELF'] ?>" name="edititem" enctype="multipart/form-data" method="POST">
<table border='1'>
<tr>
<td colspan="3">
Category:
<select name="category" id="category" ></select>
SubCategory:
<select id="subcat" name="subcat"></select>
Item:
<select id="item" name="item"></select>
</td>
</tr>
<tr>
<td>Item Name</td>
<td><input type="text" name="itemname" size="30" maxlength="50" required="required"></td>
</tr>
<tr>
<td>Item Price</td>
<td><input type="number" name="itemprice" size="30" min="1" required="required"></td>
</tr>
<tr>
<td>Item Info</td>
<td><textarea name="iteminfo" col="40" rows="10" maxlength="300" required="required"></textarea>
</tr>
<tr>
<td>Filename:</td>
<td><input type="file" name="upload[]" /></td>
</tr>
<tr>
<td>Filename:</td>
<td><input type="file" name="upload[]" /></td>
</tr>
<tr>
<td>Filename:</td>
<td><input type="file" name="upload[]" /></td>
</tr>
<tr>
<td>Filename:</td>
<td><input type="file" name="upload[]" /></td>
</tr>
<tr>
<td>Filename:</td>
<td><input type="file" name="upload[]" /></td>
</tr>
<tr>
<td colspan="2"><input type="SUBMIT" name="Button" value="Submit"></td>
</tr>
<tr>
<td colspan="2"><?PHP if(isset($errormsg)){echo"$errormsg";}?></td>
</tr>
<tr>
<td colspan="3"><font color="#FF0000"></font></td>
</tr>
I would really appreciate it if someone could point out my mistake and give me pointers on rectifying it.Thanks!
Way to much code to help you but since you say that the jQuery part does not work:
$("#category").onchange(function(){
This should be
("#category").on("change", function(){
There is no onchange in jQuery 1.10 (or any other version?). A brief look into the console would have shown you the error I guess. Additionally, you shoud put all your other calls inside $(document).ready as well.
try use page url instead of file name. e.g - url to AddItemSubCat.php

Use form values to dynamically calculate another value on same page

I am trying to use the form values to dynamically calculate another value on the same page.
I have two tables:
with the input form
Where I want to use the input form values dynamically before posting.
I have already used php but it doesn't work as I have to submit in order to get the values. I am not really familiar with j script and ajax, however i heard it is possible to do it using these. Let me know what you think is the best solution. thanks in advice.
Here the example:
<table><form name="form1" method="post" action="results.php">
<tr>
<td> </td><td> a </td><td> b </td>
</tr>
<tr>
<td> Line 1 </td><td><input name="a1" type="number"></td><td><input name="b1" type="number"></td>
</tr>
<tr>
<td> Line 2 </td><td><input name="a2" type="number"></td><td><input name="b2" type="number"></td>
</tr>
<tr>
<td><input type="submit" name="Submit" value="Submit"></td>
</tr>
</form></table>
<table>
<tr>
<td> Dynamic Result </td>
</tr>
<tr>
<td> a1/b1 (to be calculated dynamically)</td>
</tr>
<tr>
<td> a2/b2 (to be calculated dynamically) </td>
</tr>
</table>
You need to start reading jQuery, but for now:
// Load jQuery Library, put jquery.js in current directory
<script type="text/javascript" src="jquery.js"></script>
<table><form name="form1" id="form1" method="post" action="results.php">
<tr>
<td> </td><td> a </td><td> b </td>
</tr>
<tr>
<td> Line 1 </td><td><input name="a1" id="a1" type="number"></td><td><input name="b1" id="b1" type="number"></td>
</tr>
<tr>
<td> Line 2 </td><td><input name="a2" id="a2" type="number"></td><td><input name="b2" id="b2" type="number"></td>
</tr>
<tr>
<td><input type="submit" name="Submit" value="Submit"></td>
</tr>
</form></table>
<table>
<tr>
<td> Dynamic Result </td>
</tr>
<tr>
<td id="first-result"> a1/b1 (to be calculated dynamically)</td>
</tr>
<tr>
<td id="second-result"> a2/b2 (to be calculated dynamically) </td>
</tr>
</table>
<script>
$(document).ready(function(){
$('input').on('change', function(){
var a1 = $('#a1').val();
var a2 = $('#a2').val();
var b1 = $('#b1').val();
var b2 = $('#b2').val();
$('#first-result').text(parseInt(a1)/parseInt(a2));
$('#second-result').text(parseInt(a2)/parseInt(b2));
});
});
</script>

Categories