Add watermark for input fields

rss

Posted by AaronBets - Nov 17 ’12 at 12:26

Hello,

I found it is possible to hide title of field on the form using Forms Designer, I like it. I want to hide it and add watermarks for each input, wehere will be displayed some guide text. Do you have any plans to add this functionality to Forms Designer?

  • Anthony (Support)
    Anthony (Support)
    Moderator
    Member for: 10 years 10 months 13 days
    #1 by Anthony (Support) Nov 18 ’12 at 01:37

    Hi, AaronBets.

    You can use jQuery watermark plugin to implement this functionality.

    Just upload jQuery watermark script file to SharePoint library for example Styles Library or put in Layouts folder.

    Then use JavaScript windows, accessible from SharePoint Forms Designer ribbon to put there some code, see details below.

    In JavaScript windows add following code:

    //add jQuery watermark script to page

    var s = document.createElement("script");

    s.type = "text/javascript";

    s.src = "/Style Library/jQuery/jquery.watermark.min.js";

    $("head").append(s);

    //Apply watermark for Name field

    $(fd.field('Name').control().el()).watermark('Required information');

     

     

     

    As you can see, the first part is adding jQuery watermark script to page, second part is applying watermark for Name field. Just replace it with your field name, or use it multiple times for few fields.

    link flag
  • stieland
    Member
    Member for: 10 years 3 months 10 days
    #2 by stieland Jun 14 ’13 at 01:35

    I'm trying to get this to work and when I can't get past adding the js file.

    When I have the following line in, it throws an unknow javascript error.

    $("head").append(s);

     

    Would this be different with SharePoint 2013?

    link flag
  • Dmitry
    Dmitry
    Admin
    Member for: 11 years 3 months 13 days
    #3 by Dmitry Jun 14 ’13 at 02:31

    [#2]: In new versions of Forms Designer we include jquery-library in compatibility mode. So, if don't use your own jquery-library and wish to include dynamically additional jquery plugins you have to declare jQuery and $ variables global. Also we redesigned our JS-Framework, and the actual code that inserts watermark now looks this way:

    window.$ = $;
window.jQuery = $;

RegisterSod('watermark.js', '/Style Library/jQuery/jquery.watermark.min.js');
LoadSodByKey('watermark.js', null, true);

fd.field('Title').control()._el().find('input').watermark('Required information');

    In this example I add watermark 'Required information' to 'Title' field input

    link flag
  • stieland
    Member
    Member for: 10 years 3 months 10 days
    #4 by stieland Jun 14 ’13 at 02:43

    [#3]: Perfect.  That works great and makes sense.

    link flag
  • Sonoma
    Member
    Member for: 8 years 11 months 29 days
    #5 by Sonoma Nov 19 ’14 at 05:11

    [#4]: I can get this to work as well but...

    I have forms with multiple required fields(sometimes upto 100) I would like to add the water mark to:

    1. set my required fields as normal during the list building
    2. add watermark to all fields using the SPForms -> TITLE -> Value
    3. hide all titles

     

    Is this possible?

     

     

     

    link flag
  • Dmitry Kozlov
    Dmitry Kozlov
    Admin
    Member for: 10 years 1 day
    #6 by Dmitry Kozlov Nov 20 ’14 at 04:11

    [#5]: Yes, it's possible with the help of JavaScript but requires a bit of coding. I'd suggest purchasing 100 support minutes in our store:

    http://spform.com/buy

    And send the detailed requirements to [email protected].

    link flag
  • Sonoma
    Member
    Member for: 8 years 11 months 29 days
    #7 by Sonoma Nov 20 ’14 at 03:24

    [#6]: Thank you. It is something we may consider.

    I am toying around with jscript and getting close.

    link flag
  • wernereegranad75
    Member
    Member for: 2 years 5 months 2 days
    #8 by wernereegranad75 Apr 22 ’21 at 01:41

    Hey Anthony, I just wanted to say thank you for your time and effort on sharing  jQuery watermark plugin download with us. This will be a great way to use watermarks on the photos that I will use on my website. Check out the latest version of this plants vs. zombies game if you are looking for a cool strategy based game that can be both played on PC or mobile. They added a new game mode for every players to try and you can also use the new plants with unique abilities.

     

    free online hide and seek games

    link flag
  • MauriceZaiss
    Member
    Member for: 1 year 4 months 5 days
    #9 by MauriceZaiss May 20 ’22 at 12:46

    Not to say that https://epiccarry.com/eu/buy-wow-arena-rating/ a very difficult game. It just suffers from the excessive clutter of the interface, which is so characteristic of titles. To make your stay in this enchanting world as easy and relaxed as possible, we are launching a series of game guides.

    link flag
  • jonemartin
    Member
    Member for: 1 year 2 months 10 days
    #10 by jonemartin Aug 10 ’22 at 02:21

    In form we can add watermark in our field and enjoy with our form.

     

    We offer Kitchen Remodeling Services in San Antonio TX to you for renovate and install cabinets.

    link flag
Displaying 1 to 10 of 20 messages
Previous12

Related threads