Unë kam dizajnuar një tabelë dinamike html dhe ajo përmban 2 kolona tabele:
- kolona 1: Emri i artikullit. Vjen nga opsioni i zgjedhur.
- kolona 2: Çmimi i artikullit. Vjen nga vlera e opsionit të zgjedhur.
Tani për tani po zgjedh opsionin në kolonën e parë dhe kaloj vlerën në fushën e hyrjes në kolonën e dytë. Pasi të shtoj sa më shumë rreshta që më duhen, dua të kaloj edhe text dhe value të tyre në php.
Por php po merr vetëm vlerën e opsionit në vend që të ketë tekst dhe vlerë.
Këtu është kodi im
$('#myTable').on('change', '.mySelect', function() {
// you can use .closest() to find
// particular input on same row with select
$(this).closest('tr').find('.amount').val($(this).val());
//$(this).closest('tr').find('.mySelect').val($(".mySelect option:selected").text());
});
$('#myTable').on('click','.remScnt', function(e) {
e.preventDefault();
// find the tr element of remove link
// which is a parent
$(this).closest('tr').remove()
});
$(".mySelect option").filter(function() {
//may want to use $.trim in here
return $(this).text() == $(this).val();
}).prop('selected', true);<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<style>
table, th, td {
border-collapse: collapse;
margin: 10px auto;
}
</style>
<script>
function addMore() {
var table = document.getElementById("myTable");
var row = table.insertRow(-1);
var cell1 = row.insertCell(-1);
var cell2 = row.insertCell(-1);
var x = document.getElementById("myTable").rows[1].cells;
cell1.innerHTML = x[0].innerHTML;
cell2.innerHTML = x[1].innerHTML;
}
function removeLast() {
document.getElementById("myTable").deleteRow(-1);
}
function removeRowNo() {
var index = document.getElementById('value').value
document.getElementById("myTable").deleteRow(index);
}
</script>
</head>
<body>
<form action="testlist.php" method="post">
<table>
<tr>
<td>
Month:
</td>
<td>
<select name="SALMT" id="month" onchange="" size="1">
<option value="" disabled selected>Month</option>
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
</td>
<td>
Year:
</td>
<td> <input type="text" name="SALYR">
</td>
</tr>
<tr>
<td>
Employee ID:
</td>
<td> <input type="text" name="EMPID">
</td>
<td>
Name:
</td>
<td><input type="text" name="NM">
</td>
</tr>
<tr>
<td>
Department Code:
</td>
<td> <input type="text" name="DPTID">
</td>
<td>
Designation:
</td>
<td><input type="text" name="DSG">
</td>
</tr>
</table>
<table id="myTable">
<tr>
<th>Items</th>
<th>Amount</th>
</tr>
<tr>
<td >
<a href="#" class="remScnt">Remove</a>
<select class="mySelect" name="DESCRP[]" >
<option disabled="" selected="">Select</option>
<option value="100">Item-1</option>
<option value="200">Item-2</option>
<option value="300">Item-3</option>
<option value="400">Item-4</option>
<option value="500">Item-5</option>
</select>
</td>
<td> <input type="text" class="amount" name="ALAMT[]"></td>
</tr>
</table>
<table>
<tr>
<td><input type="submit" /> </td>
</tr>
</table>
</form>
<br>
<table>
<tr>
<td><button onclick="addMore()">Add More</button></td>
<td><button onclick="removeLast()">Remove Last Row</button></td>
</tr>
<tr>
<td><input type="text" maxlength="3" name="value" id='value'></td>
<td><button onclick="removeRowNo()">Remove By Row No.</button></td>
</tr>
</table>
</body>
</html>Këtu është kodi php:
<?php
var_dump($_POST);
echo "<br>";
echo count($_POST["DESCRP"]);
foreach ($_POST["DESCRP"] as $d) {
echo "<br>";
echo $d;
}
echo "<br>Amount:";
echo count($amount = $_POST["ALAMT"]);
foreach ($_POST["DESCRP"] as $a) {
echo "<br>";
echo $a;
}
?>
