Form validation PHP or js

  • roelof

    (@roelof)


    8 maanden geleden

    Volgende challenge die ik gekregen heb is het maken van een shortcode die een formulier laat zien.
    Dat gedeelte heb ik al klaar.

    nu vraag ik me af of de validatie en het laten zien van eventuele validatie errors het beste in PHP kan of dat ik toch beter js kan gebruiken.

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    8 maanden geleden

    Ik denk dat clientside een betere optie is, vooraleer de submission terug naar de server komt – tenzij je echt zaken op server moet valideren of ophalen.

    Thread starter roelof

    (@roelof)

    8 maanden geleden

    Geen idee,
    De opdracht is om een custom shortcode te maken die een formulier laat zien. En dit zijn de requirements:

    1. Shortcode needs to have fields: Subject (input), Email (input), Message (textarea),
    2. Sanitize all fields before being used for sending it,
    3. Use wp_mail to send the email
    4. Style it and enqueue style only on pages where the shortcode is
    5. Display errors on top of the form

    Ik heb de shortcode werkend.
    Ik krijg het formulier te zien.
    En omdat bij punt 5 gezegd wordt dat ik de errors op het formulier te zien moeten zijn, krijg ik het idee dat ik iets van validatie nodig heb,.

    Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    8 maanden geleden

    Het hangt van de scope af en welk soort validatie er moet komen, als het bvb een valide ingave van e-mailadres moet gebeuren, dan kan dat louter clientside 🙂

    Thread starter roelof

    (@roelof)

    8 maanden geleden

    Dat wordt dus mooi niet genoemd.
    Als ik nu eens vanuit ga dat de bedoeling is om te kijken of alles ingevuld is , dan kan alles in PHP ?

    Moderator Richard van Denderen

    (@rdd)

    8 maanden geleden

    Je zou beide moeten doen.
    De JS optie is fijn voor de gebruiker, niet de inzending verliezen en snel een melding krijgen wanneer er iets fout is in de input.

    Nadeel is dat een gebruiker ook de javascript uit kan zetten & kan manipuleren dus dat is geen veilige validatie, zelfde gaat op voor de html input types.

    voor het verwerken van de input kan je een serie WP functies gebruiken in PHP:
    https://developer.wordpress.org/apis/security/
    https://developer.wordpress.org/apis/security/data-validation/
    https://developer.wordpress.org/apis/security/sanitizing/
    https://docs.wpvip.com/security/validating-sanitizing-and-escaping/

    Thread starter roelof

    (@roelof)

    8 maanden geleden

    oke, de js part will be easy I think.
    Voor de php gedeelte moet ik nog even uitzoeken hoe ik dan de functie aanroep.

    Dit heb ik tot zover 

    `<br>

<?php

/**

 * Plugin Name: mycustomForm

 * Plugin URI: none

 * Description: Test.

 * Version: 0.1

 * Author: Roelof Wobben

 * Author URI: none

 **/

class mycustomForm

{

    public function __construct()

    {

        // add assests(js,css , etc)

        add_action('wp_enqueue_scripts', array($this, 'load_assets'));

        // add shortcode

        add_shortcode('contact_form', array($this, 'load_shortcode'));

    }

    public function load_assets()

    {

        wp_enqueue_style(

            'mycustomForm',

            plugin_dir_url(__FILE__) . '/css/mycustomForm.css',

            array(),

            1,

            'all'

        );

        wp_enqueue_script(

            'mycustomForm',

            plugin_dir_url(__FILE__) . '/js/mycustomForm.js',

            array(),

            1,

            true

        );

    }

    public function load_shortcode()

    {

        ?>

        <div class="container">

            <form>

                <h1>Contact Form</h1>

                <div class="form-group">

                    <input type="text" required="required" />

                    <label for="input" class="control-label">Subject</label><i class="bar"></i>

                </div>

                <div class="form-group">

                    <input type="text" required="required" />

                    <label for="input" class="control-label">Email</label><i class="bar"></i>

                </div>

                <div class="form-group">

                    <textarea required="required"></textarea>

                    <label for="textarea" class="control-label">Message</label><i class="bar"></i>

                </div>

            </form>

            <div class="button-container">

                <button type="button" class="button"><span>Submit</span></button>

            </div>

        </div>

        <?php

    }

}

new mycustomForm;</code></pre>
6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Het onderwerp ‘Form validation PHP or js’ is gesloten voor nieuwe reacties.