Whenever I need any sort of help in designing web form or css or even need to bring something hybrid, I do follow following useful articles . Hope these will helpful to others too.
1- CSS-Based Forms: Modern Solutions
2- Top 10 CSS Table Designs
3- 10 Useful Techniques To Improve Your User Interface Designs
4- 170+ Expert Ideas From World’s Leading Developers
5- AJAX, DHTML and JavaScript Libraries
6- 80+ AJAX-Solutions For Professional Coding
7- Pagination Gallery: Examples And Good Practices
8- Data Grids with AJAX, DHTML and JavaScript
9- 53 CSS-Techniques You Couldn’t Live Without
10- 75 (Really) Useful JavaScript Techniques
Few months back I was working in SharePoint designer and noticed it provides plenty of tools and easy way to deal with your web page structure,JS, CSS and other DOM models . You can easily identify which styles are applied, which are overridden and even structure of your inline styles. I must say people with no experience on web can develop web pages using SharePoint designer :-) . On the other hand when we do web development in Lotus Notes ( prior to R8.5 release ), I must say most of the developers either write CSS/JS in some web editor (I prefer EditPlus) or copy from some cool website using URL manipulation. I do most of the time :). Recently I had found free web tool which is quite cool as more or less like SharePoint. It's called Firebug , which can be used as a add-ons with Mozilla.You can just download it and open any website in Mozilla and go to Tools->Firebug and Choose options.
What can you do with Firebug ?
1- You can inspect HTML of the page. Shown below ,
2- You can inspect CSS or even can steal CSS from any site without doing any URL manipulation :)
3- Inspect JS files
4- Find out which styles are overridden , DOM structure and even layout
It makes my web development really easy without distracting much towards Microsoft tool ;-). Just visit Firebug and see what more you can do with it.
Today I encountered something interesting, It was small but yet to gave me some challenge. In one of the web form we have Dojo text area. What we found while testing if user copy-paste some contents from MS word/excel contents get truncated or even impossible to read.Something like,
But if you just close and re-open the document , everything looks perfect. here it is,
Now what could be easy to implement solution without doing much changes from ground. What I thought lets create one button next to the existing "text Area" field say "click to paste". It will open a dialog box with another "text area" field which will allow to write or paste the contents from various sources.Once done you can click OK and dialog box's contents moved to the original text area which is in read only mode.It could be much simpler if you have just a text field or something to pass via Query String. After little mind-boggling I was able to fix this. Here are the logic.
Lets assume my original text area field name is "Body_1". So, Following code is implemented on "Click to Paste" button (which is mentioned on the top) ,
var childWin;
var pData
childWin=null;
if ( document.getElementById('Body_1').value != "" ) {
childWin=window.open('server/db/form?OpenForm','popup','status=0,toolbar=0,scrollbars=0,resizable=0,width=500,height=145,top=500,left=550')
}
else {
window.open('server/db/form?OpenForm','popup','status=0,toolbar=0,scrollbars=0,resizable=0,width=500,height=145,top=500,left=550')
}
Next, Lets assume our dialog box's field name is "Body". Here is the code which is written on "onLoad" event of the dialog box to retrieve parent's value ,
document.getElementById("Body").value = window.opener.document.getElementById("Body_1").value
At the end here is the code which will set Child form's field contents to parent ,
var pData= document.forms[0].Body.value
window.opener.document.getElementById('Body_1').value= pData
window.close();
window.opener.document.getElementById("btnPaste").value="Click to Edit"
Lets see all steps in image ,
Step 1- When form loads ,
Step 2 - Clicked on "Click to paste" to paste the contents ,
step 3 - Last step to edit the text again ,
Simple and easy to use , right :)
Few days back I had requirement to build dynamic DHTML menu based on the user's personal configuration document. Initially I thought to build everything in JS to avoid any mess up.But after getting the final specs I found , I need to build the menu based on the existing menu which is on flash.Funny thing was I don't have any knowledge about "Flash", moreover existing flash menu was horrible than my expectation.However it was quite good to see something new which I have never done. I had started looking the whole menu structure in and out and able to understand what actually they have done.Anyways, It's quite complex to explain flash menu stuffs in notes, probably will write separate blog for that. Come to the point , How @For had spoiled my few hours :-)
After getting the logic I had decided to build menu using HTML LIST tag and apply mouseover effect so that it gives button kinda effect when menu generates .In few hours I finished the menu part which was getting generated quite well on the image which was actually the company logo(theme).
Now my next step was to create LIST tag in loop, something like
LIST START
For (i =1 ; i <@length(menu_title) ; i++)
[]
LIST END
Since I was retrieving logged in user's configuration contents using @formula so I thought lets try formula to build the menu. I had created three fields , one to build menu contents (something like menu_title^menu_url) , second to keep only menu title and third to keep only menu url.See the snippet,
I was confident enough to wrap up in few minutes. Next I have designed the skeleton for my menu on the form and applied css and other logic to build the menu.Here was the final design,
I put following formula for Computed Value
Saved the form and boom... When I checked the output on web, found printed "1"..
I felt really strange what I have done wrong ..Checked the code so many times but didn't find anything wrong in the code. Thanks to "Kerr" (one of the member from Lotus Site) help me to find out what silly I have done in my code.. I just forgot or missed to save the tag information in temp variable.. It should be something like ,
You know what when I checked the help file it was mentioned in one of the example , but I just missed the point :(
Hope next time me or anyone who read this will not forget which I did :)
What could be the more efficient and easy way to trace your errors in Lotus script? We often use following statements to do error handling in lotus script,
This gives following results if error occurs,
But we can use better and more descriptive way to do error handling, something like,
This gives following results if error occurs,
You can find the difference.But don't forget to include "%INCLUDE "lsconst.lss"".
Even you can do more if you play around with following table ,
Pass any of the LSI_ constants from the table below to GetThreadInfo to have it return the current value of that constant.