0

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.

2
Contributors
1
Reply
5
Views
5 Years
Discussion Span
Last Post by dpste123
0

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

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.