I have created pages to comping some content and adding it into db. Here they are

composing.php

 <html>
        <head>
            <title>Composing news</title>
            <script type="text/javascript" src="includes/jquery/jquery.min.js" ></script> 
            <script type="text/javascript">
                function reset_form() {
                    document.getElementById("title").reset();
                }
            </script>
            <script type="text/javascript">
                $(document).ready(function(e) { // ready method make funtion available after the document has been loaded
                    $("#submit").click(function(){
                        if($("#title").val().length == 0 || $("#category").val().length == 0 || $("#summary").val().length == 0 || $("#content").val().length == 0) {
                            alert("Please fill into every blank!");
                        } // end if
                        else {
                            $.post("adding.php",{title: $("#title").val(), category: $("#category").val(), summary: $("#summary").val(),content: $("#content").val()}, function(data){ 
                            // post method is used to perform an AJAX HTTP POST request
                                //alert("ok");                              
                            }); // end $.post
                        } // end else
                    }); // end $("#submit)
                }); // end $(document)
            </script>
            <style>
                #submit{
                    padding: 5 5 5 5;
                    border-radius: 5px;
                    text-align:center;
                    display:inline;
                    background-image: linear-gradient(bottom, rgb(81,151,239) 15%, rgb(114,182,255) 58%, rgb(149,219,255) 79%);
                    background-image: -o-linear-gradient(bottom, rgb(81,151,239) 15%, rgb(114,182,255) 58%, rgb(149,219,255) 79%);
                    background-image: -moz-linear-gradient(bottom, rgb(81,151,239) 15%, rgb(114,182,255) 58%, rgb(149,219,255) 79%);
                    background-image: -webkit-linear-gradient(bottom, rgb(81,151,239) 15%, rgb(114,182,255) 58%, rgb(149,219,255) 79%);
                    background-image: -ms-linear-gradient(bottom, rgb(81,151,239) 15%, rgb(114,182,255) 58%, rgb(149,219,255) 79%);
                    background-image: -webkit-gradient(
                        linear,
                        left bottom,
                        left top,
                        color-stop(0.15, rgb(81,151,239)),
                        color-stop(0.58, rgb(114,182,255)),
                        color-stop(0.79, rgb(149,219,255))
                    );
                }

                #reset{
                    padding: 5 5 5 5;
                    border-radius: 5px;
                    text-align:center;
                    display:inline;
                    background-image: linear-gradient(bottom, rgb(167,12,21) 12%, rgb(201,39,49) 56%, rgb(242,67,79) 78%);
                    background-image: -o-linear-gradient(bottom, rgb(167,12,21) 12%, rgb(201,39,49) 56%, rgb(242,67,79) 78%);
                    background-image: -moz-linear-gradient(bottom, rgb(167,12,21) 12%, rgb(201,39,49) 56%, rgb(242,67,79) 78%);
                    background-image: -webkit-linear-gradient(bottom, rgb(167,12,21) 12%, rgb(201,39,49) 56%, rgb(242,67,79) 78%);
                    background-image: -ms-linear-gradient(bottom, rgb(167,12,21) 12%, rgb(201,39,49) 56%, rgb(242,67,79) 78%);
                    background-image: -webkit-gradient(
                        linear,
                        left bottom,
                        left top,
                        color-stop(0.12, rgb(167,12,21)),
                        color-stop(0.56, rgb(201,39,49)),
                        color-stop(0.78, rgb(242,67,79))
                    );
                }
            </style>
        </head>

        <body>
            <!--form-->
            <p id="status">Composing</p>
            <form id = "composing_form" name="composing_form" method = "post" action="addguestbook1.php">
                <p>Title: <input class="form" type="text" id="title" name="title" value=""/></p>
                <p>Category: <input type="category" class="form" id="category" name="category" value=""/></p>
                <p>Summary:<br/><textarea class="form" id="summary" name="summary" cols="40" rows ="3"></textarea></p>
                <p>Content:<br/><textarea class="form" id="content" name="content" cols="60" rows ="10"></textarea></p>
                <p id="submit">Submit</p>
                <p id="reset">Reset</p>
            </form>
            <!--End form-->
        </body>
    </html>

adding.php

<?
    $title = addslashes($_POST['title']);
    $category = addslashes($_POST['category']);
    $summary = addslashes($_POST['summary']);
    $content = addslashes($_POST['content']);
    $db = new mysqli('localhost', 'root', '', 'test');
    $query = "INSERT INTO test VALUES
              ('NULL', '" . $title . "', '".$category."', '".$summary."', '".$content."' );";
    $db->query($query);
?>

db.sql

CREATE TABLE IF NOT EXISTS `test` (
    `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    `title` VARCHAR(40) NOT NULL,
    `category` VARCHAR(40) NOT NULL,
    `summary` VARCHAR(40) NOT NULL,
    `content`   VARCHAR(40) NOT NULL
);

How can forms be all reseted into empty after posting their data into (click "submit" and all forms are processed(stored) and delete out of form for user to type new one)? Thks for hepling me.

Hi

After checking that the values were saved to the database use the following:
$("form").each( function() { this.reset; });

This resets all forms on the page.

You can wrap the function in a button (with an id of "reset" in this sample):

$("#reset").on("click", function() {
    $("form").each( function() { this.reset; });
});

May I also recommend the jquery documentation at The jquery doc site. It usually covers most questions with small examples.

Greetings
Steen Andersen

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.