Paul Galvin's (old) SharePoint space [SharePoint

Just another WordPress.com site

Quick and Easy: Use jQuery to Set A Text Field’s Value on a SharePoint Form

I started playing around with jQuery yesterday.  I’ve been wanting to do this for a long time, ever since Paul Grenier started writing his series about jQuery for End Users at the venerable www.endusersharepoint.com web site.  As I use it, I hope to add a series of “Quick and Easy” posts like this one.  This post describes how to set a known text field’s value to anything you want.

In this scenario, I have created a custom list whose “new” form looks as shown:

This is the new form for a custom list with the default Title column and two list columns (not site columns; I don’t think it should make any difference).

The objective is to assign an arbitrary value to the field, “DefaultMeFieldNoSpaces” (you can tell I’m a bit of a coward with the “no spaces” thing going on, but I do spice it up at the end of this article).

This bit of jQuery worked for me:

<script type="text/javascript">

  $(function() {
 
    $('input[title=DefaultMeFieldNoSpaces]').attr(
        {value: 'You are in a twisty maze of passages, all alike.'});

  });

</script>

 

As I understand it this bit of jQuery is saying, “find me any input tag whose title = DefaultMeFieldNoSpaces.  Then, set all of their values to a famous phrase from an old computer game.”

Since there will only be one field on the form with a title equal to “DefaultMeFieldNoSpaces” we are assured of assigning a value to that field and no other.

What about a field whose name has spaces in it?  It’s nearly the same:

<script type="text/javascript">

  $(function() {
     $('input[title=Assign Field With Space]').attr(
        {value: 'You are in a twisty maze of passages, all alike.'});

  });

</script>

 

I think this is a fairly safe approach, meaning that we should be able to find the field that we want and only the field we want.  If you look at the HTML SharePoint is giving us, it’s sort of messy:

<input
   name="ctl00$m$g_bdb23c2c_fde7_495f_8676_69714a308d8e$ctl00$ctl04$ctl02$ctl00$ctl00$ctl04$ctl00$ctl00$TextField" 
   type="text" 
   maxlength="255"
   id="ctl00_m_g_bdb23c2c_fde7_495f_8676_69714a308d8e_ctl00_ctl04_ctl02_ctl00_ctl00_ctl04_ctl00_ctl00_TextField" 
   title="DefaultMeFieldNoSpaces" 
   class="ms-long" 
/>

“title” stands out as a recognizable and hopefully unique attribute to help us identify the specific column to which we want to assign our arbitrary value.

This is a foundational concept.  Setting a field in an arbitrary way like this isn’t going to win any awards.  However, if we want to do more interesting form level stuff (which all of us always want to do, of course, right after we finish washing the dishes), like change the value of “field b” automatically based on the value of “field a”, we (I) need to learn these things.

I think our best chance to get a real useful value here is via the title, at least for text fields.  There may be a better, more reliable approach.  If I find it, I’ll update this post.  If you know a better way, please leave a comment.</end>

</end>

Subscribe to my blog.

Follow me on Twitter at http://www.twitter.com/pagalvin

About these ads

5 responses to “Quick and Easy: Use jQuery to Set A Text Field’s Value on a SharePoint Form

  1. Unknown June 13, 2009 at 11:39 am

    Paul has a Codeplex project about manipulating SharePoint form fields:http://spff.codeplex.com/

  2. Oskar June 15, 2009 at 9:09 am

    Paul, what\’s your approach for injecting the javascript into the edit page? Doing so in a deployable, simple manner is the tricky bit, as far as I\’m concerned. You really shouldn\’t have to create a custom form each time… I think this, http://spjqueryfield.codeplex.com/ , is a good start. Deploy it once, then reuse as needed…

  3. Paul June 15, 2009 at 7:20 pm

    Oskar, I don\’t have an approach as yet because I have only just started using it to play around. As I begin to use it in a production environment I will definitely write about my experience.Thanks for the link to spjqueryfield.

  4. Paul June 15, 2009 at 7:20 pm

    Christophe, thanks for the link!

  5. Unknown September 30, 2009 at 8:43 am

    Hi Paul – I came across your post whilst researching for a similar problem :-Setting a default duration for new calendar events.http://blog.pentalogic.net/2009/09/setting-default-duration-for-new-calender-events/There is a neat trick about getting the script onto the new form – its not as clever as spjqueryfield or spff but its great for a quick hack.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: