[development] Form API and Javascript stuck
Karyn Cassio
karyn at karyncassio.com
Mon Feb 22 00:43:24 UTC 2010
Alrighty, now I'm home and actually looking at the code surrounded by
books.
I assume the code below (with modifications of course) should be
replacing my javaScript code.
However, I'm not sure how I call this from my form.
I was calling the javascript with an onchange attribute of a textfield.
(BTW, all Earl's assumptions below were exactly correct.)
The name of my module is compute_items. This is how I stated the jquery
function.
Drupal.behaviors.compute_items = function() {
//code stuff
}
Is that the right direction?
Karyn
On 2/21/10 2:22 PM, Earl Miles wrote:
> Karyn Cassio wrote:
>> Hi Everyone,
>>
>> I hope you are enjoying your weekend and not working too hard.
>>
>> I'm still trying to get my head around js, and was hoping someone may
>> have some insights to help me with the next steps on a form I am
>> creating.
>>
>> I have an order form that is going to be dynamically created.
>> I am able to successfully pass the quantity value upon user input for
>> field 1.
>> Basically I'm using onchange() to pass the quantity value to the script.
>> The id of the price field is of the format unit-price-0,
>> unit-price-1, etc.
>> Each line item's subtotal should update before going onto the next
>> line item.
>>
>> Here's the js function. Each line item has its own unit-cost,
>> quantity, and subtotal.
>> Any help would be so appreciated.
>
> Let's assume that you've set up the ids so that they all match:
>
> 1) Each line item has a unique, probably numeric id.
> 2) The id of all the form fields for each line item is carefully
> crafted such that the quantity will be "edit-quantity-ID", the
> price will be "edit-price-ID" and the subtotal will be
> "edit-subtotal-ID"
> 3) The quantity is a textfield. The price is either a disabled textfield
> so that the user cannot change it, or a hidden field. The subtotal
> is similar.
> 4) Each line item quantity has this class: 'line-item-quantity'.
>
> You would then create a .js file using this code. Note that I am using
> jQuery to create simpler code, so if you're not familiar with jQuery
> it may not be immediately understandable, but it would be very
> valuable to learn some as use of jQuery significantly increases
> javascript productivity.
>
> For example's sake I am butchering the calculation to be as simple as
> possible. Judging from your code it needs to be a touch more complex
> than this, but you can handle that I am sure.
> ----
>
> // You would put this inside a Drupal behavior:
> Drupal.behaviors.myBehaviorFunction = function() {
> $('.line-item-quantity:not(.line-item-processed)')
> .addClass('line-item-processed') // Ensures we do only process once
> .change(function() {
> // The id of this should be edit-quantity-ID so we use replace
> // to get the base id:
> var id = $(this).attr('id').replace('edit-quantity-', '');
> var price = $('edit-price-' + id).val();
>
> var subTotal = id * price; // Do your actual calculation here.
>
> $('edit-subtotal-' + id).val(subTotal);
> });
> };
--
Karyn Cassio
Drupal Developer
303-981-4161
More information about the development
mailing list