What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to focus a field everytime the page loads

    Asked by ssmediator on July 22, 2013 at 09:31 PM

    I saw the  instructions, shown below, about how to have the cursor show itself on forms.  Can this be done with Jotform forms?  If so, how? 

    (I tried to do it myself, with this, but it wasn't working--probably because I wasn't doing it right. I input it on my website's form gadget and on my Jotform's Inject Custom CSS)
    <body onLoad="self.focus();document.Clone 2 of Contact Me Form-Website.text.focus()"><form name="Clone 2 of Contact Me Form-Website"><input type="text" name="input_3">


    Where I found the following:
    http://www.boogiejack.com/form_trick1.html

    Their instructions:
    To have the cursor in a specific form field when the page loads, a JavaScript command is placed in the body tag:

    <body onLoad="self.focus();document.boogie.jack.focus()">

    That tells the browser an event should happen when the page loads. The event, in this case, is focus. Since it's a text box we're later specifying the focus to be . . . um, focused on, the focus takes the form of the cursor being placed in the text box.

    Where the JavaScript says "boogie" is where you'd type the name of your form, and you'd add that name to your form like this:

    <form name="boogie">

    Where the JavaScript says "jack" is where you'd type the name of the form element you want the cursor to be placed in, then add that name to your text input code.

    <input type="text" name="jack">

    That tells the browser which element of the form the event should be placed in. You can name "boogie" and "jack" anything you like, just so the names you use in the body tag and form tag are the same and don't contain any special characters or words reserved for JavaScript.

    JotForm Inject Custom CSS style name
  • Profile Image
    JotForm Support

    Answered by EltonCris on July 23, 2013 at 12:37 AM

    Hi,

    Sorry but that's not doable in the form builder. We do not support javascript injection on forms. The best way to achieve that is to take your form source code and apply this code at the bottom part of the entire form source code.

    <script>

    document.observe("dom:loaded", function() {

      $('input_3').focus();

    });

    </script>

    Make sure to replace input_3 with the field ID that you'd want to focus everytime the page is loaded.

    Example: https://shots.jotform.com/elton/focus_field.html

    Let us know if you have difficulties applying this workaround. Thanks!

  • Profile Image

    Answered by ssmediator on July 23, 2013 at 04:08 AM

    Thank you for your reply, but I never know what to do with a source code! 

    I understand, of course, how to copy the code; that's the easy part.  I just do not know where to paste it?
    I pasted it in the gadget box of the form on my website, but that wasn't right.
    I pasted it in the HTML box of my website, but that wasn't right.
    I pasted it in the Jotform Inject Custom CSS box, but that wasn't right.
    I do know know where else I could paste it.

    Oh well.  The only place I can see the focused cursor in my form is on the Test HTML box here: http://www.jmarshall.com/easy/html/testbed.html  --  I pasted the code there, clicked on "Display", and there's my form.

    It's not a big deal; I just thought that I would add a focused cursor; but I see it's not possible.  Maybe next time.

  • Profile Image

    Answered by sidharth_kch on July 23, 2013 at 05:05 AM

    @ssmediator

    Please let us know your formID on which you want to implement this functionality. We will download your form's source code and implement the required changes.

    FYI, you will have to host this form yourself as the updated source code cannot be upload back to JotForm.

    Thanks,

    Sidharth

  • Profile Image

    Answered by ssmediator on July 23, 2013 at 03:05 PM

    "you will have to host this form yourself" - I don't know how to "host" a form.  (I do know how to host a party, though :D )

    Anyway, never mind; I use Google sites, so I do not own the website; that is why I never know what to do with a source code---I can only paste copied text (like the text of a source code) to a limited number of places.

    So, thanks anyway, appreaciate it!
    (And I'm thinking that a focused cursor isn't a good idea after all.)