开发者

Hide and show fields based on radio choice

I have the following form:

<fieldset id="upload-form">                     
                        <ul>
                            <li>
                                <div class="radio-list clearfix">
                                <ul>
                                    <li><label for="r1"><input type="radio" name="category" id="r1" value="34" checked="checked" /> Discussion</label></li>
                                    <li><label for="r2"><input type="radio" name="category" id="r2" value="35" /> Question</label></li>
                                    <li><label for="r3"><input type="radio" name="category" id="r3" value="36" /> Code</label></li>
                                    <li><label for="r4"><input type="radio" name="category" id="r4" value="37" /> Link</label></li>
                                </ul>
                                </div>
                            </li>
                            <li>
                                <label for="title">Title <span>required &amp; make it descriptive</span></label>
                                <input id="title" type="text" name="title" />
                            </li>
                            <li>
                                <label for="url">URL <span>don't forget the http://</span></label>
                                <input id="url" type="text" name="url" placeholder="http://" />
                            </li>
                            <li>
                                <label for="topic">Discussion topic</label>
                                <textarea id="topic" name="topic"></textarea>
                            </li>
                            <li>
                                <label for="question">Your question <span>help text</span></label>
                                <textarea id="question" name="question"></textarea>
                            </li>
                            <li>
                                <label for="description">Description <span>help text</span></label>
                                <textarea id="description" name="description"></textarea>
                            </li>
                            <li>
                                <label for="code">Code</label>
                                <textarea id="code" name="code"></textarea>
                            </li>
                            <li>
                                <label for="tags">Tags <span>separate multiple tags with commas</span></label>
                                <textarea id="tags" name="tags"></textarea>
                            </li>
                            <li>
                                <label class="public" for="public"><input id="public" type="checkbox" name="public" /> Make this post public? <span>( non-members will be able to view this post )</span></label>
                            </li>
                            <li class="clearfix">
                                <input class="submit" type="submit" name="" value="Post" />
                                <input class="cancel" type="button" value="Cancel" onclick="window.location.href='<?php bloginfo('url'); ?>/posts'" />
                开发者_运维技巧            </li>
                        </ul>
                    </fieldset>

What will happen is when a user chooses one of the radio buttons at the top of the form it will hide or show certain fields that are relevant to that category. So for example for the Link category the only fields used will be Title, URL, and Description.

I plan to use jQuery to hide and show the fields, but what about the server-side code? As if a user starts filling in fields but then decides to change the category I don't want them posting the wrong fields etc. How would I accomplish this?

I'm using WordPress and the form is coded using PHP. Here is some sample code of how the form will grab the post information and save it to the database. Thanks.

<?php

    /* Template Name: New Post */

    if(isset($_POST['new_post']) == '1')
    {
        $post_title = $_POST['post_title'];
        $post_category = $_POST['cat'];
        $post_content = $_POST['post_content'];
        $post_timelimit = $_POST['timelimit'];

        $new_post = array(
              'ID' => '',
              'post_author' => $user->ID, 
              'post_content' => $post_content, 
              'post_title' => $post_title,
              'post_status' => 'publish',
              'tax_input' => array('timelimit' => $post_timelimit)
            );

            $post_id = wp_insert_post($new_post);
            // tags have to be added seperate? :/
            wp_set_post_tags($post_id, $_POST['post_tags']);

            // This will redirect you to the newly created post
            $post = get_post($post_id);
            wp_redirect($post->guid);
    }

    get_header();

?>


You'd have to make your PHP conditional on the value of the radio button that changes that form.

if (form is in state 1) {
   process state 1 form fields
} else if (form is in states 2 and 3 or 12) {
   etc...
} else {
   ...
}

If any of the fields in all the "states" the form can be in are common across all versions of the form, then process them outside the conditional block.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜