I am trying to post the value of fields in a table through Ajax to process.php that will process the data.
the table:
<form name="items">
<table width="90%" border="1">
<tbody>
<tr>
<td width="26%">Item Name</td>
<td width="22%">If other then give name</td>
<td width="22%">Quantity</td>
<td width="16%">$/Unit</td>
<td width="14%">Total</td>
</tr>
<?php for ($i = 1; $i <= 10; $i++) {
?>
<tr>
<td>
<select name='itemname<?php echo $i;?>' id='itemname<?php echo $i;?>'>
<option value="other">other</option>
<?php
$qry_item_name = "SELECT DISTINCT item_name FROM bus_name_details";
$result_item_name = mysql_query($qry_item_name);
while($row_item_name = mysql_fetch_array($result_item_name)) {
$option .="<option>" . $row_item_name['item_name'] . "</option>";
echo $option;
}
?>
</select>
</td>
<td>
<input type="text" name="other<?php echo $i;?>" id="other<?php echo $i;?>"></td>
<td>
<input type="text" name="quan<?php echo $i;?>" id="quan<?php echo $i;?>" value="0"></td>
<td><input type="text" name="unit<?php echo $i;?>" id="unit<?php echo $i;?>" onkeyup="calculateTotal('<?php echo $i;?>')"></td>
<td><span name="total<?php echo $i;?>" id="total<?php echo $i;?>"></span></td>
</tr>
<?php }?>
</tbody>
</table>
</form>
<span id="subm3" class="subm3" >Submit </span>
The Ajax:
<script>
$(document).on('click', '.subm3', function() {
var datas = {};
for ($i = 1; $i < 2; $i++) {
// drop down list of items
datas["item_name"+$i]= $('#itemname'+$i+' option:selected').attr('value')
// other name
datas["other"+$i]= $('input[name=other'+$i+']').val()
// quantity
datas["quan"+$i]= $('input[name=quan'+$i+']').val()
// price per unit
datas["unit"+$i]= $('input[name=unit'+$i+']').val()
}
$i = $i_limit-1;
$.ajax({
url: 'parts/process.php?order=3&items='+$i,
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(datas)
});
});
</script>
then the process :
<?php
if ($order==3){
$loop = $_GET[items];
$other1= $_POST["other1"];
echo "other1 = ".$other1;
}
?>
On chrome inspector i get that the data was sent like this as source :
{"item_name1":"other","other1":"Water Valve","quan1":"2","unit1":"2"}
and like this as parsed :
item_name1: "other"
other1: "Water Valve"
quan1: "2"
unit1: "2"
but the response from process.php (the one that got the values) seems to only have read the get values but not the post values :
other1 =
i am pretty much new to ajax and hope someone could help point me to where i am going wrong here. This might not even be the easiest or best way of doing what i am trying to do, but it kind of makes sense to my brain at the moment so i am taking this route. Any help is appreciated
can you try data:datas insted of data: JSON.stringify(datas) in ajax request
ref: how to send multiple data with $.ajax() jquery
Related
The problem occurs when I insert without data. So I want your help in solving this problem.
This is my file:
students.php
<form id="student_form" method="POST" action="">
<?php
if(mysql_num_rows($q)>0){
?>
<table border="0" dir="ltr" align="center"cellpadding='0' cellspacing='0' >
<tr> <th>Student ID</th><th>Name</th><th>AVG</th><th>Joining Year</th><th>Message</th><th>Sending Message</th> </tr>
<?php while($row = mysql_fetch_array($q)){ ?>
<tr>
<td id="stud_id[]"> <?php echo $row['studant_ID']; ?></td>
<td> <?php echo $row['studant_Name']; ?></td>
<td> <?php echo $row['Average']; ?></td>
<td> <?php echo $row['year']; ?></td>
<td> <input id="message1[]" name="message1[]" type="text" size="25px" /></td>
<td><input name="submit[]" id="submit[]" type="submit" value="Send" /> </td>
</tr>
<?php }}
and this is my insert file:
insert_message.php
if (isset($_POST['message1']) && $_POST['message1']!='') {
$addss = mysql_real_escape_string($_POST['message1']);
}
if (isset($_POST['stud_id']) && $_POST['stud_id']!='') {
$std_id = mysql_real_escape_string($_POST['stud_id']);
}
//#######################################################################
$query1 = "INSERT INTO `message` (`rcvrid`, `senderid`, `msg`) VALUES ('$std_id', '22011111', '$addss'); ";
mysql_query($query1);
I connect between two file by jquery and ajax.
<script>
$("#student_form").on("submit", function(event) {
event.preventDefault();
$.ajax({
type: "POST",
url: "insert_message.php",
data: $(this).serialize(),
success: function(data) {
$("#inner_contant").append(data+"<br/>");//instead this line here you can call some function to read database values and display
},
});
});
</script>
Remove the form from the page
<tr>
<td id="stud_id"> <?php echo $row['studant_ID']; ?>
<input type="hidden" name="stud_id" value="<?php echo $row['studant_ID']; ?>"/>
</td>
<td> <?php echo $row['studant_Name']; ?></td>
<td> <?php echo $row['Average']; ?></td>
<td> <?php echo $row['year']; ?></td>
<td> <input id="message1" name="message1" type="text" size="25px" /></td>
<td><button class="submit" type="submit" />Send </button> </td>
</tr>
second:
your js should look like this:
$(".submit").on("click", function(event) {
event.preventDefault();
$.ajax({
type: "POST",
url: "insert_message.php",
data: {stud_id:$(this).closest('tr').find('input[name="stud_id"]').val(),message1:$(this).closest('tr').find('input[name="message1"]').val()},
success: function(data) {
$("#inner_contant").append(data+"<br/>");//instead this line here you can call some function to read database values and display
},
});
});
In insert_message.php
you need to echo a message to see if you where succesful in updating the database
echo json_encode(array('message'=>'Data updated/Error'));
First of all - all data passed to server in a $_POST array is taken from input fields with name attribute (unless you have some custom js handlers).
So
<td id="stud_id[]"> <?php echo $row['studant_ID']; ?></td>
does nothing.
If you want to store studant_ID somehow - use hidden field for example:
<td>
<input type="hidden" name="stud_id[]" value="<?php echo $row['studant_ID']; ?>" />
</td>
Next - what do you want from this buttons:
<input name="submit[]" id="submit[]" type="submit" value="Send" />
As they are all belong to one form they will do the same - send all fields to server. If you want every submit button send to server only a pair student_id, message you have to create a form for each pair (or do some js-handlers). Otherwise, on your server you'll have:
$_POST['stud_id'] array of all students ids from form
$_POST['message1'] array of all messages from form
If you want to process them all - do a foreach:
foreach ($_POST['stud_id'] as $key => $id) {
// find the message
$msg = $_POST['message1'][$key];
$query1 = "INSERT INTO `message` (`rcvrid`, `senderid`, `msg`) VALUES ('$id', '22011111', '$msg'); ";
mysql_query($query1);
}
And of course you should remove mysql_ functions and use newer apis - PDO or mysqli
Excuse me if this question is already asked everywhere, but i cant find answer that worked.
So I have a dynamically generated table, which is generated by selecting rows from a table in a database.
This is the view file that create the table.
all rows except the heading are created based on how many data found in the table in a database, so, all the inputs are have name like
<form class="form-horizontal" role="form" id="formDtKryw" method="POST" action="updKryw">
<div class="table-responsive form-group row">
<table class="table table-hover table-condensed table-bordered">
<thead class="text-center">
<tr>
<th>No</th>
<th>Nama</th>
<th>Telepon</th>
</tr>
</thead>
<tbody>
<?php $no = 0;
foreach ($dftr_crKryw as $data_crKryw):
$no_ktp[$no] = $data_crKryw->no_ktp;
?>
<input type="hidden" name="no_ktp[<?php echo $no; ?>]" id="no_ktp[<?php echo $no; ?>]" value="<?php echo $data_crKryw->no_ktp; ?>">
<tr>
<td><?php echo $no+1; ?></td>
<td><?php $this->db->select('nama,')->from('dt_prbd')->where('no_ktp', $data_crKryw->no_ktp);
$qry = $this->db->get();
if ($qry->num_rows() > 0) {
foreach($qry->result() as $data):
echo $data->nama;
endforeach;
}
?></td>
<td><?php
if ($data_crKryw->memo == NULL) {
?>
<select class="form-control input-sm" name="memo[<?php echo $no; ?>]" id="memo[<?php echo $no; ?>]">
<option value="">---Pilih---</option>
<option value="Memo 1">Memo 1</option>
<option value="Memo 2">Memo 2</option>
<option value="Memo 3">Memo 3</option>
</select>
<?php
}
else {
echo $data_crKryw->memo;
}
?></td>
</tr>
<?php
$no++;
endforeach;
}
?>
<input type="hidden" name="totData" id="totData" value="<?php echo $no; ?>">
<tr>
<td colspan="11" align="right"><button type="submit" id="submit" class="btn btn-primary">Simpan Data</button> <button type="reset" class="btn btn-danger">Hapus Form</button></td>
</tr>
</tbody>
</table>
</div>
</form>
This is the Controller that should catch the inputs
function updKryw(){
$totData = $this->input->post('totData');
$no_ktp = $this->input->post('no_ktp');
$memo = $this->input->post('memo');
$frmUpdKryw = array(
'totData' => $totData,
'no_ktp' => $no_ktp,
'memo' => $memo
);
$this->load->view('display_data', $frmUpdKryw);
}
And this is the view file that suppose to view all the captured information from the form
<html>
<head></head>
<body>
<?php
for($x = 0; $x < $totData; $x++){
echo $totData . "<br>";
echo $no_ktp[$x] . "<br>";
echo $memo[$x] . "<br>";
}
?>
</body>
</html>
All that displayed is only the $totData, and the $no_ktp[$x] and $memo[$x] is not display anything.
Anyone can help please if there is any error in my code or my logic.
Thanks in advance.
=========================================================================
edit: i started to think that my php engine is broken. why?
even this simple form doesn't display anything.
form.php
<form name="myForm" method="post" action="go.php">
<input type="text" name="name" value="firstname">
<input type="text" name="addr" value="firstaddr">
<button type="submit" name="submit" id="submit">save</button>
</form>
go.php
$name = $_POST[name];
$addr = $_POST[addr];
echo $name;
echo $addr;
First I recommend debug before saving data to $frmUpdKryw array
$this->input->post(NULL, TRUE); // returns all POST items with XSS filter
$this->input->post(); // returns all POST items without XSS filter
Then if data is not empty, before
$this->load->view('display_data', $frmUpdKryw);
add
var_dump($frmUpdKryw);
if all is good here, then to debug in beginning of the view
var_dump($totData);
var_dump($no_ktp);
var_dump($memo);
If all is good here then problem is in your loop, so you will need just fix it. Either you will know where you have problems:
failed with sending data with POST
failed with saving to new variable
failed with sending data to view
and last failed with loop
Hope it will help
when I solve another problem within the same app, this problem is fixed too, the problem is not in the code or logic. all codes are works as expected.
here are the link for the solution. not the solution that I expect, but its working.
The Solution
thanks to Abdulla and Oleg Sapishchuk
I have to do something like this and here is my code
When start and end date is completed, I need to enable the author select box.
The author names should be dynamically loaded from database based on the start and end date.
My form is ready, and the script is done with my minimal knowledge. Needs some expert help in completing my code.
Any help in doing this will be highly appreciable
<script type="text/javascript">
$("#to_date_change").change('input',function() {
$('#author_code').prop('disabled', false);
});
</script>
<table>
<thead>
<tr>
<th class="text-center">Start Date</th>
<th class="text-center">End Date</th>
<th class="text-center">Resources</th>
</tr>
</thead>
<tbody>
<?php for($i=1; $i<=5; $i++) { ?>
<tr>
<td>
<input class="start_date_change" id="start_date_change" name="from_date_<?php echo $i; ?>" type="text">
</td>
<td>
<input class="end_date_change" id="end_date_change" name="to_date_<?php echo $i; ?>" type="text">
</td>
<td class="text-justify" nowrap="nowrap">
<select disabled="disabled" name="author_code_<?php echo $i; ?>" id="author_code" class="author_code" style="width: 250px;">
<option value="">Select Author</option>
<?php
// ............. this should come from ajax load based on start and end date ................
echo "<option value=".$tbemp[$r][0].">".$tbemp[$r][0]." - ".$tbemp[$r][2]."</option>";
// ............. this should come from ajax load based on start and end date ................
?>
</select>
</td>
</tr>
<?php } ?>
</tbody>
</table>
Use ajax call to send data and fetch result, use that result to display.
var start_date,end_date;
//fetch and assign the date to these variables
$.ajax({
url: "/path/to/script/for/processing",
type: "post",
data: {start: start_date,end: end_date}
}).done(function(data){
//data contains the result returned from the script.
// use that data to display.
});
I have a table there is showing some values. In each row there is a Order_ID and a button.
How can i get my value in $Order_ID to show (alert) when clicking on a button?
<tbody>
<?php
foreach($menuextra_result as $transaction)
{
?>
<tr>
$order_id = isset($transaction['order_id'])?($transaction['order_id']) :"";
?>
<?php if($order_id){ ?>
<td><div id="orderID"><?= $order_id ?></a></td>
<?php } else {?>
<td><div ><span style="color:red">MANGLER</span></td>
<?php }?>
style="color:red">MISSING</span></td>
<?php }?>
//There's more here, but did not bother to show it, because it was irrelevant.
<td><input type="submit" onclick="getElementById" value="Yes "></td>
<?php }
?>
</tr>
<?php
}
?>
</tbody>
This is how i tried
<script type="text/javascript">
function getElementById()
{
el = document.getElementById('order_id');
alert(el);
}
</script>
But when clicking on a button, nothing happens
table.php
//assuming you have done you loop work
<table>
<tr>
<td>
<?php echo $row['name']?>
</td>
<td><input type="button" value="click me" onclick="clickMe(<?php echo $row['id']?>)" /></td>
</tr>
</table>
clickme unction is like this
function clickMe(id) {
alert(id);
}
You will pass one parameter to clickMe() function and the parameter is id
First of all, don't use id as you have more than one such element. You can use class instead:
<div class="orderID"><?= $order_id ?></div>
Also fixed invalid HTML you got, closing tag for <div> is </div> and not </a>.
Second, change the click to send the button to the function:
<input type="submit" onclick="FindOrder(this);" value="Yes " />
And finally this function should do the trick: (by searching for "brother" div)
function FindOrder(oButton) {
var oRow = oButton.parentNode;
while (oRow && oRow.tagName.toLowerCase() !== "tr")
oRow = oRow.parentNode;
var arrDivs = oRow.getElementsByTagName("div");
var orderDiv = null;
for (var i = 0; i < arrDivs.length; i++) {
if (arrDivs[i].className === "orderID") {
orderDiv = arrDivs[i];
break;
}
}
if (orderDiv != null) {
var orderNumber = orderDiv.innerHTML;
alert("order is " + orderNumber);
} else {
alert("order not found");
}
}
Live test case.
You'll need to print the $order_id to your HTML somewhere. You could use hidden input:
<input name="order_id" id="order_id" value="<?php echo $order_id; ?>">
Then you can submit form or grab the value.
You can't getElementById from you web page if it does not exist.
So solution is simple, just add an hidden input element on your table. You can get the id from your script.
<tbody>
<?php
foreach($menuextra_result as $transaction)
{
?>
<tr>
<?php
$order_id = isset($transaction['order_id'])?($transaction['order_id']) :"";
?>
//There's more here, but did not bother to show it, because it was irrelevant.
<td>
<input type="hidden" name="order_id" id="order_id" value="<?php echo $order_id;?>">
<input type="submit" onclick="getElementById" value="Yes "></td>
<?php }
?>
</tr>
<?php
}
?>
</tbody>
<tr id="<?php echo $id?>">
<input type="hidden" value="<?php echo $id?>"/>
<td> <?php echo $id;?> </td>
<td id="fname"> <?php echo $firstname[$key];?> </td>
<td id="lname"> <?php echo $lastname[$key];?> </td>
<td id="tage"> <?php echo $age[$key];?> </td>
</tr>
jQuery:
$('.edit').click (function(){
var id = $(this).parent().data('id');
var fname = $('#id').find('#fname');
alert(fname);
});
Want to get the text inside <td>
In alert it returns an object.
What am I doing wrong?
You are using a string instead of an jquery object for your selector.
$(id).find('#fname')
You might consider this, if the value you're retrieving is that of an id, so it will need the hash to be a valid selector:
$('#' + id).find('#fname')
Also, valid markup requires id's to be unique on the page.