Member Avatar for jQuery

hi i made a tutorial for appearing default text in text fields

[snipped blog promotion]

Edited by Ezzaral because: n/a
  • 4 Contributors
  • 7 Replies
  • 164 Views
  • 17 Hours Discussion Span
  • Latest Post Latest Post by Ezzaral

Recommended Answers

All 7 Replies

Member Avatar for stbuchok

This way is easier, no jQuery required. ;)

<html>

<head>

</head>

<body>

<form>
Email: <input type="text" id="txtEmail" value="default@email.com" />

</form>

</body>

</html>
Member Avatar for jQuery

this way is totally wrong

1.Because you given value to the field not the default text.

2. default text is about to appear as for the ease for the user and when they click on the field that text disappear while what you did you just given a value to the field.look at the link above and you will experience that what is it about

Member Avatar for Taywin

I understand that JQuery is a nice library. Though I could use pure JavaScript to do the same job even though it would be longer due to JQuery hides most of the code for you.

However, it seems that your code has a flaw. What do you think if I am not using an updated browser and enter only white spaces in the field? One should not assume that all users have the same computer knowledge...

Member Avatar for stbuchok

OK, um ... guess you didn't realize I was just making a joke, but that's fine.

You can improve your tutorial by setting a custom attribute on the input in order to make it so that you don't need to define a variable for default values.

<html>

<head>

<script src="jquery-1.6.4.min.js"></script>


<script>

$(function(){
	$('#txtEmail').val($('#txtEmail').attr('data-default'));

	$('#txtEmail').focus(function(){
		if($(this).val() === $(this).attr('data-default')){
			$(this).val('');
		}
	}).blur(function(){
		if($(this).val().length === 0){
			$(this).val($(this).attr('data-default'));
		}
	});
});

</script>

</head>

<body>

<input type="text" id="txtEmail" data-default="email@address.com" />

</body>

</html>
Member Avatar for jQuery

this is a tutorial for having default text and if i have used some short path its all for the sake of tutorial guys..all you need to known is how we can apply the defalut text specially this tutorial for type email to them and dont think it has any flaw regarding the code

Member Avatar for Taywin

Hmm... So you don't have a though of older version of a browser that does not accept HTML5? The purpose of your script is supposed to "redisplay" the text if the field is empty. However, if the type of "email" does not apply because it is not HTML5 and a user enter 1 space, it would look empty and by pass your check. If you are giving a tutorial, it is fine. However, you need to explain what your tutorial does not offer or those who want to learn need to look for in the future.

commented: irritating -1
commented: No reason for negative rep on this post. +15
Member Avatar for Ezzaral

@jQuery: The forums aren't here for you to promote your blog posts.

Thread closed.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.