Uprava duplikace elementu

This commit is contained in:
Michal Kváček
2018-12-05 00:23:31 +01:00
parent 5f76dc8a7c
commit faf0a9c642
8 changed files with 44 additions and 73 deletions
+1
View File
@@ -117,3 +117,4 @@ $ (function () {
});
+9 -18
View File
@@ -1,19 +1,9 @@
$ (document).on ('click', '.js-add-program', function () {
var templateSelector = $ (this).data ('template') + ":last";
var $templateContainer = $ ($ (this).data ('template-container'));
var $template = $templateContainer.find (templateSelector);
var $template= $($(this).data('template'));
var $copy = $template.clone ().removeClass ('template');
$template.clone().appendTo($template.parent());
var itemsCount = $ ('.template-container__item').length;
$copy.find ('input').each (function () {
var name = $ (this).attr ('name');
if (typeof name !== 'undefined')
$ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + itemsCount + ']'));
});
$copy.removeAttr ('hidden').appendTo ($templateContainer);
renameInputs();
$ ('.select-time').datetimepicker ({
format: 'LT',
@@ -28,7 +18,6 @@ function renameInputs() {
items.each (function () {
var $rows = $ (this).find ('input');
$rows.each (function () {
var name = $ (this).attr ('name');
$ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + i + ']'));
@@ -51,14 +40,15 @@ function sortEvents($container, $templates) {
var elements = $templates.get ();
elements.sort (function (a, b) {
$container.children().remove();
console.log (a);
elements.sort (function (a, b) {
// console.log (a);
var timeA = $ (a).find ('.select-time').val ();
var timeB = $ (b).find ('.select-time').val ();
return timeA > timeB;
return timeA > timeB ? 1 : -1;
});
$container.append (elements);
@@ -73,6 +63,7 @@ function checkEvents($container, $templates) {
var time = $ (this).find ('.select-time').val ();
if (time < lastTime) {
// console.log ($(this).find('.select-time').attr('name')+": "+time + " < " + lastTime);
orderCorrect = false;
}
lastTime = time;
@@ -89,7 +80,7 @@ $ (document).ready (function () {
setInterval (function () {
var $templateContainer = $ ('.template-container');
var $templates = $ ('.template');
var $templates = $ ('.program-template');
checkEvents ($templateContainer, $templates);
}, 1000);
+1 -1
View File
@@ -3,7 +3,7 @@
@import "timeline";
@import "gallery";
.template:first-child {
.program-template:first-child, .template:first-child {
.js-remove-program {
display: none;
}
+12 -5
View File
@@ -31,16 +31,23 @@
<a name="mainInfo"></a>
<div class="row">
todo dodelat parsovani data
<% var date = new Date (wedding.when) %>
<%
var dateParts = wedding.when.split(". ");
var day = dateParts[0];
var month = dateParts[1];
var yearAndTime = dateParts[2].split(" ");
var year = yearAndTime[0];
var time = yearAndTime[1];
%>
<div class="col-md-4">
<h2>Kdy?</h2>
<p><%= date.getDate () %>. <%= date.getMonth () + 1 %>. <%= date.getFullYear () %> </p>
<p><%= day %>. <%= month %>. <%= year %> </p>
</div>
<div class="col-md-4">
<h2>V kolik?</h2>
<p><%= date.getHours () %>
:<%= date.getMinutes () < 10 ? '0' + date.getMinutes () : date.getMinutes () %></p>
<p><%= time %></p>
</div>
<div class="col-md-4">
<h2>Kde?</h2>
+10 -10
View File
@@ -16,17 +16,17 @@
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th></th>
<!--<th></th>-->
<th>Název skupiny</th>
<th>Limit</th>
</tr>
</thead>
<tbody class="template-container draggable-container">
<tr class="template draggable template-container__item">
<td>
<i class="fa fa-ellipsis-v sort-handle"></i>
</td>
<tr class="add-group-template draggable template-container__item">
<!--<td>-->
<!--<i class="fa fa-fw fa-ellipsis-v sort-handle"></i>-->
<!--</td>-->
<td><input type="text" class="form-control" name="name[0]" value="Rozlučka se svobodou">
</td>
<td style="width: 25%">
@@ -42,10 +42,10 @@
</td>
</tr>
<tr class="template draggable template-container__item">
<td>
<i class="fa fa-ellipsis-v sort-handle"></i>
</td>
<tr class="add-group-template draggable template-container__item">
<!--<td>-->
<!--<i class="fa fa-fw fa-ellipsis-v sort-handle"></i>-->
<!--</td>-->
<td>
<input type="text" class="form-control" name="name[1]" value="Rozlučka se svobodou - nevěsta">
</td>
@@ -67,7 +67,7 @@
<tfoot>
<tr>
<td colspan="3">
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template=".add-group-template:last-child"><i class="fa fa-plus"></i>
Přidat skupinu</a>
</td>
</tr>
@@ -24,7 +24,7 @@
</thead>
<tbody class="item-template-container draggable-container">
<tr class="template draggable template-container__item">
<tr class="item-template draggable template-container__item">
<td>
<input type="text" class="form-control" name="name[0]"></td>
<td style="width: 25%">
@@ -53,7 +53,7 @@
<tfoot>
<tr>
<td colspan="3">
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template-container=".item-template-container" data-template=".template"><i class="fa fa-plus"></i>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template=".item-template:last-child"><i class="fa fa-plus"></i>
Přidat položku</a>
</td>
</tr>
@@ -27,38 +27,10 @@
</thead>
<tbody class="item-in-group-template-container draggable-container">
<tr class="template draggable template-container__item" hidden>
<td style="width: 30px">
<i class="fa fa-ellipsis-v sort-handle"></i>
</td>
<td class="text-center" style="width: 30px;">
<input type="checkbox" name="bought[<%= i %>]" value="1">
</td>
<td>
<input type="text">
</td>
<td style="width: 25%">
<div class="input-group">
<input type="number" step="1000" min="1000" name="price[0]" class="form-control">
<div class="input-group-append">
<span class="input-group-text" id="basic-addon2">Kč</span>
</div>
</div>
</td>
<td class="text-right">
<a href="javascript:void(0);" class="js-delete-button" data-target="tr">
<i class="fa fa-trash"></i>
</a>
</td>
</tr>
<% for (var i = 1; i < 10; i++) { %>
<tr class="draggable template-container__item">
<td style="width: 30px">
<i class="fa fa-ellipsis-v sort-handle"></i>
<tr class="budget-item-template draggable template-container__item">
<td style="width: 30px" class="sort-handle">
<i class="fa fa-fw fa-ellipsis-v"></i>
</td>
<td class="text-center" style="width: 30px;">
<input type="checkbox" name="bought[<%= i %>]" value="1">
@@ -81,7 +53,7 @@
<tfoot>
<tr>
<td colspan="4">
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template-container=".item-in-group-template-container" data-template=".template"><i class="fa fa-plus"></i>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template=".budget-item-template:last-child"><i class="fa fa-plus"></i>
Přidat položku</a>
</td>
</tr>
+5 -5
View File
@@ -7,10 +7,10 @@
<th></th>
</tr>
</thead>
<tbody class="template-container draggable-container">
<tbody class="template-container">
<% for(var i in program) { %>
<tr class="template draggable template-container__item">
<tr class="program-template template-container__item">
<td style="position: relative">
<input type="text" class="form-control time select-time" size="4" name="program[<%= i %>][time][]" value="<%= program[i]['time'] %>" placeholder="11:00">
</td>
@@ -26,7 +26,7 @@
<input type="text" class="form-control program-description" name="program[<%= i %>][title][]" value="<%= program[i]['title'] %>">
</td>
<td>
<a href="javascript:void(0);" class="js-remove-program"><i class="fa fa-trash"></i></a>
<a href="javascript:void(0);" class="js-remove-program"><i class="fa fa-2x fa-fw fa-trash"></i></a>
</td>
</tr>
@@ -36,9 +36,9 @@
<tfoot>
<tr>
<td colspan="4">
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template-container=".template-container" data-template=".template"><i class="fa fa-plus"></i> Přidat akci</a>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-add-program" data-template=".program-template:last-child"><i class="fa fa-plus"></i> Přidat akci</a>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-sort-events" style="display: none" data-template-container=".template-container" data-template=".template"><i class="fa fa-sort-numeric-asc"></i> Seřadit akce chronologicky</a>
<a href="javascript:void(0);" class="btn btn-outline-secondary js-sort-events" style="display: none" data-template-container=".template-container" data-template=".program-template"><i class="fa fa-sort-numeric-asc"></i> Seřadit akce chronologicky</a>
</td>
</tr>
</tfoot>