Question

134

jquery submit form and then show results in an existing div

rated 0 times [ 137] [ 3] / answers: 1 / hits: 99525 / 15 Years ago, sun, august 2, 2009, 12:00:00

I have a simple one text input form that when submitted, needs to fetch a php file (passing the inputs to the file) and then take the result (just a line of text) and place it in a div and fade that div into view.

Here is what I have now:

<form id=create method=POST action=create.php>

<input type=text name=url>

<input type=submit value=Create /> 



<div id=created></div>

What I need is the results of create.php?url=INPUT, to be dynamically loaded into the div called created.

I have the jquery form script, but I haven't been able to get it to work right. But I do have the library loaded (the file).

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

monica

Add To Favorites

Follow

Total Points: 308

Total Questions: 102

Total Answers: 109

Location: Saudi Arabia

Member since Sat, Aug 20, 2022

2 Years ago

answered 15 Years ago marisela · Accepted Answer

This code should do it. You don't need the Form plugin for something as simple as this:

$('#create').submit(function() { // catch the form's submit event

    $.ajax({ // create an AJAX call...

        data: $(this).serialize(), // get the form data

        type: $(this).attr('method'), // GET or POST

        url: $(this).attr('action'), // the file to call

        success: function(response) { // on success..

            $('#created').html(response); // update the DIV

        }

    });

    return false; // cancel original event to prevent form submitting

});