Products

Solutions

Resources

Partners

Community

Blog

About

QA

Ideas Test

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Add watermark text or image to search text boxAdd watermark text or image to search text box
Previous
 
Next
New Post
2/22/2009 11:49 PM
 

Is this possible to do with the DNN search control?

Thanks,

Jay

 
New Post
2/23/2009 12:05 AM
 

If you're using DNN 5, you can use jQuery (suggested):  http://plugins.jquery.com/project/Watermark

If not, or if you want more overhead, use the AJAX Extenders:  http://msdn.microsoft.com/en-us/library/bb470384.aspx

An example of implementing the watermark can be found here:  http://msdn.microsoft.com/en-us/magazine/cc135984.aspx


Will Strohl

Upendo Ventures Upendo Ventures
DNN experts since 2003
Official provider of the Hotcakes Commerce Cloud and SLA support
 
New Post
3/3/2010 10:35 AM
 

I'd like to add a jquery watermark/hint text but I'm not sure of how to add the watermark property to the input html element (id=dnn_dnnSEARCH_txtSearch) of the DNN search module (DNN5.1.1).

What's the best way to accomplish this?

 
New Post
3/3/2010 10:59 AM
 

The first thin you need to do is include the watermark plugin.  There are a variety of ways to do this.  I have blogged about how to do this using PageBlaster, and my own (free) Content Injector module.  You would just replace the jQuery script itself for the jQuery plugin you're trying to use.  Alternatively, you might even find luck doing this in the Page Settings, though I have never tried.

Anyhow...

Once you find the plugin you're trying to use, it will have documentation on how to use it.  For example, the most simple implementation would ask you to call a "watermark" method on the DOM elements in question.  Using your example ID, here is how this might work:

<script language="javascript" type="text/javascript">
     jQuery('#dnn_dnnSEARCH_txtSearch').watermark();
</script>

Keeping the last example in mind, you would likely need to pass in the watermark text to use as well, so that example would probably be better written as this:

<script language="javascript" type="text/javascript">
     
jQuery('#dnn_dnnSEARCH_txtSearch').watermark('Enter Your Search Terms Here');
</script>

Either way, this script would need to be added to the page too.  This can be accomplished the same ways that I suggested above.  Remember to read the documentation for the plugin.  It literally tells you everything that you need to know.


Will Strohl

Upendo Ventures Upendo Ventures
DNN experts since 2003
Official provider of the Hotcakes Commerce Cloud and SLA support
 
New Post
12/5/2011 11:52 AM
 
That jquery plugins site is down.  IS this code anywhere else?  I'd like to use it.
 
Previous
 
Next
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Add watermark text or image to search text boxAdd watermark text or image to search text box


These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

  1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
  2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
  3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
  4. No Flaming or Trolling.
  5. No Profanity, Racism, or Prejudice.
  6. Site Moderators have the final word on approving / removing a thread or post or comment.
  7. English language posting only, please.
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out