[Seaside] Re: Grid like entry with autosave
Sanjay Minni
sm at planage.com
Sun Jan 11 07:46:40 UTC 2015
Hi
as of now I am putting a quick solution using simple forms
I have put an anchor with callback to del each line and an anchor at and to
add a line (and a new row is displayed and the anchor goes below that)
however the del and and add anchor do not save any changes that have been
done
Ques: - how can I implicitly save the form in the delete and add links
before proceeding to the action
regards
Sanjay
Sanjay Minni wrote
> Thanks Johan,
>
> let me digest this ... My focus was input fields
>
> - Date input if possible templated as 'dd/mm/yyyy' (a picker only to popup
> when the field is in focus)
> - an amount input field as 999,999,999.00 right justified
> (in India we also have 99,99,999.00) and in some countries / currencies /
> inventory quantities etc 3 digits after the decimal is required and should
> stop at that i.e. no inputs on overflow
>
> regards
> Sanjay
> Johan Brichau-2 wrote
>> Hi Sanjay,
>>
>> Mind that a Seaside brush only determines the html element that gets
>> rendered. If you want to render a date, there is no html element that is
>> ‘best’ to use (and hence no brush that is best to use).
>> Most of the time, a date will be rendered as text, but possibly you want
>> to render some more markup to allow styling via css (i.e. adding css
>> classes). If you want to render the date in an input field, mind that
>> html5 does define a ‘date’ type, but the state of the implementation in
>> current browsers is limited [1].
>>
>> A word of advice: if you manipulate financial data, do not use Floats but
>> Fractions (or ScaledDecimal). Even if the customer says it should not be
>> that precise, do not use Floats.
>>
>> If you want to get going, try to render all textInputs in the table.
>> Next, use jQuery and add the serialization of the text input field on
>> change:
>>
>> html textInput
>> onChange: (html jQuery this serializeThis);
>> callback: [:val | … ];
>> with: value
>>
>> Set anchors for adding lines, removing lines, etc..
>> This will give you a functional page.
>>
>> Now, once the table becomes large or you want snappier client-side
>> behaviour, you will need to step into more javascript and ajax for adding
>> lines, removing lines.
>> Eventually, you will need to use event delegation rather than add a
>> change script to every text input (because the page will become too
>> large).
>>
>> Just go in steps. Iterate and learn new things.
>>
>> Hope this helps
>> Johan
>>
>> [1] http://caniuse.com/#search=date
>>
>>
>>> On 08 Jan 2015, at 18:06, Sanjay Minni <
>> sm@
>> > wrote:
>>>
>>> I have some basic questions while trying to code for a UI below
>>>
>>> html table: [
>>> self transactions dataLines do: [ :tr |
>>> html tableRow: [
>>> html tableData:
>> <code here for date>
>>> html tableData:
>> <code here for receipt / payout indicator >
>>> html tableData: [
>>> html textInput value: [:value | tr amount: value]; with: tr amount.
>>> ].
>>> html tableData: [
>>> html anchor callback: [ self removeTransaction: tr ]; with:
>>> 'delete'.
>>> ].
>>> ].
>>> ].
>>> ].
>>>
>>> Questions given the display will be as per below :
>>> 1. which is the best brush to use for date in this case
>>> 2. which brush to use for amount - this is financial amount usually 2 or
>>> 3
>>> decimals, right justified and the digits are comma ',' separated and
>>> should
>>> I use a float in the model (Using Pharo 4)
>>> 3. what is the usual method to get empty lines below - else I will have
>>> to
>>> code for an 'add' button
>>> 4. most important - ... so far ... this is not part of a form - what
>>> brushes
>>> / tags should I use if the parent will be a form (there will be other
>>> parts
>>> in the screen above, below and aside the part below
>>>
>>> thanks
>>> Sanjay
>>>
>>>
>>>
>>>
>>>
>>>
>>> Sanjay Minni wrote
>>>> Hi,
>>>>
>>>> I want to make a grid like entry widget on a collection with auto save
>>>> (say like excel / google sheets behaves). pls advice on how to go about
>>>> the UI. I looked as the examples - Forms where to add / delete a
>>>> separate
>>>> sub screen comes on - that is not what I am looking for.
>>>>
>>>> Simply put it has a date, a symbol / text and an amount
>>>> i should be able to edit inline, keep adding at end, or delete a link /
>>>> button at end of each line
>>> <http://forum.world.st/file/n4798280/GridScreenMockup.jpg>
>>>>
>>>> thanks
>>>> Sanjay
>>>
>>>
>>>
>>>
>>>
>>> -----
>>> ---
>>> Regards, Sanjay
>>> --
>>> View this message in context:
>>> http://forum.world.st/Grid-like-entry-with-autosave-tp4798280p4798406.html
>>> <http://forum.world.st/Grid-like-entry-with-autosave-tp4798280p4798406.html>
>>> Sent from the Seaside General mailing list archive at Nabble.com
>>> <http://nabble.com/>.
>>> _______________________________________________
>>> seaside mailing list
>>>
>> seaside at .squeakfoundation
>> <mailto:
>> seaside at .squeakfoundation
>> >
>>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>>> <http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside>
>>
>> _______________________________________________
>> seaside mailing list
>> seaside at .squeakfoundation
>> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
-----
---
Regards, Sanjay
--
View this message in context: http://forum.world.st/Grid-like-entry-with-autosave-tp4798280p4798844.html
Sent from the Seaside General mailing list archive at Nabble.com.
More information about the seaside
mailing list