Browse Source

adding elements to the table works. but deletion is still a p[roblem

currency
7u83 4 years ago
parent
commit
6840a0d0c3
2 changed files with 58 additions and 26 deletions
  1. +8
    -15
      ka.html
  2. +50
    -11
      kaform.js

+ 8
- 15
ka.html View File

@ -168,22 +168,22 @@
<div class="is-col is-70"> <div class="is-col is-70">
<div class="is-row"> <div class="is-row">
<div class="is-col is-60"> <div class="is-col is-60">
<input type="text" name="type" placeholder="Auslagenart*"/>
<input id="a_type" type="text" name="type" placeholder="Auslagenart*"/>
</div> </div>
<div class="is-col is-40"> <div class="is-col is-40">
<input type="date" name="type" placeholder="Dateum*"/>
<input id="a_date" type="date" name="type" placeholder="Datum*"/>
</div> </div>
</div> </div>
<br> <br>
<input type="text" name="description" placeholder="Beschreibung*"/>
<input id="a_description" type="text" name="description" placeholder="Beschreibung*"/>
<br> <br>
<div class="is-row"> <div class="is-row">
<div class="is-col"> <div class="is-col">
<input type="text" name="amount" placeholder="Betrag*"/>
<input id="a_amount" type="text" name="amount" placeholder="Betrag*"/>
</div> </div>
<div class="is-col"> <div class="is-col">
<input type="text" name="curreny" placeholder="Waehrung*"/>
<input id="a_currency" type="text" name="curreny" placeholder="Waehrung*"/>
</div> </div>
<div class="is-col"> <div class="is-col">
<button type="button" onclick="addTableRow();" <button type="button" onclick="addTableRow();"
@ -192,20 +192,13 @@
</div> </div>
</div> </div>
<div class="is-col is-30">
<div class="form-item">
<div class="upload"
data-kube="upload"
data-type="file" data-multiple="true"
data-target="#upload-target"
data-url="upload.php" data-url-remove="delete.php"
data-progress="true">
</div>
<div class="is-col is-30">
<div id="uploadfield" class="form-item">
</div> </div>
</div> </div>
</div> </div>
<br> <br>
<table id="tabtab" class="is-bordered">
<table id="tabtab" class="is-bordered is-striped">
<thead> <thead>
<tr> <tr>
<th>Auslagenart</th> <th>Auslagenart</th>

+ 50
- 11
kaform.js View File

@ -1,15 +1,21 @@
var nextRowId=1; var nextRowId=1;
function getNextRowId() {
return nextRowId;
}
function renumberTableRows(){ function renumberTableRows(){
var row_no=1; var row_no=1;
var table = document.getElementById("tabbody"); var table = document.getElementById("tabbody");
for (var i = 0, row; row = table.rows[i]; i++) { for (var i = 0, row; row = table.rows[i]; i++) {
row.cells[0].innerHTML=row_no++;
// row.cells[0].innerHTML=row_no++;
} }
} }
function deleteTableRow(rowId){ function deleteTableRow(rowId){
alert (rowId);
var target = document.getElementById("upload-target"+rowId); var target = document.getElementById("upload-target"+rowId);
var children = target.children; var children = target.children;
@ -41,22 +47,33 @@ function addTableRow(){
var element = document.createElement('tr'); var element = document.createElement('tr');
element.setAttribute("id", "trow"+nextRowId); element.setAttribute("id", "trow"+nextRowId);
var a_type = document.getElementById("a_type").value;
var a_date = document.getElementById("a_date").value;
var a_description = document.getElementById("a_description").value;
var a_amount = document.getElementById("a_amount").value;
var a_currency = document.getElementById("a_currency").value;
/* a_type = "Hello";*/
var e=""; var e="";
// add column for position no // add column for position no
e += '<td></td>';
e += `<td>${a_type}</td>`;
// add coluemn for description
e += `<td><textarea name="desc[${nextRowId}]" rows="2"></textarea> </td>`;
// add coluemn for a_type (Auslagenart)
// e += `<td><textarea name="desc[${nextRowId}]" rows="2"></textarea> </td>`;
e += `<td>${a_date}</td>`;
// add column for date // add column for date
e += `<td><input name="date[${nextRowId}]" type="date"/></td>`;
// e += `<td><input name="date[${nextRowId}]" type="date"/></td>`;
e += `<td>${a_description}</td>`;
// add column for num // add column for num
e += `<td><input name="amount[${nextRowId}]" type="num"/></td>`;
e += `<td>${a_amount}</td>`;
// add column for file upload // add column for file upload
e+= `
/* e+= `
<td data-kube=""> <td data-kube="">
<div class="form-item"> <div class="form-item">
<div class="upload" <div class="upload"
@ -68,10 +85,11 @@ function addTableRow(){
</div> </div>
<div id="upload-target${nextRowId}" class="upload-target"></div> <div id="upload-target${nextRowId}" class="upload-target"></div>
</div> </div>
</td> </td>
`;
*/
e += `<td>${a_currency}</td>`;
// `;
// add delete bnutton // add delete bnutton
e += e +=
`<td><span `<td><span
@ -87,6 +105,24 @@ function addTableRow(){
} }
function setUploadField()
{
var e = $K.dom('#uploadfield');
var uf =`<div class="upload"
data-kube="upload"
data-type="file" data-multiple="true"
data-target="#upload-target${nextRowId}"
data-url="upload.php?row=${nextRowId}" data-url-remove="delete.php"
data-progress="true">Beleg hochladen
</div>
<div id="upload-target${nextRowId}" class="upload-target small"></div>
</div>
`;
document.getElementById("uploadfield").innerHTML=uf;
}
$K.add('module', 'kaform', { $K.add('module', 'kaform', {
init: function(app, context) init: function(app, context)
@ -111,7 +147,6 @@ $K.init({
}); });
// startup is here // startup is here
@ -125,5 +160,9 @@ $K.ajax.get({
error: function(response) {} error: function(response) {}
}); });
setUploadField();
// add on table row // add on table row
//addTableRow(); //addTableRow();

Loading…
Cancel
Save