I don't know how to give the proper title for this problem, so sorry if this is confusing you all.
First, I have a function to append one row inside a table. Each row will have a dropdown ( select tag) with some option that I retrieve from database. To generate the dropdown, I have a get() function that when the page loaded, I get the output of a php file to show the dropdown with data inside it from my database. i put it inside <div align=center class='finish'></div>. From the default condition, there are already 3 rows with the same format, so I need to start the get() from the beginning. But the problem is that I want to set the dropdown inside the new appended row without refreshing the other existing dropdown. the logic is, when I already choose some option from existing dropdown, an then I want to add new row, I don't want to refreshed the dropdown that already selected.
get() for dropdown function:
$.get("getfinishlist.php", function(item) {
$('.finish').html(item);
});
addrow table function for append row:
function addrow_table() { //#p_rows is the tbody of the table
$('#p_rows').append("<tr><td><div align=center><input type='text' size='5' class='section' name='section[]' style='font-size:11px'></div></td>"
+"<td><div class='desc' style='font-size:11px;'></div></td>"
+"<td><div align=center class='finish'></div><input type='hidden' class='hfinish'></td>"
+"<td><div align=center><input type='text' size='5' name='hrd[]' style='font-size:11px'></div></td>"
+"<td><div align=center><input type='text' size='9' name='length[]' class='length' style='font-size:11px'></div></td>"
+"<td><div align=center><input type='text' size='4' class='pc' name='pc[]' style='font-size:11px'></div></td>"
+"<td><div align=center class='kg'>0</div><input type='hidden' class='hkg' name='kg[]'></td>"
+"<td><div align=center class='price'>0</div><input type='hidden' class='hprice' name='price[]'></td>"
+"<td><div align=center class='amount'>0</div><input type='hidden' class='hamount' name='amount[]'></td>"
+"<td><input type='hidden' style='font-size:11px'>"
+"<div align='center'>"
+"<a href='#' id='delrow' style='text-decoration:none;'>"
+"<div style='border:1px solid #a1a1a1;"
+"background:#dddddd;"
+"width:30px;"
+"border-radius:5px;'>"
+"X"
+"</div></a></div></td>"
+"</tr>");
$.get("getfinishlist.php", function(item) { //I know this is wrong because every time I start the function, every dropdown refreshed
$('.finish').html(item);
});
return false;
}
$('#addrow').click(function() { //#addrow is a div
addrow_table();
});
the php file to retrieve the dropdown:
<?php
include "config/koneksi.php";
echo "<select name='finish[]' class='sfinish'>";
$finish = mysql_query("SELECT * FROM harga");
while($readf = mysql_fetch_array($finish)){
echo "<option value='".$readf['finishing']."'>".$readf['finishing']."</option>";
}
echo "</select>";
?>
I appreciate every answer that everyone give to me. Thank you.
I think what you are trying to do is to set the result of the ajax request to the newly added row, in that case
function addrow_table() { //#p_rows is the tbody of the table
//store the added row reference in a variable - use appendTo() to return the newly added element reference
var $row = $("<tr><td><div align=center><input type='text' size='5' class='section' name='section[]' style='font-size:11px'></div></td>" + "<td><div class='desc' style='font-size:11px;'></div></td>" + "<td><div align=center class='finish'></div><input type='hidden' class='hfinish'></td>" + "<td><div align=center><input type='text' size='5' name='hrd[]' style='font-size:11px'></div></td>" + "<td><div align=center><input type='text' size='9' name='length[]' class='length' style='font-size:11px'></div></td>" + "<td><div align=center><input type='text' size='4' class='pc' name='pc[]' style='font-size:11px'></div></td>" + "<td><div align=center class='kg'>0</div><input type='hidden' class='hkg' name='kg[]'></td>" + "<td><div align=center class='price'>0</div><input type='hidden' class='hprice' name='price[]'></td>" + "<td><div align=center class='amount'>0</div><input type='hidden' class='hamount' name='amount[]'></td>" + "<td><input type='hidden' style='font-size:11px'>" + "<div align='center'>" + "<a href='#' id='delrow' style='text-decoration:none;'>" + "<div style='border:1px solid #a1a1a1;" + "background:#dddddd;" + "width:30px;" + "border-radius:5px;'>" + "X" + "</div></a></div></td>" + "</tr>").appendTo('#p_rows');
$.get("getfinishlist.php", function (item) {
//find the finish element in the newly added row
$row.find('.finish').html(item);
});
return false;
}
$('#addrow').click(function () { //#addrow is a div
addrow_table();
});
Related
I have a table and I want to add songs into my database. Every song has its own songID , so when I try to add a song it also has to update the songID. at this moment it didn't work.
if($action == "add-songs"){
$db = mysqli_connect($host, $user, $pass,$database);
if($_GET['action3'] == "2"){
mysqli_query($db, "INSERT INTO songs (id, songName, songID) VALUES (0, '".$_GET['songname']."', '".$_GET['id']."')");
header("Location: /?action=show-songs");
}
$h = "";
$h.= "";
$h.= "<form><input type='hidden' name='action' value='add-songs'><input type='hidden' name='action3' value='2'><input type='hidden' name='id' value='id'><table class='table table-striped'>";
$h.= " <tr>";
$h.= " <td><b>Nummer</b></td>";
$h.= " <td><input type='text' name='songname' class='form-control' placeholder='Naam'></td>";
$h.= " </tr>";
$h.= " <tr>";
$h.= " <td colspan='2'><input class='btn btn-primary' type='submit' value='UPDATE'></td>";
$h.= " </tr>";
$h.= "</table></form>";
echo $htop;
echo $h;
echo $hbot;
The problem is because of the following <input> element,
<input type='hidden' name='id' value='id'>
You're using the same string value id as id column value for all of your songs.
Now look at your songs table structure, id column is of type INT, which means you're inserting a string value in the column of type integer. And this is why your business logic is failing.
The solution is, don't make the above input element hidden. Explicitly put the song id corresponding to the particular song name. So change the above <input> element like this:
<input type='text' name='id' placeholder='id'>
I have a table containing multiple rows of input boxes. Entire table and its contents are created dynamically using jQuery Post. Each tr in the table has 7 td and the first td contains a radio button and remaining have text input boxes with values. User has to change the values in the text boxes and click on radio button to update the same. how to get the value if input boxes in the selected row?
I used following function to pop an alert message
jQuery(document).delegate("[name='edit']", "click",function (e) {
alert("clicked");}
This is working. I want to get values of input boxes using this. closest tr input . But do not know the syntax. Please help
the script for creating the table is like this:
echo'<form id="shiftentry" name="shiftentry" >';
echo "Date:<input id=shiftdate value='".$date."'/>";
echo "Unit:<input id=shiftdate value='".$unit."'/>";
echo "Shift:<input id=shiftdate value='".$shift."'/><br/>";
echo "<table><tr><th>No</th><th>Ele</th><th>Location</th><th>Drate </th><th>H3 Val </th><th>Part </th> <th>Iod</th><th>Cont. </th></tr>";
while($row2=mysql_fetch_array($result_sec))
{
echo "<tr>";
echo "<td><input name='edit' type='radio'/></td>";
echo "<td>".++$rc."</td>";
echo "<td><input size='5' id='".$row2['ele']."' value='".$row2['ele']."' /></td>";
echo "<td><input id='".$row2['loc_id']."' value='".$row2['loc']."' /></td>";
echo "<td><input size='5' id='drate".$rc."' value='".$row2['drate']."'/></td>";
echo "<td><input size='5' id='h3".$rc."' value='0' /></td>";
echo "<td><input size='5' id='part".$rc."' value='0' /></td>";
echo "<td><input size='5' id='iod".$rc."' value='0' /></td>";
echo "<td><input size='5' id='cont".$rc."' value='0' /></td>";
echo "</tr>";
}
echo " </table>";
echo '<div align="center">';
echo '<input type="submit" id="submit2" name="submit2" value="Submit" width="30" />';
echo '</div>';
echo '</form>';
Take a look on .closest() and :eq() selector.
jQuery(document).delegate("input[name='edit']", "click",function (e) {
// Will return the Parent Row of clicked input
var _tr = $(this).closest('tr');
// You have 9 td in particular row
// Let's access the 7th input box: <input size='5' id='iod".$rc."' value='0' />
$('td:eq(7) input', _tr).val(); // will return its value
});
I am fetching data from database , each rowof data creates a form , each row has a "book" button, which submits phase and site data, but this "book" button does not work in Firefox and IE , it works in chrome
<?php
echo"<div style='overflow-y:scroll;height:200px;float:left;' ><table border=1 >
<tr>
<td>phase</td> <td>site no.</td> <td>plot-size</td> <td>face</td> <td>sply</td> <td>status</td><td>select </td>
</tr>" ;
while($row = mysql_fetch_array($ret, MYSQL_ASSOC))
{
echo "<tr>".
"<form action='restricted.php' method='get'>".
"<td><input type='text' value=\"{$row['phase']}\" name='phase' size='3' readonly /> </td>".
"<td><input type='text' value=\"{$row['id']}\" name='site' size='4' readonly /></td>".
"<td> {$row['size']} </td>".
"<td> {$row['facing']} </td>".
"<td>{$row['sply']} </td> ".
"<td>{$row['status']} </td> ".
"<td><input type='submit' name='book' value='book' \" /></td>".
"</form>".
"</tr>";
}
echo "</table></div>";
?>
you cannot have a form within a <tr> element. You must either put the form outside the table, or inside a <td> element. Firefox is probably complaining about that.
I just need a little help here about creating an autocomplete textbox.
I found a solution with this but I can't integrate it with my code.
Here's my reference http://vortexdev.netii.net/article_16/How_to:_Autocomplete_with_CodeIgniter_and_jQuery
I followed this steps but It doesn't work for me. I think it is in my array. Because i created a loop that will display my rows and consist of textfields.
Here's my code.
In my view I have something like this
Here's the Jquery part
$("[id^=code]").keypress(function(e){
var index = this.id.match(/\d+/)[0];
if(e.which == 13){
e.preventDefault();
}
var searched = $('#code'+index).val();
var fullurl = $('#codelist'+index).val() + 'index.php/item_controller/getResult/' + searched;
$.getJSON(fullurl,function(result){
//display suggestion code goes here
var elements = [];
$.each(result,function(i,val){
elements.push(val.title);
});
$('#code'+index).autocomplete({
source : elements;
});
});
});
Here's the loop part
for($i = 1; $i < 16; $i++){
echo "<tr>";
echo "<td>";
echo "<input type='text' name='code[]' id='code{$i}' />";
echo "<input type='hidden' name='codex[]' id='codelist{$i}' value='"base_url()"'/>";
echo "</td>";
echo "<td><input type='text' name='qty[]' id='qty{$i}' style='text-align: center' readonly='readonly' /></td>";
echo "<td><input type='text' name='price[]' id='price{$i}' style='text-align: right;' onblur='' readonly='readonly' /></td>";
echo "<td><input type='text' name='total[]' id='total{$i}' style='font-family: courier; text-align: right; background-color: lightgray; color: red' readonly='readonly' value='' /></td>";
echo "<tr>";
}
And finally here's the part in my controller.
public function getResult($code){
if(!empty($code) || isset($code)){
$this->db->like('order_code',$code);
echo json_encode( $this->db->get('item')->result());
}
}
That's my code I hope you can help me. Thanks
Im am trying to add a check box that will enable/disable the edit button. Im retrieving a price list and displaying it inside a table. When i add the javascript into the php code it doesn't work. Below is my code
<table border="1">
<tr>
<td width="100">Fee % </td>
<td width="100">Price</td>
<td width="100">Total</td>
<td width="102"> </td>
</tr>
<tr>
<?php
$sql1="select * from pricelist";
$result1=mysql_query($sql1) or die(mysql_error());
while ($row=mysql_fetch_array($result1)) {
$id=$row['id'];
$price=$row['h_price'];
$a=0;
print "<form id='form1' name='$a+' method='post' action=''>";
print "<td><input name='fees' value ='$fees' type='text' size='4' /></td>";
print "<td><input name='price' value ='$price' type='text' size='15' /></td>";
echo "<td><input type='checkbox' onclick='this.$a+.disabled = !this.checked;'><td>";
print"<td><input type='submit' name='$a+' value='Submit' disabled='disabled' /></td>";
print "</tr>";
print "</form>";
}
?>
</table>
Can someone please tell me what am i doing wrong?
Thanks
take out the following code out of loop... it creates multiple form tag...
print "<form id='form1' name='$a+' method='post' action=''>";
Place "<tr></tr>" inside the loop...
final code looks like:
<form id='form1' name='fm1' method='post' action=''> <tr>
<?php
$sql1="select * from pricelist";
$result1=mysql_query($sql1) or die(mysql_error());
while ($row=mysql_fetch_array($result1)) {
$id=$row['id'];
$price=$row['h_price'];
$a=0;
print "<tr>";
print "<td><input name='fees' value ='$fees' type='text' size='4' /></td>";
print "<td><input name='price' value ='$price' type='text' size='15' /></td>";
echo "<td><input type='checkbox' onclick='this.$a+.disabled = !this.checked;'><td>";
print"<td><input type='submit' name='$a+' value='Submit' disabled='disabled' /></td>";
print "</tr>";
}
print "</form>";
?>
Next if u want to control the button only then
<input type='checkbox' onclick='document.$a.submit.disabled = !this.checked;' />
and make sure of the following things:
1.) form name should be $a
i.e <form name='$a' ...>
2.) submit buttons name should be submit
i.e <input type='submit' name='submit'...>
3.) increase the $a variable only at the end of loop
i.e
$a++;
}
i think $a+ will cause syntax error. you need to increment $a at the end of loop like $a++. Also see page source and see what is coming from server.
I would recommend using following format for html + php output
<form id='form1' name='<?=$a++?>' method='post' action=''>
<tr>
<td><input name='fees' value ='<?=$fees?>' type='text' size='4' /></td>
<td><input name='price' value ='<?=$price?>' type='text' size='15' /></td>
<td><input type='checkbox' onclick='this.disabled = !this.checked;'><td>
<td><input type='submit' name='<?=$a++?>' value='Submit' disabled='disabled' /></td>
</tr>
</form>
<?
you also need to have < tr > to be in the while loop.
In your html part where you set up the formular you have to use " " to escape the php code. example:
print "<form id='form1' name='".$a+."' method='post' action=''>";
But as Adeel said already, what is $a+ ?
And you have to edit all prints and echoes in the way, that php expressions are excaped from the HTML source.