Edit Button Without JavaScript
One of my things at the moment is trying to create web applications that use as little JavaScript as possible. While working on v6 of this site I eradicated a lot of it. Why? Accessibility.
Whether or not you see the point it's always nice to know it can be done. More often than not web-based applications demand some JavaScript be used in one form or another.
Yesterday I was adding an edit button to a form. Normally I add the following passthru:
<input type="button" onclick="location.search='?Edit'" />
How can I use a button but no JavaScript though? Using a custom form!
If you look at the source code of this page you'll notice the first and last elements of the <body> are two empty forms. The first one is started by Domino and terminated by me. The last one is started by me and finished off by Domino. The usual Domino form spans the whole of the page, whether it's needed or not. By adding a closing and opening <form> to the first and last line of my Forms in Domino Designer I can get rid of this form. Whether any forms exist on the page is now down to me (Note: Forms can't be nested!). We can now add as many forms as we like and make them do whatever we please.
An example of a form I've created is the search box that appears on this page. View source again and see how that form's built. Simple stuff. No JavaScript, just a simple HTML form.
To create an edit button on a document you might think you simply add:
<form method="get" action="view/docid?EditDocument"> <input type="submit" value="Edit" /> </form>The trouble is that forms using the GET method create their own Query_String, based on the field values of the form (not so with POST). With this form we end up with a URL that doesn't include "EditDocument" and is simply "view/docid?". Domino doesn't like this. So we need to add a field to the form called EditDocument, like so:
<form method="get" action="view/docid?EditDocument"> <input type="text" name="EditDocument" value="1" /> <input type="submit" value="Edit" /> </form>
Pressing the "submit" button results in the URL:
http://server_name/db.nsf/view/docid?EditDocument=1
Domino ignores the "=1" part and takes its command from the first parameter of the Query_String - EditDocument in this case.
There you go then. A fully accessible edit button on a document. It's fun hacking Domino isn't it.
Skip to the 
You can subscribe to an individual
<a href="http://server/path/to/view/doc?EditDocument" style="display:block;width:100px">Edit</a>
No javascript, no start and ending tags crap.
Did you mean to add more style to it and have it look like a button YoGi? Not sure what your styles are aiming for there.
The thing with my solution is that it IS a button. You might be able to fake a Win/IE (per XP) button but there's no way CSS can mimic buttons from all browsers and platforms.
How about a 'Submit' button that can only be clicked once? (i.e. avoiding double-submits)
Can this be done without using JS?
Not AFAIK Tyron.
@Jake : Absolutly. Add a beveled border, a background color, center your content and you've got a wonderful button. Anyway, and for my part, I prefer (real) links instead of buttons. A matter of taste i guess.
@Tyron : <input type="submit" onClick="this.disabled = true ; this.form.submit()">
Check imageshack, they're doing it in a nice way.
@Tyron : To interpret YoGi's answer, you cannot do this without JavaScript.
Oops, sorry. i didn't understood the question.
YoGi. I'm not sure I agree it's a matrer of taste! It should be a matter of convention. I've discussed this in the past - the idea links are *links* and buttons perform "actions". I know you could argue that an action that simply GETs a URL *is* a link, but in the user's mind it's an action. When a user (of any site, not just Domino) wants to submit a form they look for the "submit" button. They don't look for a link. Are you suggesting all buttons become links?
Jake,
I think you're correct. There is a semantic difference between links and actions and this should be reflected in the elements you use to represent them.
The debate you linked to surrounding Google's Web Accelerator also suggests that actions should be using POST rather than GET (see Mark Rowe's comments at {Link} which quote the relevant RFC).
Another hack... it would keep the visual convention of buttons for actions, although breaking the programmatic convention. Put a link around a button that has no action:
<a href="myURL?EditDocument"><input type="button" value="Edit Document"></a>
Use CSS to get rid of the underlined text on the button.
Personally, I do like using text "links" instead of buttons. But end users are used to seeing a button to click for Submit, so I tend to stick with that. For some BB development I've been messing with it's easier to use pass-through HTML for edit/save/etc...
Arka. The use of POST is recommended when the action is destructive or constructive. In this case with the edit button the action is neither. A delete button that used GET and ?DeleteDocument would be a different story!
Jake. I think the phrase that was often used on that discussion thread was "side-effects on the server". I agree that, typically, this wouldn't be the case with editing a document - but it could be.
The point is that it's up to the developer to determine that and choose the appropriate mechanism for that application context. It should be a conscious decision.
P.S. Why are the times on this thread out of whack?
Arka. What side effect on the server? And what's out of whack about the times?
@Arka - the time stamp question has been discussed before. It was an educational one too - try searching Jakes site for it.
@Jake - Prior art: :-)
{Link}
Jerry. Great minds is all.
Yep. It's a naturual conclusion / solution to the problem of Domino in that regard. Per the comments on that link, Alex thought of it before I did.
@Jerry - Thanks, I had a vague recollection this had come up before but I couldn't find the relevant thread. Please enlighten me.
Yeah I thik I agreee with the link v action thoughts you've stated above, Jake.
A 'hyperlink' was designed as a link between 2 hypertext documents, or to put it another way to fetch a hypertext resource (located through the use of a URI) and present it to the user.
Using links for actions goes completely against the grain in this regard.
But I might just be getting old and grumpy :)
Jake - good article.
I am also always interested in minimizing javascript and relying solely on HTML + CSS.
Any ideas on eliminating JS from this ->{Link}
I use "POST" forms with multiple "actions" (choices) alot (such as in your "Process multiple docs" article).
Just a thought!
Tony. Glad you like. What JS do you want to eliminate from that script? The only code there is to set the value of the status field depending on which button was pressed - publish or un-publish. Without JS you would need a radio-button to select your action (publish or un-publish) and one button to process the documents.
@Jake - Sorry, missed your reply.
What's out of whack is the time for my last 3 posts is about 6 hours earlier than I made them.
In view of Jerry's comment I have searched this site for the thread he was referring to, but no luck so far.
Arka. What would be out of whack would be if all post had the local time stamp of the poster. You're in Europe somewhere I guess? Say, you post something at 9:01 your time, then somebody replies from Sydney at 20:05, then London at 8:08 and finally Boston at 3:12. Now THAT is out of whack.
As it is all posts get the local time of the server. This way they are in whack. What time it is doesn't really matter. Time is relative.
Jake. That begs the question: what time zone is your server on? I had assumed that it would be GMT.
P.S. I'm in South East England - but I was educated up North :-)
Arka. GMT-6.
Hmm, that kind of makes sense, doesn't it?
Doh!
Found it at last {Link}
h i
i want that suppose i have on form that's name is form1 and another name is
form2 .i have one textbox on form1.then i want to fetch the this text value on form2 in java script
please help me to solve this problem