0

単一ページのWebサイトがあり、挿入は正しく機能していますが、送信後に#resultsdivを更新できないようです。値はデータベースに正常に挿入されており、ハードリフレッシュすると表示されます。ただし、jQueryAJAXの更新ではありません。私はAjaxを初めて使用するので、助けていただければ幸いです。コード構造や悪い習慣についてのコメントは、プログラミングの適切な方法を学ぼうとしているのでコメントしてください。

これが私のコードです：

$(document).ready(function(){        

$("form#addTodo").submit(function(){
    alert('hello world'); // ensure function is running

    var post_title = $('input#post_title').val(); // take values from inputs
    var post_content = $('input#post_content').val();

    $.ajax({
        type: "POST",
        url: "add.php",
        data: "post_title=" + post_title + "&post_content=" + post_content,
        success: function() {
            // alert('success'); // ensure success
            $('#results').fadeOut('slow').load('include/results.php').fadeIn('slow');               
        }
    });


    $('input#post_title').val(''); // clear form fields
    $('input#post_content').val('');

    return false; 
});

}）;

これがresults.phpファイルです：

<?php

$sql = $db->query('SELECT id, post_title, post_content FROM posts ORDER BY post_title ASC');

$results = $sql->fetchALL(PDO::FETCH_OBJ);
$count_posts = count($results);

?>

<?php if ( have_posts() == true) : ?>
    <div class="accordion" id="accordion_main">
        <?php foreach($results as $entry): ?>
            <div class="accordion-group">
                <div class="accordion-heading">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_main" href="#collapse-<?php echo $entry->id; ?>">    
                        <?php echo $entry->post_title; ?>
                    </a>    
                </div>
                <div id="collapse-<?php echo $entry->id; ?>" class="accordion-body collapse">   
                    <div class="accordion-inner">
                        <p class="target"><?php echo $entry->post_content; ?></p>
                        <p><a href="edit.php?id=<?php echo $entry->id; ?>">Edit</a> <a href="delete.php?id=<?php echo $entry->id; ?>" onclick="return confirm('Are you sure you wish to delete this post?');">Delete</a></p>                    
                    </div>
                </div>
            </div>
        <?php endforeach; ?>                
    </div>
<?php else: ?>
    <h3>There are no posts to display at this time.</h3>
<?php endif; ?>

これは、index.phpに含まれている場合は正常に機能します。データをDBに投稿した後、更新することができません。

<?php
require_once 'includes/db.php';
require_once 'includes/functions.php';
?>

<?php get_header(); ?>

<div id="results">
<?php include_once 'includes/results.php'; ?>
</div>

<hr />
<p>Add New Post</p>

<form id="addTodo" action="">

<div>
    <label for="post_title">Post Title</label>
    <input id="post_title" name="post_title">
</div>

<div>
    <label for="post_content">Post Content</label>
    <input id="post_content" name="post_content">
</div>

<div>
    <button id="submit" type="submit">
        Save
    </button>
</div>

</form>

<?php get_footer(); ?>

私はまだフォーム検証を行っていないことを言及する必要があります。どんな助けでも大歓迎です、ありがとう。

4

3 に答える 3

0

phpファイルから返されたデータを挿入するには、$（ "element id or class"）。html（）関数を使用して、データまたはhtmlをドキュメントの特定の領域に挿入します。

于 2013-01-22T05:33:01.540 に答える
0

成功からデータを返さないのはなぜですか? それを使用してhtml入力を行います

success:function(returnedData) {
     if (returnedData.status = 'successful') {
       //use javascript to append the data for example like 
       //returnedData.message to make html and insert into your current html
     }    
}

注: returnData は、php によって json 形式でプッシュする必要があります。

于 2013-01-21T23:27:45.860 に答える
0

私が最近回答したこのスレッドを読むと、リクエストに対する同様の回答を見つけることができます: Jquery Mobile Post to PHP (同じページ)

ただし、コンテキストに合わせて調整する必要があります;-) !! 独自のファイルスクリプトを使用している場合、それが独自のソリューションだと思います

于 2013-01-22T00:57:21.753 に答える