Thursday, February 21, 2013

Couchdb part 3, the script

Today we will look at the script.I will put these files on the web somewhere and link at the bottom of this page.

Start a file named recordedit.js
Here is the top of it

This is what is happening in the first 28 lines

line 1 connect to the database named courses
lines 2-28 is a function called update courses.

div #courses is emptied
and the view named byname is called, this was built in the last episode. The file will be attached below.
We then have some data, the function itterates through the rows of data, looking for the client name and title.  If there is no data, as there will be the first time this is run, nothing will happen. But with data, we will get a line with the client name and course name. This is followed by links to Edit the course or Remove the course. The remove the course will show up on line 179 of the script and the edit will start on 211, but we have a bit more to do until then.

The next step will build the dataform, it will be blank if the new course from the html page is clicked or populated if the update course button is clicked above.

the setup for this

lines 30-40 are the naming of the form, then we build the form. line 40 says the form will be a table. Then we write some repdative code for each line of data we want.
Looking at lines 44-48, we make the form with the first cell having the text Client, the second cell is the input form for the id client. Line 47 looks odd at first, but what it is asking is if we are editing, then fill in the form with the data from the document we are editing. then we close the line of the table, and so on. This is where you are building  your JSON object, name these what you want, you can change the names later, this form has many lines....
Find all of the lines attached... but

here is the bottom of the table and the submit function.

Now we will either append the JSON file or build a new file. The lines starting in 144 just take the data from the form and put them into the doc. These match up with the form lines in the previous section. This is where errors can occur, make sure the input names match in both sections!

lines 160 and 161 are the last of the building of the doc lines. 161 will be used later as things get more complex, but it shows you can throw anything in there if you wish to help identify the data.
163 and 164 we finish up with the making the document.

166 starts the fun things that happen after the page is loaded--hence the document ready function.
From before, remember that the data has an Edit button and a Remove button next to it. The add new was part of the index file, so within the div # courses, we can either edit or remove. The clicking of one of these will start the events on 170. It takes the document id on 174 and gets ready to do something. If edit is chosen, it opens the document and populates it up in line 30.
181 starts the delete function, if Remove Course is chosen. By the way this was made in lines 20-23.

When delete is called, it gives a chance to cancel the command. Always a good idea. The user is given the option of Delete or Cancel. If cancel is chosen, line 203 happens and we go back to where we were. If delete is chosen, line 190 is called and the database removes the document with the id chosen earlier.

now the end..
Here we add to the database. in 217 it is checking to see if the document has an id, if it does, then we just rewrite the document in the database, then clear the update form. Otherwise, if there is no id, that is it is a new set of data, the database will assign it an id.
then back to where it was.

When making this version, I realized if I wanted the system to be really searchable, some pulldown menus would need to be created, to keep the data uniform.

So, you have a workable form now. Next steps will be to improve the form with pulldowns. And the pulldowns will be populated from the database!!

Link to documents

No comments: