Complete a form input with AJAX & jQuery

Question

I have this HTML code to create the form:

<form method="POST" action="/post.php" name="signup">
<table>
    <tr>
        <td>URL:</td>
        <td><input type="text" name="url" size="90" value=""/></td>
    </tr>
    <tr>
        <td>Title: </td>
        <td><input type="text" name="title" size="90"/> </td>
    </tr>
    </table>
</form>

What I want to do is when a user enters a URL in the url input, I get the the title of the page, and the script outputs it to the title input. To get the title from an URL I have a PHP Script.

Darin Dimitrov · Accepted Answer · 2011-01-08 13:33:23Z

3

You could use AJAX:

$(function() {
    $('input[name=url]').change(function() {
        // when the value of the url textbox changes
        // which happens when the textbox looses focus
        // send an AJAX request to the server script
        // to query the title of the remote url
        $.get('/gettitle.php', { url: $(this).val() }, function(result) {
            // when the AJAX request succeeds update the value
            // of the title input
            $('input[name=title]').val(result);
        });
    });
});

answered Jan 8, 2011 at 13:33

Darin Dimitrov

1.0m277 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Francesc Over a year ago

Do I have to put this code inside jQuery(document).ready($(function() { ??

Darin Dimitrov Over a year ago

@Francesc, yes of course and you can see I've already done this in my example: $(function() { ... }); is absolutely equivalent to jQuery(document).ready(function() { ... });, it's just a shorthand.

redsquare Over a year ago

well the script can go before the closing body tag therefore allowing you to get rid of any doc ready statements.

Collectives™ on Stack Overflow

Complete a form input with AJAX & jQuery

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related