Wordpress custom shortcode form can't post to same page

Question

I have a problem with posting form data to same page to process it in Wordpress. I have created a shortcode named [lwCSForm] that works and spits out the form on the page its been added to. The problem is when I press submit the page wont notice the $_POST['submit'] variable and my code cant process the data.

I have tested to use these actions in the form:

action="php echo $_SERVER['PHP_SELF']" (I can't get the php tag to work here)
action="php echo $post->post_title" (I can't get the php tag to work here)
and even direct write the page name: action="about"

This is the function to display the form through shortcode on a page:

function DisplayCustomSettingsForm_shortcode() {
global $post;

if( !is_user_logged_in() ){
    echo '<div class="lwCSForm-notloggedin">
            <p> Please login to view the content! </p>
          </div>';
    return;
}

if( isset( $_POST['submit'] ) )
{
    echo "The submit button is pressed and has data";
    /* Code to update customers settings, like avatar, email, username */

} else {
$phpself = $post->post_title; // get the current page

  ?><br />
        <!-- LwCSForm Plugin-->
        <section id="lwCSForm-wrapper">
            <form name="lwCSForm" id="lwCSForm" method="post" action="<?php $phpself ?>" autocomplete="on">
                Name: <input type="text" name="realname" placeholder="Your Name" >
                Sitename: <input type="text" name="username" placeholder="Username" >
                E-mail: <input type="text" name="email" placeholder="E-mail" >
                Avatar: <input type="text" name="avatar" placeholder="Avatar" >
                <input type="submit" >
            </form>
        </section>
        <!-- END LwCSForm Plugin-->
    <br /> <?php
 }
}
add_shortcode( 'lwCSForm', 'DisplayCustomSettingsForm_shortcode');

Picture of the added form with the shortcode

Why wont wordpress process this information? and a disclaimer again. I can't get the php tags to print here but they are there in the source.

Your shortcode is implemented incorrectly. According to the documentation "Note that the function called by the shortcode should never produce output of any kind. Shortcode functions should return the text that is to be used to replace the shortcode." — Vince
– Vince, Commented Oct 7, 2019 at 7:42
Have you found out the solution. I also stuck here. It seems that page created manually don't perform fully like .php page we write? — Stan
– Stan, Commented Mar 27, 2021 at 12:54

Nuc · Accepted Answer · 2017-03-04 10:47:53Z

0

I found out that you can write the function like below and it will be easier to make form validation and process of the data. Notice the action="" is using "the_permalink()" function from Wordpress. That enables us to write all validation and processing of the posted data in the same function instead of hooking it separately to the 'INIT' function of Wordpress.

if( isset( $_POST[ 'lwCSFormSubmit' ] ) )
{

}

New function below:

function DisplayCustomSettingsForm_shortcode() {
    global $post;

    if( !is_user_logged_in() ){
        echo '<div class="lwCSForm-notloggedin">
                <p> Please login to view the content! </p>
              </div>';
        return;
    }

    if( isset( $_POST['lwCSFormSubmit'] ) )
    {
        echo "The submit button is pressed and has data";
        var_dump($_POST);
    } 
    ?>
         <!-- LwCSForm Plugin-->
         <br />
                <section id="lwCSForm-wrapper">
                    <form name="lwCSForm" id="lwCSForm" method="post" action="<?php the_permalink(); ?>" autocomplete="on">
                        Name: <input type="text" name="realname" placeholder="Your Name" >

                        Sitename: <input type="text" name="username" placeholder="Username" >

                        Email: <input type="text" name="email" placeholder="E-mail" >

                        Avatar: <input type="text" name="avatar" placeholder="Avatar" >

                        <input type="submit" name="lwCSFormSubmit">
                    </form>
                </section>
         <br /> 
         <!-- END LwCSForm Plugin-->
<?php
}
add_shortcode( 'lwCSForm', 'DisplayCustomSettingsForm_shortcode');

both Nick Duncans answer and this works, it depends on the situation what to use.

answered Mar 4, 2017 at 10:47

Nuc

331 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vince Over a year ago

Your shortcode is implemented incorrectly. According to the documentation "Note that the function called by the shortcode should never produce output of any kind. Shortcode functions should return the text that is to be used to replace the shortcode."

Nick Duncan · Accepted Answer · 2017-03-03 13:43:36Z

-1

Change your code to

function DisplayCustomSettingsForm_shortcode() {
    global $post;

    if( !is_user_logged_in() ){
        echo '<div class="lwCSForm-notloggedin">
                <p> Please login to view the content! </p>
              </div>';
        return;
    }


    ?><br />
        <!-- LwCSForm Plugin-->
        <section id="lwCSForm-wrapper">
            <form name="lwCSForm" id="lwCSForm" method="post" action="" autocomplete="on">
                Name: <input type="text" name="realname" placeholder="Your Name" >
                Sitename: <input type="text" name="username" placeholder="Username" >
                E-mail: <input type="text" name="email" placeholder="E-mail" >
                Avatar: <input type="text" name="avatar" placeholder="Avatar" >
                <input name='WCSPostSubmitButton' type="submit" >
            </form>
        </section>
        <!-- END LwCSForm Plugin-->
    <br /> <?php

}
add_shortcode( 'lwCSForm', 'DisplayCustomSettingsForm_shortcode');

add_action( 'init', 'WCSGetPostData' );
function WCSGetPostData() {
    if ( isset( $_POST['WCSPostSubmitButton'] ) ) {
        // dump out the POST data
        var_dump($_POST);

    }
}

I have moved the POST handling to the init hook and I have given your form a name so we can identify it via the $_POST array.

answered Mar 3, 2017 at 13:43

Nick Duncan

8296 silver badges17 bronze badges

3 Comments

Nuc Over a year ago

Why didn't i think of that, to load it in the init of the page?! I will test this as soon i get home! Thanx

Nuc Over a year ago

this solved the problem perfectly, marked as correct. Just one question. If we get the data in 'init' hook how can i then make a callback in the shortcode function and print out that the "data have been saved"?

Vince Over a year ago

Your shortcode is implemented incorrectly. According to the documentation "Note that the function called by the shortcode should never produce output of any kind. Shortcode functions should return the text that is to be used to replace the shortcode."

Collectives™ on Stack Overflow

Wordpress custom shortcode form can't post to same page

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related