PHP表单提交 - 转换为jQuery .Ajax

问题描述：

How easy is it to convert the following PHP form submission to an Ajaxy type form.

Here is the PHP:

<?php //Send Tweet
    if(isset($_POST['submit'])) {
    $qtweet = $_REQUEST['tweet'];
    $connection->post('statuses/update', array('status' => $qtweet));
    echo "<div style='padding-bottom: 5px; color: #0099FF;'>Updated your Timeline Successfully.</div>";
    }
?>

And the HTML form:

<form id="tweethis" method='post' action='index.php'>
    <textarea style="width: 346px;" name="tweet" rows="5" id="tweet" ></textarea>
    <br />
    <span id="charLeft">140</span>  Characters left
    <br />
    <input type='submit' value='Tweet This!' name='submit' id='submit' />
    <br />
</form>

I'd like to use Ajax so the page doesnt need to reload.

将以下PHP表单提交转换为Ajaxy类型表单是多么容易。 p> \ n

这是PHP： p>

 ＆lt;？php //发送推文
 if（isset（$ _ POST ['submit']））{
 $  qtweet = $ _REQUEST ['tweet']; 
 $ connection-＆gt; post（'statuses / update'，array（'status'=＆gt; $ qtweet））; 
 echo“＆lt; div style ='padding- 底部：5px;颜色：＃0099FF;'＆gt;成功更新时间轴。＆lt; / div＆gt;“; 
} 
？＆gt; 
  code>  pre> 
 
   HTML表单： p> 
 
 
 ＆lt; form id =“tweethis”method ='post'action ='index.php'＆gt; 
＆lt; textarea style =“width：  346px;”  name =“tweet”rows =“5”id =“tweet”＆gt;＆lt; / textarea＆gt; 
＆lt; br /＆gt; 
＆lt; span id =“charLeft”＆gt; 140＆lt; / span＆gt; 字符左
＆lt; br /＆gt; 
＆lt; input type ='submit'value ='Tweet This！'  name ='submit'id ='submit'/＆gt; 
＆lt; br /＆gt; 
＆lt; / form＆gt; 
  code>  pre> 
 
 我想使用 Ajax所以页面不需要重新加载。 p> 
  div>

答

Pretty easy.

Use $.ajax, and check out the serialize() function to convert your form data. You will also need to prevent the default behaviour and event bubbling. This tutorial is pretty good.

Inside the ajax call you have to specify the PHP page which will handle the request. That script will handle the form submission, like in normal PHP forms and then echoes out any output. That output will be passed back to the calling client.

答

$(document).ready(function() {
    $("#tweethis").submit(function() {
        $.post('index.php', $("#tweet").val(), function(html) {
            $("#resultDiv").html(html);
        });
        return false; // prevent normal submit
    });
});

Take a look at $.ajax and the $.post (and $.get) wrappers for it.

答

Try to use my ALAJAX JQuery Plugin: http://www.freelancer-id.com/alajax

Its easy and simple as:

$("#form_ID or #div_ID").alajax();

PHP表单提交 - 转换为jQuery .Ajax

相关推荐