Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Some refactoring in the invoices area. Ajax table update WIP

  • Loading branch information...
commit 054be7a3609410db8f0c7dd5a60b2c7bf212f885 1 parent 279f99f
@rajish authored
View
21 app/views/Invoices/_form.html
@@ -1,4 +1,10 @@
-
+*{
+ WARNING:
+ This template stronly relies on the assumption that it will
+ viewed in a HTML5 compatible browser.
+ }*
+<div class="entity">
+#{form formAction, id:formId}
<div class="row">
<div class="label">&{'invoice.number'}</div>
<div class="field">
@@ -63,15 +69,19 @@
</div>
<span class="error">${errors.forKey('entity.paymentPeriod')}</span>
</div>
+#{/form}
<div class="row">
+*{ The itemsTable is a form itself }*
#{include 'Invoices/_itemsTable.html' /}
</div>
+*{ The fields below still belong to the 'outer' form }*
+
<div class="row">
<div class="label">&{'invoice.notes'}</div>
<div class="field">
- <textarea name="entity.notes" rows="10" cols="40">${entity?.notes}</textarea>
+ <textarea name="entity.notes" rows="10" cols="40" form="${formId}">${entity?.notes}</textarea>
</div>
<span class="error">${errors.forKey('entity.notes')}</span>
</div>
@@ -96,7 +106,12 @@
<div class="row">
<div class="label"></div>
<div class="field">
- <input type="hidden" name="entity.id" value="${entity?.id}"/>
+ <input type="hidden" name="entity.id" value="${entity?.id}" form="${formId}"/>
</div>
<span class="error">${errors.forKey('entity.id')}</span>
</div>
+
+<input type="submit" name="submit" value="&{'Save'}" form="${formId}" />
+</div>
+
+<a href="@{Invoices.index}">&{'Cancel'}</a>
View
44 app/views/Invoices/_itemsTable.css
@@ -0,0 +1,44 @@
+/** Invoice item editor **/
+.itemDesc {
+ width: 250px !important;
+ height: auto;
+ font-family: inherit;
+}
+
+#invoiceItemsTable, #newItemTable {
+
+ border-collapse: collapse;
+}
+
+#invoiceItemsTable thead tr {
+ background-color: #F0F0F0;
+}
+
+#invoiceItemsTable td, #invoiceItemsTable th, #newItemTable td {
+ border: thin solid #BBB !important;
+ padding: 4px 2px 2px 4px;
+}
+
+#invoiceItemsTable tr.even {
+ background-color: #E0E0E0;
+}
+
+#invoiceItemsTable tr.odd {
+ background-color: #E0E0E0;
+}
+
+#invoiceItemsTable tr.itemNew td, #newItemTable tr.itemNew td {
+ background-color: #FCFCE0 !important;
+}
+
+#saveItem button {
+ background-image:url('/public/images/34aL/shadow/standart/png/24x24/001_06.png');
+}
+
+#saveItem button:hover {
+ background-image:url('/public/images/34aL/noshadow/standart/png/24x24/001_06.png');
+}
+
+#saveItem button:active {
+ background-image:url('/public/images/34aL/shadow/standart/png/24x24/001_06.png');
+}
View
77 app/views/Invoices/_itemsTable.html
@@ -1,76 +1,18 @@
#{set 'moreStyles'}
-<style type="text/css">
-/** Invoice item editor **/
-.itemDesc {
- width: 250px !important;
- height: auto;
- font-family: inherit;
-}
-
-#invoiceItemsTable, #newItemTable {
-
- border-collapse: collapse;
-}
-
-#invoiceItemsTable thead tr {
- background-color: #F0F0F0;
-}
-
-#invoiceItemsTable td, #invoiceItemsTable th, #newItemTable td {
- border: thin solid #BBB !important;
- padding: 4px 2px 2px 4px;
-}
-
-#invoiceItemsTable tr.even {
- background-color: #E0E0E0;
-}
-
-#invoiceItemsTable tr.odd {
- background-color: #E0E0E0;
-}
-
-#invoiceItemsTable tr.itemNew td, #newItemTable tr.itemNew td {
- background-color: #FCFCE0 !important;
-}
-</style>
+ <style type="text/css">
+ #{include 'Invoices/_itemsTable.css' /}
+ </style>
#{/set}
#{set 'moreScripts'}
<script src="@{'/public/javascripts/sammy-0.6.3.min.js'}"></script>
-*{ <script src="@{'/public/javascripts/Invoices/soldItem.js'}"></script>}*
-<script>
-;(function($) {
- var app = $.sammy('#invoiceItemsTable', function() {
- this.debug = true;
- var form_fields = null;
-
- this.get('#/', function(context) {
- context.log('main');
- });
-
- this.bind('saveItem', function (context) {
- context.log('saveItem');
- form_fields = this.params;
- var action = #{jsAction @saveItem(':item') /};
- this.partial(action({item: form_fields}));
- });
-
- this.get('#/cancelEdits', function (context) {
- context.log('cancelEdits');
- });
- });
-
- $(function( ) {
- app.run('#/');
- });
-})(jQuery);
-
-var event = jQuery.Event("saveItem");
-$("#saveItem").click().trigger(event);
-</script>
+ <script>
+ #{include 'Invoices/soldItem.js' /}
+ </script>
#{/set}
+<form action="#/saveItem" method="post" id="itemsTable">
<table class="items Invoice" id="invoiceItemsTable">
<thead>
<tr>
@@ -92,8 +34,8 @@
<tr class="itemNew">
<td>
- *{}<a href="#/saveItem">}*<image id="saveItem" src="/public/images/34aL/shadow/standart/png/24x24/001_06.png" alt="&{'Save'}" title="&{'Save'}" height="16" >*{}</a>}*
- *{}<a href="#/cancelEdits">}*<image id="cancelEdits" src="/public/images/34aL/shadow/standart/png/24x24/001_05.png" alt="&{'Cancel'}" title="&{'Cancel'}" height="16">*{}</a>}*
+ <input type="image" id="saveItem" name="&{'Save'}" title="&{'Save'}" height="16" src="/public/images/34aL/shadow/standart/png/24x24/001_06.png"/>
+ <a href="#/cancelEdits"><image id="cancelEdits" src="/public/images/34aL/shadow/standart/png/24x24/001_05.png" alt="&{'Cancel'}" title="&{'Cancel'}" height="16"></a>
</td>
<td>
@@ -146,3 +88,4 @@
</td>
</tr>
</table>
+</form>
View
10 app/views/Invoices/create.html
@@ -2,11 +2,7 @@
#{set 'title'}
&{'Create Invoice'}
#{/set}
-<div class="entity">
-#{form @Invoices.save(), id:'createForm'}
- #{include 'Invoices/_form.html' /}
- <input type="submit" name="submit" value="&{'Save'}" />
-#{/form}
-</div>
+#{set formAction:@Invoices.update() /}
+#{set formId:'createForm'/}
-<a href="@{Invoices.index}">&{'Cancel'}</a>
+#{include 'Invoices/_form.html' /}
View
10 app/views/Invoices/edit.html
@@ -3,11 +3,7 @@
&{'Edit Invoice'}
#{/set}
-<div class="entity">
-#{form @Invoices.update(), id:'createForm'}
- #{include 'Invoices/_form.html' /}
- <input type="submit" name="submit" value="&{'Save'}" />
-#{/form}
-</div>
+#{set formAction:@Invoices.update() /}
+#{set formId:'editForm'/}
-<a href="@{Invoices.index}">&{'Cancel'}</a>
+#{include 'Invoices/_form.html' /}
View
76 app/views/Invoices/saveItem.html
@@ -1,75 +1 @@
-<table class="items Invoice" id="invoiceItemsTable">
- <thead>
- <tr>
- <th><!-- actions --></th>
- <th>&{'invoice.item.description'}</th>
- <th>&{'invoice.item.price'}</th>
- <th>&{'invoice.item.rebate'}</th>
- <th>&{'invoice.item.quantity'}</th>
- <th>&{'invoice.item.netTotal'}</th>
- <th>&{'invoice.item.vatRate'}</th>
- <th>&{'invoice.item.grandTotal'}</th>
- <th>&{'invoice.item.notes'}</th>
- </tr>
- </thead>
-
- #{list items:entity?.items, as:'item'}
- #{include 'Invoices/_itemRow.html' /}
- #{/list}
-
- <tr class="itemNew">
- <td>
- <a href="#/saveItem"><image src="/public/images/34aL/shadow/standart/png/24x24/001_06.png" alt="&{'Save'}" title="&{'Save'}" height="16" >
- <a href="#/cancelEdits"><image src="/public/images/34aL/shadow/standart/png/24x24/001_05.png" alt="&{'Cancel'}" title="&{'Cancel'}" height="16"></a>
- </td>
-
- <td>
- <div class="item">
- <input class="itemDesc" type="text" size="30" name="item.item.name" placeholder="&{'invoice.item.name'}" />
- </div>
- <div class="item">
- <textarea class="itemDesc" rows="2" cols="30" name="item.item.description" placeholder="&{'invoice.item.description'}" ></textarea>
- </div>
- </td>
-
- <td>
- <div class="item">
- <input type="text" size="10" name="item.item.price" placeholder="&{'invoice.item.price'}" />
- </div>
- </td>
-
- <td>
- <div class="item">
- <input type="text" size="4" name="item.rebate" placeholder="&{'invoice.item.rebate'}" />
- </div>
- </td>
-
- <td>
- <div class="item">
- <input type="text" size="7" name="item.quantity" placeholder="&{'invoice.item.quantity'}" />
- </div>
- </td>
-
- <td>
- <div class="item" id="newItemNet">
- </div>
- </td>
-
- <td>
- <div class="item">
- <input type="text" size="4" name="item.vatRate" placeholder="&{'invoice.item.vatRate'}" />
- </div>
- </td>
-
- <td>
- <div class="item" id="newItemGross">
- </div>
- </td>
-
- <td>
- <div class="item">
- <input type="text" name="item.notes" placeholder="&{'invoice.item.notes'}"/>
- </div>
- </td>
- </tr>
-</table>
+#{extends 'Invoices/_itemsTable.html' /}
View
10 public/javascripts/Invoices/soldItem.js → app/views/Invoices/soldItem.js
@@ -10,7 +10,7 @@
this.get('#/saveItem', function (context) {
context.log('saveItem');
form_fields = this.params;
- var action = #{jsAction @saveItem(':item')};
+ var action = #{jsAction @saveItem(':item') /};
this.partial(action({item: form_fields}));
});
@@ -23,3 +23,11 @@
app.run('#/');
});
})(jQuery);
+
+var event = jQuery.Event("saveItem");
+$("#saveItem").click(function(e) {
+ //e.stopImmediatePropagation();
+ this.trigger(event);
+ log('clicked');
+ //return false;
+});
Please sign in to comment.
Something went wrong with that request. Please try again.