PHP & JS help - newbie

Hi I copied a form from codepen.io and I cannot get it to work. Please help?
form located at: www.sgdr.co.uk/form.html
Thanks.
Shona

Try validating the page:

I think if the missing <!DOCTYPE HTML> was added it would clear most of the errors.

Hi
Thanks for your help. The online form was a rough ‘html’ till I got the form to work. I copied all the code from codepen.io https://codepen.io/JTBennett/pen/jWBEPq
but I have done something wrong and I’m not sure what.
Shona

If you do what @John_Betong suggested, you may find out some of what you did wrong and why the form isn’t working. You can’t start with a ‘rough’ piece of code and expect everything to work, and then ‘fix’ up the roughness of the code later when you have time. You really should code everything the right way the first time, because all this code is interconnected, and mistakes or omissions made in one place might cause issues elsewhere.

1 Like

Hi
Thanks for getting back to me. I’ve added all my html and after validation there are several errors that are way beyond me. Can someone please check? Should I maybe try a different form?
Shona

Did you include the <!DOCTYPE HTM>?

Can you expand upon the “several errors”?

If you Google “the error” there will be many helpful suggestions.

Hi,
Yes I did add . Errors: :leftwards_arrow_with_hook:

Error: Bad value true for attribute required on element input.

From line 106, column 13; to line 106, column 114

      <input type="text" name="name" id="name" required="true" class="input-field" placeholder="Jane Doe" />↩     

2.Error: Element div not allowed as child of element ul in this context. (Suppressing further errors from this subtree.)

From line 113, column 9; to line 113, column 71

:leftwards_arrow_with_hook:

:leftwards_arrow_with_hook:
Contexts in which element div may be used:Where flow content is expected. As a child of a dl element. Content model for element ul:Zero or more li and script-supporting elements.

3.Error: Bad value true for attribute required on element textarea.

From line 125, column 11; to line 125, column 106

      <textarea cols="46" rows="8" name="message" id="message" class="textarea-field" required="true"></text

4.Error: Element li not allowed as child of element div in this context. (Suppressing further errors from this subtree.)

From line 130, column 7; to line 130, column 10

;">↩

  • :leftwards_arrow_with_hook:

    Error: Saw <?. Probable cause: Attempt to use an XML processing instruction in HTML. (XML processing instructions are not supported in HTML.)

    At line 219, column 2

    /:leftwards_arrow_with_hook: :leftwards_arrow_with_hook::leftwards_arrow_with_hook:<?php include 'c

    11.Error: The for attribute of the label element must refer to a non-hidden form control.

    From line 109, column 13; to line 109, column 32

          <label for="phone2">phone<
    

    12.Error: The for attribute of the label element must refer to a non-hidden form control.

    From line 115, column 13; to line 115, column 31

          <label for="email">email 
    

    The above code is from the form that I copied from codepen.
    I would do the research myself albeit for having MS and running out of steam and concentration quickly. Help and advice much appreciated. I am building this website free as a favour to the rescue organisation.
    Shona

  • Hi Shona

    Instead of

    required="true"
    

    try just

    required
    

    and see if that gets rid of some of the errors.

    Hi Gandalf
    Thanks, that did get rid of some of the errors. I’ve just got the

  • , labels and php errors as details above.
    Shona

  • I’m struggling to understand the errors you’ve posted above Shona. The link you posted has gone and gives a 404 error, so I can’t check. Given that you have PHP code in your page, then it must have a .php extension not .html - that should get rid of your PHP errors. If you repost the page we can look at the label errors.

    Hi Gandalf
    The page is www.sgdr.co.uk/contact_copy.html
    I’m also check with W3 Schools to see if that gives me any clarity.
    Shona

    First thing, then, is to change it to contact_copy.php as I mentioned.

    Hi,
    Ok I’ve done that (knew I’d done something silly somewhere). Getting there :slight_smile:
    Shona

    Good-oh. For the labels, you need an id as well as a name for the fields - id=“phone2” and id=“email”.

    You also have a list element <li> after you have closed the unordered list <ul>.

    Hi
    That’s part of the problem using someone else’s code, particularly when I don’t know what some of it does. Okay - no errors :slight_smile: but the form still doesn’t work! Arrrggg…
    Shona

    Indeed!

    I try to avoid jQuery if at all possible, but I don’t see you loading jQuery anywhere which is probably the problem.

    Hi Gandalf458
    What would I better to use?
    Shona

    Your tutorial uses jQuery, Shona, so stick to that. I just don’t like it and I don’t have the experience with it to help you. But you do need to load the jQuery library somewhere in your code. Presumably the tut shows how and where.

    Hi gandalf458
    Many thanks for your kind assistance, it’s very much appreciated.
    The reason the form doesn’t work is I need to be able to host the contact.php file on PlusNet’s CGI server. It’s now being sorted out so that I can get access to that server. The answer was in the depths of memory! Just took longer to find it :wink:
    Thanks again.
    Shona

    1 Like

    This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.