PHP script: click button to check checkbox

  • Swissprice

    (@swissprice)


    9 years, 10 months ago

    Hello,

    I managed to make a small script work for a client. The script (used on this page) allows the visitors to have their cursor placed in the first field of the contact form when they click on the button “DEVENIR REPRÉSENTANT(E)” when a visitor click on that same button.

    The script is the following:

    <script>
function myFunction() {
    document.getElementById("champnom").focus();
}
</script>

    (“champnom” is the ID of the first field of the contact form.) The script had to be placed in a widget due to the particular configuration of the theme.

    Now, I would like to, instead of placing the cursor in the first field of the form, check the checkbox “Représentant(e)” in the contact form.

    Is it possible to do that? If yes, how?

    Any help will be appreciated! 🙂

Viewing 1 replies (of 1 total)
  • bobnwp

    (@bobnwp)

    9 years, 9 months ago

    1 – always code the type on a script tag:

    <script type=”text/javascript”>

    It’s just a bit more typing and it makes sure your tags are handled as you want them handled.

    2 – I see only one occurrence of the text: DEVENIR REPRÉSENTANT(E) on the page and it is not on a button. I don’t see any button labeled with that text. In fact, I don’t see the definition of a button in your source.

    3 – If there is a button, which I’m missing – don’t know how I am missing it – am I to assume you have it defined something like:

    <input name="Button1" type="button" value="DEVENIR REPRÉSENTANT(E)" onclick="myFunction();">

    You can do the same sort of thing with a checkbox, specify something like:

    <input type="checkbox" value="Représentant(e)" name="votre-clirep[]" onclick="myFunction();">

    You could do that for any field, if you wanted to.

    On the layout of the page in general:

    I ran your page through Google translate to see it in English and find it is a fairly standard “contact” page.

    One thing that jumps out at me – your page is pretty, nice photo across the page – but it is clunky to use.

    I go to the page and then have to scroll down to get to the actual contact form.

    This goes to web page usability, not format or appearance–

    You don’t need the photo. Is taking up 400 very valuable vertical pixels. Your first intput field is about 570 pixels from the top of the page.

    Sure, it looks nice and lots of sites use the same sort of format – show a pretty picture across the page, but it makes the page hard to use. And, why make your pages look like all the others – with a huge image at the top, for instance.

    If I have clicked a link to get to a contact page, I want to see the contact form when the page loads. Don’t make me scroll down past a pretty picture, especially one that has nothing to do with my contacting you.

    Users don’t want to have to scroll around to find what they want to use.

    Don’t make them do so.

    Ditch the photo on the contact page – completely, delete it.

    You can see what it will look like without actually changing the page

    Firefox let’s you “Inspect” an element and then deleting it Right click on the image and select “Inspect Element” The HTML will be shown at the bottom of the window with the <div> tag containing the image highlighted. Press the Delete key and the image will be removed.

    You can do the same with Chrome – right click the image, select “Inspect” and press the Delete key.

    There are close buttons for the inspection frames at their top right corners.

    Do it – doesn’t the page look better, more usable?

    Far too many designers are making pages “pretty” at the sake of functionality.

    In my philosophy, Function always trumps Format/Appearance.

    Make it as pretty as you want but don’t sacrifice any functionality or ease of use.

    On other thing, if you add autofocus=”autofocus” to the definition of the first input field, the cursor will be placed there when the page loads – provided the browser supports it, all newer versions of browser do support it.

    Bob

Viewing 1 replies (of 1 total)

The topic ‘PHP script: click button to check checkbox’ is closed to new replies.