我有一个概念性的 DOM 问题 - 我希望它有意义。
我的页面(称之为“主”)上有 prototypeJS AJAX 更新程序,我正在选择要编辑的记录,并将“页面 B”(部分)调用到“主”页面上的 div 中。
当我单击部分中的表单时,它会调用“主要”上的函数 - 但是更新程序“应该”更新部分中的一个 div……但它从来没有这样做过。我很确定 DOM 找不到它,因为它已被渲染或带入 Main...
我该如何解决这个问题???
主要
<script>
// pulls page B into Main div
function getItem( id ) {
var url = 'itemDetails.php';
var pars = { id:id };
var myAjaxOpts = new Ajax.Updater( 'itemDetail', url, {
method:'post'
,parameters:pars
,evalScripts:true
});
}
// post form and expects messages in 2 places (1) the upated div (on page B) and the message div on Main
// Only main showing up
function assignItem( frm ) {
var url = 'assignItem.php';
var pars = Form.serialize( frm );
var myAjaxOpts = new Ajax.Updater( 'subMessage', url, {
method:'post'
,parameters:pars
,evalScripts:true
,onSuccess: function( response ){
//console.log( 'request ready to be made' );
$( 'mainMessage' ).update( response );
}
});
}
</script>
<!-- page A - Main -->
<div id="mainMessage"></div>
<ul>
<li><a onClick="getItem( 1 );">item 1</a></li>
<li><a onClick="getItem( 2 );">item 2</a></li>
<li><a onClick="getItem( 3 );">item 3</a></li>
</ul>
<div id="itemDetail"></div>
<!-- end page A -->
B页(局部)
<!-- page B - Partial -->
<div id="subMessage"></div>
<form>
-- edit record ---
<input type="button" onClick="assignItem( this.form );" ></form>
<!-- end page B -->
顺便说一句——应该注意这是一个“减少”的样本(并且可能有拼写错误),我正在按预期取回数据,AJAX 没有问题,只是部分中的 div Main 上的函数似乎不可用。
谢谢
最佳答案
只需更改您要更新的 ID。
改变这个:$( 'mainMessage' ).update( response );
通过:$( 'subMessage' ).update( response );
关于javascript - prototypeJS DOM 与 AJAX 交互,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16737703/