Author - Web Developer - Educator
Found 3 results for tag "tracker"
RSS Feed

It just had to be Monday


Last night was fun for me, especially since I was on a roll with the .fadeIn()/.fadeOut() jQuery functions, along with a few animated sequences that I'm proud of. However, I was also working on making the .remove() function working as well with the "parent of the parent" issue. Luckily, I got that resolved.

However, I was up till about 4am last night working on the form builder, and I'm glad to see how far I am, but I regret staying up till 4. Keat had class this morning at 9:30, which meant that we had to get up at 8-ish. Knowing me, I usually kill the alarm and go back to bed till the last possible moment. And it doesn't help that Winter is unofficially here and it felt good to be under the nice warm covers and soft pillows. I wanted to call it a "sick day" if I could, but I knew that stuff had to be done and other requirements needed my attention, so cancel the "sick day" idea. How I desperately wanted to go back to sleep........

While Keat had class issues and presentation due at 7:30pm, I used the majority of the day fixing the data submission feature of the form, along with catching up on Eureka. I finished up Season 2, proceed to Season 3 3.5, and finished watching Ep. 7 earlier this evening, but let me back up a bit.

Since jQuery is still kinda new to me, I decided to study up on the form submission process, along with the AJAX background structure. I still prefer server-side coding to client-side, but getting to play around with a new, exciting language is just fun!

I found out about the .ajax() feature, and experimented with a lot of the .ajax() features, but the ones that interested me the most for this task were .submit(), .serialize(), and .serializeArray(), all of which come with their own pros and cons.

It turns out that I had to submit information via jQuery .ajax() method and send it in POST format, which was the idea until I saw that the original data stream for the tutorial was only in GET format (example: page.php?id=3&sel=Hi&p=4q), so I researched and found out that I could switch out the .submit() and .serialize() functions for .serializeArray(), which submitted the information in their original Array format instead of a serialized string (GET). Afterwards, I had to write a function that sorted through all of the fields (which were all arrays) and set up the database form structure based on the array placement, type, and name (along with maintaining the tableDnD library to allow the rows to be moved dynamically). Overall, it was quite a challenge, but I believe that Milestone 4 is 90% complete.

That brings me to about 7pm. Keat had to leave for class, and I thought about another sub-feature: What if the person designing the form needs to make a form go in-active, or they need to take it offline for a while to make some corrections? That's when I thought about adding a "Active" boolean variable to make forms active or not. And what better way to allow for this option (along with showing it off) than the iButton jQuery plugin! Most people see this on mobile versions of WordPress pages, but I found a custom library from Giva Labs which allows for custom iButtons side from the default On/Off.

Maybe a little show-y, but I like to test new features I learn.
Business Accelerator Progress - Form Builder:

Tags:#jquery #eureka #netflix #ajax #miletsone #ibutton #garfield #tracker

RSS Feed

Milestone 3: Complete!

YAY! I've successfully completed Milestone 3 of the Accelerator. It was a bit of a challenge, since I'm still learning jQuery, but I accept challenges for coding - especially when using a language that I barely know anything about and am willing to learn. Just to recap: M3 was to successfully remove a dynamically inserted row. Using a combination of .empty() .remove(), .parent(), and .live(), I was able to successfully remove dyanmicaly inserted rows using the .append() function and the tableDnD library.
$('.remove_box').live('click', function() { 
    /* get parent (td), then parent again (tr), and empty the tr */ 
Edit: 2010-11-14 20:12:35 .empty() was replaced by .remove() since the latter keeps the tableDnD library in place and requires the DOM features to be kept for the move features Now on to Milestone 4: field submission with database structure building rules - let's see how that goes....
Business Accelerator Progress - Form Builder: 60%

Tags:#milestone #accelerator #jquery #tracker #tutorials

RSS Feed

2 down, 3 to go!

I'm so excited about this, I have to talk about it!

The Business Accelerator I've been working on just passed it's 2nd major milestone! For the form builder, I wanted to merge the Field Adder (click "Add Field", a new text field is added to the form without erasing the current info) with the Row Mover (the "Netflix Queue" effect). In my mind, it worked perfectly. In real life, it was a pain to get to. But now that I made it, I'm excited!

Milestone 1 was getting the Field Adder put in place and tested. It worked right out of the box.

Milestone 2 was adding the Row Mover. After much testing, Milestone 1 had to be re-worked from scratch. After much testing and many, many edited pages, the Row Mover worked (many thanks to for the jQuery field adder and for the drag-and-drop jQuery feature). As of today: M2 has been reached and passed!

Milestone 3 will be for field deletion without messing up the current field structure. Should be easy (I hope)

Milestone 4 will be for field submission with database structure building rules (basically: taking the data and putting it in the database to be re-constructed as a form on the fly)

Milestone 5 will be testing the database insertion to make sure the form is built correctly.

Can't wait to get back in the code!
Business Accelerator Progress - Form Builder:

Tags:#jquery #netflix #milestone #accelerator #tracker