Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder o0O0o.o0O0o's Avatar
    Join Date
    Jan 2008
    Location
    C:\Windows\System32
    Posts
    1,018
    Thanks
    19
    Thanked 9 Times in 9 Posts

    jquery form submit response text

    i am using jquery form plugin to submit form , the code is below

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery.form.js"></script>

    <script>

    // prepare the form when the DOM is ready
    $(document).ready(function() {
    var options = {
    target: '#output', // target element(s) to be updated with server response
    beforeSubmit: showRequest, // pre-submit callback
    success: showResponse // post-submit callback

    // other available options:
    url: 'test.php' // override for form's 'action' attribute //type: type // 'get' or 'post', override for form's 'method' attribute
    //dataType: null // 'xml', 'script', or 'json' (expected server response type)
    //clearForm: true // clear all form fields after successful submit
    //resetForm: true // reset the form after successful submit

    // $.ajax options can be used here too, for example:
    //timeout: 3000
    };

    // bind to the form's submit event
    $('#test1').submit(function() {
    // inside event callbacks 'this' is the DOM element so we first
    // wrap it in a jQuery object and then invoke ajaxSubmit
    $(this).ajaxSubmit(options);

    // !!! Important !!!
    // always return false to prevent standard browser submit and page navigation
    return false;
    });

    });

    // pre-submit callback
    function showRequest(formData, jqForm, options) {
    // formData is an array; here we use $.param to convert it to a string to display it
    // but the form plugin does this for you automatically when it submits the data
    var queryString = $.param(formData);

    // jqForm is a jQuery object encapsulating the form element. To access the
    // DOM element for the form do this:
    // var formElement = jqForm[0];

    alert('About to submit: \n\n' + queryString);

    // here we could return false to prevent the form from being submitted;
    // returning anything other than false will allow the form submit to continue
    return true;
    }

    // post-submit callback
    function showResponse(responseText, statusText) {
    // for normal html responses, the first argument to the success callback
    // is the XMLHttpRequest object's responseText property

    // if the ajaxForm method was passed an Options Object with the dataType
    // property set to 'xml' then the first argument to the success callback
    // is the XMLHttpRequest object's responseXML property

    // if the ajaxForm method was passed an Options Object with the dataType
    // property set to 'json' then the first argument to the success callback
    // is the json data object returned by the server

    alert('status: ' + statusText + '\n\nresponseText: \n' + responseText +
    '\n\nThe output div should have already been updated with the responseText.');
    }





    </script>

    </head>







    <form id = "test1" name = "test2" method="post">

    <input type = "text" name = "name" />
    <input type = "text" name = "name2" />
    <input type = "text" name = "name3" />
    <input type = "text" name = "name4" />
    <input type = "text" name = "name5" />
    <input type = "text" name = "name6" />
    <input type = "text" name = "name7" />


    <input type = "submit" value = "click" />
    </form>

    <div id = "output">

    here
    </div>


    </body>
    </html>

    I am getting error on the colore line
    Last edited by o0O0o.o0O0o; 05-07-2008 at 08:21 AM.
    Please de-reputate me
    © 0o0o0o0

    Its better to rule in Hell then to serve in Heaven

  • #2
    Senior Coder shyam's Avatar
    Join Date
    Jul 2005
    Posts
    1,563
    Thanks
    2
    Thanked 163 Times in 160 Posts
    Quote Originally Posted by o0O0o.o0O0o View Post
    Code:
    // prepare the form when the DOM is ready
    $(document).ready(function() {
    var options = {
    target: '#output', // target element(s) to be updated with server response
    beforeSubmit: showRequest, // pre-submit callback
    success: showResponse, //<-- post-submit callback
    
    // other available options:
    url: 'test.php' // override for form's 'action' attribute //type: type // 'get' or 'post', override for form's 'method' attribute
    //dataType: null // 'xml', 'script', or 'json' (expected server response type)
    //clearForm: true // clear all form fields after successful submit
    //resetForm: true // reset the form after successful submit
    
    // $.ajax options can be used here too, for example:
    //timeout: 3000
    };
    ...
    well, you've found the solution yourself too...you are missing a comma for the previous element
    You never have to change anything you got up in the middle of the night to write. -- Saul Bellow

  • #3
    Senior Coder o0O0o.o0O0o's Avatar
    Join Date
    Jan 2008
    Location
    C:\Windows\System32
    Posts
    1,018
    Thanks
    19
    Thanked 9 Times in 9 Posts
    thanks shyam ,
    you r best in JS
    Please de-reputate me
    © 0o0o0o0

    Its better to rule in Hell then to serve in Heaven


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •