So I have been playing around a lot with how to conveniently connect to a database from the user’s webpage. I want zTinker to be a combination of graphical, tool assisted web design and open access of and monitoring of the actual web code. I also don’t necessarily need my environment to work with any style of web dev and I will propose a certain approach if that is convenient for me. Therefor it is OK for me to offer a certain way of connecting to database and certain formats of what is contained in databases as long as I’m open with what code I use to achieve that.
For the longest of time I have now tried to get java script to work in it’s own editor will providing full access to included libraries and predefined variables. This hasn’t worked too well. At first I took the same approach as with CSS, trying to let the user adjust a certain script on the page while working in a page that already have the needed jquery libraries. I had a problem with the scope of this libraries and variables though, so I tried another approach where I instead created the full page from scratch all the time. This gave me access to all generated libraries, but the variable and function scope became unclear so it didn’t solve the worst problems and there were also update bugs and less neat code. I went back and forth between and tried to combine my new solution with my old one. In the end I went back to the old solution and just started using AJAX.
Something I got working well in the old solution was the possibility to let jquery dynamically change elements given that the user gave them certain classes and ids. I used this for the jquery GUI editing of size an position before but now I also added a little trick for database connection. You now give an element a certain class, “contain”, which makes that element into a container for database content. You then give it an id which will be used as a reference to fill it with database content. Everything falls into place as you use a specific database structure in which you give your database content the id from your markup so that it knows where it should be inserted. Works pretty well. :)