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 () { $ (document).on ('click', '.js-add-program', function () {
var templateSelector = $ (this).data ('template') + ":last"; var $template= $($(this).data('template'));
var $templateContainer = $ ($ (this).data ('template-container'));
var $template = $templateContainer.find (templateSelector);
var $copy = $template.clone ().removeClass ('template'); $template.clone().appendTo($template.parent());
var itemsCount = $ ('.template-container__item').length; renameInputs();
$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);
$ ('.select-time').datetimepicker ({ $ ('.select-time').datetimepicker ({
format: 'LT', format: 'LT',
@@ -28,7 +18,6 @@ function renameInputs() {
items.each (function () { items.each (function () {
var $rows = $ (this).find ('input'); var $rows = $ (this).find ('input');
$rows.each (function () { $rows.each (function () {
var name = $ (this).attr ('name'); var name = $ (this).attr ('name');
$ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + i + ']')); $ (this).attr ('name', name.replace (/\[[0-9]+\]/g, '[' + i + ']'));
@@ -51,14 +40,15 @@ function sortEvents($container, $templates) {
var elements = $templates.get (); 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 timeA = $ (a).find ('.select-time').val ();
var timeB = $ (b).find ('.select-time').val (); var timeB = $ (b).find ('.select-time').val ();
return timeA > timeB; return timeA > timeB ? 1 : -1;
}); });
$container.append (elements); $container.append (elements);
@@ -73,6 +63,7 @@ function checkEvents($container, $templates) {
var time = $ (this).find ('.select-time').val (); var time = $ (this).find ('.select-time').val ();
if (time < lastTime) { if (time < lastTime) {
// console.log ($(this).find('.select-time').attr('name')+": "+time + " < " + lastTime);
orderCorrect = false; orderCorrect = false;
} }
lastTime = time; lastTime = time;
@@ -89,7 +80,7 @@ $ (document).ready (function () {
setInterval (function () { setInterval (function () {
var $templateContainer = $ ('.template-container'); var $templateContainer = $ ('.template-container');
var $templates = $ ('.template'); var $templates = $ ('.program-template');
checkEvents ($templateContainer, $templates); checkEvents ($templateContainer, $templates);
}, 1000); }, 1000);
+1 -1
View File
@@ -3,7 +3,7 @@
@import "timeline"; @import "timeline";
@import "gallery"; @import "gallery";
.template:first-child { .program-template:first-child, .template:first-child {
.js-remove-program { .js-remove-program {
display: none; display: none;
} }
+12 -5
View File
@@ -31,16 +31,23 @@
<a name="mainInfo"></a> <a name="mainInfo"></a>
<div class="row"> <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"> <div class="col-md-4">
<h2>Kdy?</h2> <h2>Kdy?</h2>
<p><%= date.getDate () %>. <%= date.getMonth () + 1 %>. <%= date.getFullYear () %> </p> <p><%= day %>. <%= month %>. <%= year %> </p>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<h2>V kolik?</h2> <h2>V kolik?</h2>
<p><%= date.getHours () %> <p><%= time %></p>
:<%= date.getMinutes () < 10 ? '0' + date.getMinutes () : date.getMinutes () %></p>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<h2>Kde?</h2> <h2>Kde?</h2>
+10 -10
View File
@@ -16,17 +16,17 @@
<table class="table table-bordered table-striped table-hover"> <table class="table table-bordered table-striped table-hover">
<thead> <thead>
<tr> <tr>
<th></th> <!--<th></th>-->
<th>Název skupiny</th> <th>Název skupiny</th>
<th>Limit</th> <th>Limit</th>
</tr> </tr>
</thead> </thead>
<tbody class="template-container draggable-container"> <tbody class="template-container draggable-container">
<tr class="template draggable template-container__item"> <tr class="add-group-template draggable template-container__item">
<td> <!--<td>-->
<i class="fa fa-ellipsis-v sort-handle"></i> <!--<i class="fa fa-fw fa-ellipsis-v sort-handle"></i>-->
</td> <!--</td>-->
<td><input type="text" class="form-control" name="name[0]" value="Rozlučka se svobodou"> <td><input type="text" class="form-control" name="name[0]" value="Rozlučka se svobodou">
</td> </td>
<td style="width: 25%"> <td style="width: 25%">
@@ -42,10 +42,10 @@
</td> </td>
</tr> </tr>
<tr class="template draggable template-container__item"> <tr class="add-group-template draggable template-container__item">
<td> <!--<td>-->
<i class="fa fa-ellipsis-v sort-handle"></i> <!--<i class="fa fa-fw fa-ellipsis-v sort-handle"></i>-->
</td> <!--</td>-->
<td> <td>
<input type="text" class="form-control" name="name[1]" value="Rozlučka se svobodou - nevěsta"> <input type="text" class="form-control" name="name[1]" value="Rozlučka se svobodou - nevěsta">
</td> </td>
@@ -67,7 +67,7 @@
<tfoot> <tfoot>
<tr> <tr>
<td colspan="3"> <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> Přidat skupinu</a>
</td> </td>
</tr> </tr>
@@ -24,7 +24,7 @@
</thead> </thead>
<tbody class="item-template-container draggable-container"> <tbody class="item-template-container draggable-container">
<tr class="template draggable template-container__item"> <tr class="item-template draggable template-container__item">
<td> <td>
<input type="text" class="form-control" name="name[0]"></td> <input type="text" class="form-control" name="name[0]"></td>
<td style="width: 25%"> <td style="width: 25%">
@@ -53,7 +53,7 @@
<tfoot> <tfoot>
<tr> <tr>
<td colspan="3"> <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> Přidat položku</a>
</td> </td>
</tr> </tr>
@@ -27,38 +27,10 @@
</thead> </thead>
<tbody class="item-in-group-template-container draggable-container"> <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++) { %> <% for (var i = 1; i < 10; i++) { %>
<tr class="draggable template-container__item"> <tr class="budget-item-template draggable template-container__item">
<td style="width: 30px"> <td style="width: 30px" class="sort-handle">
<i class="fa fa-ellipsis-v sort-handle"></i> <i class="fa fa-fw fa-ellipsis-v"></i>
</td> </td>
<td class="text-center" style="width: 30px;"> <td class="text-center" style="width: 30px;">
<input type="checkbox" name="bought[<%= i %>]" value="1"> <input type="checkbox" name="bought[<%= i %>]" value="1">
@@ -81,7 +53,7 @@
<tfoot> <tfoot>
<tr> <tr>
<td colspan="4"> <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> Přidat položku</a>
</td> </td>
</tr> </tr>
+5 -5
View File
@@ -7,10 +7,10 @@
<th></th> <th></th>
</tr> </tr>
</thead> </thead>
<tbody class="template-container draggable-container"> <tbody class="template-container">
<% for(var i in program) { %> <% for(var i in program) { %>
<tr class="template draggable template-container__item"> <tr class="program-template template-container__item">
<td style="position: relative"> <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"> <input type="text" class="form-control time select-time" size="4" name="program[<%= i %>][time][]" value="<%= program[i]['time'] %>" placeholder="11:00">
</td> </td>
@@ -26,7 +26,7 @@
<input type="text" class="form-control program-description" name="program[<%= i %>][title][]" value="<%= program[i]['title'] %>"> <input type="text" class="form-control program-description" name="program[<%= i %>][title][]" value="<%= program[i]['title'] %>">
</td> </td>
<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> </td>
</tr> </tr>
@@ -36,9 +36,9 @@
<tfoot> <tfoot>
<tr> <tr>
<td colspan="4"> <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> </td>
</tr> </tr>
</tfoot> </tfoot>