| DIR:/home/u1105814/public_html/tscore.id/demo/ |
| Current File : /home/u1105814/public_html/tscore.id/demo/komoditi.php |
<!DOCTYPE html>
<html>
<head>
<?php include 'attribute/attribute_head.php';?>
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
<?php include 'attribute/attribute_header.php';?>
<?php include 'attribute/attribute_sidebar.php';?>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
E-Arsip
<small>Komoditi</small>
</h1>
<ol class="breadcrumb">
<li>
<a href="index.html"><i class="fa fa-dashboard"></i> Home</a>
</li>
<li class="active">Komoditi</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
<!-- Main row -->
<div class="row">
<!-- Left col -->
<section class="col-lg-6 connectedSortable">
<div class="box box-info">
<div class="box-header with-border">
<h3 class="box-title">Tambah Penyedia</h3>
</div>
<!-- /.box-header -->
<!-- form start -->
<form class="form-horizontal" id="multiInputForm">
<div class="box-body">
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Kelurahan</label>
<div class="col-sm-10">
<select class="form-control select2" style="width: 100%;">
<option selected="selected">Kelurahan A</option>
<option>Kelurahan A</option>
<option>Kelurahan B</option>
<option>Kelurahan C</option>
<option>Kelurahan D</option>
<option>Kelurahan E</option>
<option>Kelurahan F</option>
</select>
</div>
</div>
<div class="form-group">
<label for="textInput" class="col-sm-2 control-label">Distributor</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="textInput" name="textInput"
placeholder="Masukkan Distributor">
</div>
</div>
<div id="inputContainer">
<div class="form-group form-row align-items-center inputGroup mb-2">
<label for="input1" class="col-sm-2 control-label">Komoditi</label>
<div class="col-sm-4">
<select class="form-control select2" style="width: 100%;">
<option selected="selected">Komoditi A</option>
<option>Komoditi A</option>
<option>Komoditi B</option>
<option>Komoditi C</option>
<option>Komoditi D</option>
<option>Komoditi E</option>
<option>Komoditi F</option>
</select>
</div>
<label for="input2" class="col-sm-2 control-label">Jumlah</label>
<div class="col-sm-2 ">
<input type="text" class="form-control" name="input2[]"
placeholder="Enter value 2">
</div>
<div class="col-auto">
<button type="button" class="btn btn-danger mt-4"
onclick="removeInput(this)">Remove</button>
</div>
</div>
</div>
<div class="box-footer">
<button type="button" class="btn btn-primary mb-2 " onclick="addInput()">Add
Input</button>
<button type="submit" class="btn btn-success mb-2">Submit</button>
</div>
</div>
</form>
</div>
<!-- /.box -->
</section>
<!-- /.Left col -->
<section class="col-lg-6 connectedSortable">
<!-- TO DO List -->
<div class="box">
<div class="box-header">
<h3 class="box-title">Ketersediaan Komoditi</h3>
<div class="box-tools">
<div class="input-group" style="width: 150px">
<input type="text" name="table_search" class="form-control input-sm pull-right"
placeholder="Search" />
<div class="input-group-btn">
<button class="btn btn-sm btn-default">
<i class="fa fa-search"></i>
</button>
</div>
</div>
</div>
</div>
<!-- /.box-header -->
<div class="box-body table-responsive no-padding">
<table class="table table-hover">
<tr>
<th>ID</th>
<th>Kelurahan</th>
<th>Tanggal</th>
<th>Status</th>
<th>Alasan</th>
</tr>
<tr>
<td>183</td>
<td>Kelurahan A</td>
<td>11-7-2014</td>
<td><span class="label label-success">Banyak</span></td>
<td>
Bacon ipsum dolor sit amet salami venison chicken flank
fatback doner.
</td>
</tr>
<tr>
<td>219</td>
<td>Kelurahan B</td>
<td>11-7-2014</td>
<td><span class="label label-warning">Sedang</span></td>
<td>
Bacon ipsum dolor sit amet salami venison chicken flank
fatback doner.
</td>
</tr>
<tr>
<td>657</td>
<td>Kelurahan C</td>
<td>11-7-2014</td>
<td><span class="label label-success">Banyak</span></td>
<td>
Bacon ipsum dolor sit amet salami venison chicken flank
fatback doner.
</td>
</tr>
<tr>
<td>175</td>
<td>Kelurahan D</td>
<td>11-7-2014</td>
<td><span class="label label-danger">Sedikit</span></td>
<td>
Bacon ipsum dolor sit amet salami venison chicken flank
fatback doner.
</td>
</tr>
</table>
</div>
<!-- /.box-body -->
<div class="box-footer clearfix">
<ul class="pagination pagination-sm no-margin pull-right">
<li><a href="#">«</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">»</a></li>
</ul>
</div>
</div>
<!-- /.box -->
</section>
<!-- /.Left col -->
</div>
<!-- /.row (main row) -->
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<?php include 'attribute/attribute_footer.php';?>
<!-- Control Sidebar -->
<?php include 'attribute/attribute_aside.php';?>
<div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper -->
<script>
document.getElementById('multiInputForm').addEventListener('submit', function(event) {
event.preventDefault();
const input1s = document.getElementsByName('input1[]');
const input2s = document.getElementsByName('input2[]');
let values = [];
for (let i = 0; i < input1s.length; i++) {
values.push({
input1: input1s[i].value,
input2: input2s[i].value
});
}
alert('Form submitted with values: ' + JSON.stringify(values));
});
function addInput() {
const container = document.getElementById('inputContainer');
const newInputGroup = document.createElement('div');
newInputGroup.className = 'form-row align-items-center inputGroup mb-2';
newInputGroup.innerHTML = `
<div class="form-group form-row align-items-center inputGroup mb-2">
<label for="input1" class="col-sm-2 control-label">Komoditi</label>
<div class="col-sm-4">
<select class="form-control select2" style="width: 100%;">
<option selected="selected">Komoditi A</option>
<option>Komoditi A</option>
<option>Komoditi B</option>
<option>Komoditi C</option>
<option>Komoditi D</option>
<option>Komoditi E</option>
<option>Komoditi F</option>
</select>
</div>
<label for="input2" class="col-sm-2 control-label">Jumlah</label>
<div class="col-sm-2 ">
<input type="text" class="form-control" name="input2[]" placeholder="Enter value 2">
</div>
<div class="col-auto">
<button type="button" class="btn btn-danger mt-4" onclick="removeInput(this)">Remove</button>
</div>
</div>
`;
container.appendChild(newInputGroup);
}
function removeInput(button) {
const inputGroup = button.closest('.inputGroup');
inputGroup.parentNode.removeChild(inputGroup);
}
</script>
<?php include 'attribute/attribute_script.php';?>
</body>
</html> |