View Full Version : unselect prompt box selected text.

09-26-2012, 02:31 AM
prompt box has two values - text to read and optional pre-display in the input field.

Focus in on the input field and the user commonly just starts typing and the pre-input is lost. Click the URL link box above.

Is there any way to unselect that text - lose focus? - so they have to click to start typing.

I put this in js as I figure that's a likely fix department :o


Old Pedant
09-26-2012, 02:42 AM
Well, the right answer is to stop using prompt( ). It's a terrible way to interact with human beings. It's really only good for testing and debugging and maybe codes in the first 3 weeks of a JavaScript class.

If you indeed use an <input> box, as is that Google search box, then it works as you want: The text is there until the user clicks on the box.

09-26-2012, 03:23 AM
How would you replace the URL input link above this line?
> Please enter the URL of your link
and then the http://

This is exactly the scenario I have.
I can kind of imagine some kind of jquery lightbox thing or some such but this situation (the URL thing) is VERY common and I am sure there are smarter folk than I who would use a better system - input type=text - if it was indeed better.

So, is there a way - as per the link prompt - to unselect that text?

Old Pedant
09-26-2012, 03:58 AM
I'm still not sure what you want.

Okay, with that link prompt, indeed if I just start typing, the http:// goes away.
But if I click in the box, then it stays there and my text is appended.

Now, are you saying that's the behavior you want in an <input>? Or are you saying that you'd like the http:// to stay there *unless* the user clicks? Or...

But in any case, JavaScript has no control over the action of a prompt(). Whatever kind of action you want would have to be done via an <input>.

With an <input>, by default you don't have focus. By default the text is not selected. By default, if you click in the <input> then the cursor goes where you clicked and you start inserting text at that point. With an <input> most of that behavior can be changed however you want it to be via JavaScript. Most.

For one example, look at the google search box near the top of this page (not the reply page).

(By the way, I had never used the INSERT LINK feature of this forum before. I just type them in. So that's one reason I had a hard time figuring out what your meant by "Click the URL link box above." When I'm reading your message, there isn't any "link box above".)

09-26-2012, 10:30 PM
If we work on the URL box above.

How to make it that the http:// is not selected?
And, ideally, the focus (blinking thing) is at the end http://|

So that when the user starts typing they are just adding to the string presented.

I understand onfocus onblur but - perhaps there is no way to do this.
Perhaps, as you say, this is outside of js.

Just one of those irritating little things :D


09-26-2012, 11:34 PM
The simplest way is to move the http:// in front of the <input> and have it as part of the fixed text in the page. You can always have the script actually processing the form add the http:// to the front of the value entered as a part of the field validation before using it.

Old Pedant
09-26-2012, 11:35 PM
Well, I found a way to make it work in MSIE:

<input value="http://" onfocus="this.setSelectionRange(7,7);"/>

7 is the length of "http://" of course.

But I haven't yet found a way in Chrome or FF. There are tons of suggestions (use Google), but none of them do exactly what you want.

Old Pedant
09-26-2012, 11:55 PM
Mozilla docs say it should work:

But no luck.

09-27-2012, 12:08 AM
Yes, I think this might be the best.
I have never dealt with URL validation before but figure there are various regex's out there.

Thanks OP - I will put this in my snippet list.