English 中文(简体)
jQuery forms.js支持每个页面多个表单。
原标题:
  • 时间:2009-02-10 07:50:23
  •  标签:

我想使用php和ajax向mySql数据库提交信息。

信息被发送的页面(form.php)有多个表单,这些表单是由“while()”循环生成的。

成功后,我将会更新一个特定表单所在div的响应。

我目前使用的是jQuery和jQuery表单插件

I have been successful in getting the data to the database, however I am having trouble with the response being sent back to the proper div. I have been successful in getting a response back to a div that is outside of the while() loop. I have not, however, been successful in getting a response back to a div within the loop. I have placed in the code below a div called: "> Where I would like the note to be placed.

我知道这与我的JavaScript函数有关:

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery( form ).ajaxForm({
        target:  #noteReturn ,
        success: function() { $( #noteReturn ).fadeIn( slow ); }
    });
});
</script>

#noteReturn 函数没有指定应该放置在哪个 business div 中。

我希望这有意义。

谢谢您的帮助。

代码如下:

<!-- the form.php page -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/forms.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function() { 
    jQuery( form ).ajaxForm({ 
    target:  #noteReturn ,
    success: function() { 
    $( #noteReturn ).fadeIn( slow ); } 
    }); 
});
</script>  
<?php
$query = mysql_query("SELECT * FROM businesses");
while( $row = mysql_fetch_assoc( $query ) ):
    $b_id = $row[ bid ];
?>

<div class= notes > 

<?php  
// query the db for notes associated with business... return notes texts and notes dates
$notesQuery = mysql_query("SELECT business_id, notes, messageDate FROM notes WHERE notes.business_id = $b_id ORDER BY messageDate");
while( $NoteRow = mysql_fetch_assoc( $notesQuery ) ) { 
extract($NoteRow); 
echo "$notes<br/><span class= noteDate >$messageDate</span><br />"; 
}  // end while$notesQuery
?> 
<!-- this is where i would like jQuery to return the new note -->
<div id="noteReturn<?php echo $b_id; ?>"></div> 

<!-- begin note form -->
<form name="noteForm" action="notesProcess.php" method="post">
    <input type="text"  name="note" />
    <input type="hidden" value="<?php echo $b_id ?>" name="bid" />
    <input type="submit" class="button"  value="Send" />
</form>

</div> <!-- end div.notes --> 
<?php
endwhile;
?> 

<!-- /////////////////////////////////////////////////////
The page that the form submits to is this (notesProcess.php): 
///////////////////////////////////////////////////// -->
<?php
$note = $_POST[ note ];
$id = $_POST[ bid ];
$sql = "INSERT INTO notes (business_id, notes) VALUES ( $id ,  $note )";
$result = mysql_query( $sql );
if( $result ) {
echo " $note"; }
?>
最佳回答

改变这段代码:

jQuery( form ).ajaxForm({ 
    target:  #noteReturn ,
    success: function() { 
        $( #noteReturn ).fadeIn( slow );
    } 
});

到这里:

jQuery( form ).ajaxForm({ 
    target:  #noteReturn ,
    dataType:  json ,
    success: function(data) { 
        $( #noteReturn  + data.id).html(data.note).fadeIn( slow );
    } 
});

这个代码:

<?php
$note = $_POST[ note ];
$id = $_POST[ bid ];
$sql = "INSERT INTO notes (business_id, notes) VALUES ( $id ,  $note )";
$result = mysql_query( $sql );
if($result) {
    echo " $note";
}
?>

到这里:

<?php
$note = mysql_real_escape_string($_POST[ note ]);
$id = mysql_real_escape_string($_POST[ bid ]);
$sql = "INSERT INTO notes (business_id, notes) VALUES ( $id ,  $note )";
$result = mysql_query( $sql );
if($result) {
    print json_encode(array("id" => $id, "note" => $note));
}
?>

What happened?

PHP 代码的更改利用了 PHP 的 json_encode 函数打印出已添加笔记的商家的 id 以及实际笔记文本。在 JavaScript 代码中,我添加了 json 的 dataType,告诉脚本要期望什么格式的响应。一旦请求在 success 回调中接收到,data 变量是一个包含我们通过 json_encode 传递的值的对象。因此,data.id 具有商家 id,data.note 具有新笔记。使用 jQuery 的 html() 操作函数,更新 div 的内部 html 到最新笔记。div 选择器使用我们传递的 id,因此我们可以更新相应的 div。

此外,稍微偏离话题,但确保在像您一样将值放入查询时始终使用mysql_real_escape_string。如果您不使用此功能,则您的查询将容易受到注入攻击的威胁,这是不美观的。如果客户决定输入);DROP TABLE businesses; 的注释值,您会感到极度痛苦。最好切换到PDOMySQLi,并使用prepared statements,因为它们是现在正确执行查询的方法。

问题回答

暂无回答




相关问题
热门标签