2013-01-21 59 views
0

我有一个单一的网页,我有插入工作正常,但我似乎无法更新提交后的#results div。这些值被插入到数据库中,如果我硬刷新它们正在出现。但不是用jQuery AJAX刷新。我是Ajax的新手,所以任何帮助都会非常感激,并且对代码结构或不良习惯发表任何评论,请评论,因为我正在尝试学习正确的编程方式。插入后不工作jQuery 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这工作得很好,我只是无法得到它的发布数据到数据库后刷新。

<?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(); ?> 

我应该提到,我还没有进行表单验证。任何帮助非常感谢,谢谢。

回答

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 
    }  
} 

注意:returnedData必须推出你的php以json格式。

0

你可以找到一个类似的回答您的要求,如果你读到这线程我最近回答:Jquery Mobile Post to PHP (same page)

但你必须做出一些调整你的上下文;-)! 我认为这是独特的解决方案,如果你使用独特的文件脚本

0

要插入从PHP文件返回的数据只需使用$(“元素ID或类”).HTML()函数插入数据或HTML您文档的特定区域