Using Ajax.Updater to get a javascript file (prototypejs)
Here is my ajax request:
new Ajax.Updater({ success: 'footer' }, '/dyn/actions/checkSystemMessage', {
insertion: 'after',
evalScripts: true
});
Here is what's at /dyn/actions/checkSystemMessage:
<script type="text/javascript"><!--
document.observe('dom:loaded', function() {
buildSystemMsg = function(SystemMsg) {
//behind container
behindContainer = new Element('div', {id: 'behind-system-message'});
behindContainer.setStyle({display: 'none'});
document.body.appendChild(behindContainer);
//main container
container = new Element('div', {id: 'system-message'}).update(SystemMsg);
container.setStyle({display: 'none'});
document.body.appendChild(container);
//hide button
hideBtn = new Element('a', {'class': 'close-button', 'title': 'Close System Message'}).update('Close');
hideBtn.setStyle({ marginTop: '5px'});
container.insert({bottom: hideBtn});
offsetY = container.getHeight();
//show
if ($('mod-system-alert'))
{ new Effect.Move($('mod-system-alert'), { queue: 'front', x: 0, y: offsetY, mode: 'relative', duration: 0 }); }
new Effect.Move($('footer'), { queue: 'front', x: 0, y: offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('page-container'), { queue: 'front', x: 0, y: offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('nav'), { queue: 'front', x: 0, y: offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('header-container'), { queue: 'front', x: 0, y: offsetY, mode: 'relative', duration: 0 });
Effect.BlindDown(behindContainer, { queue: 'front', duration: 0 });
Effect.BlindDown(container, { queue: 'end', duration: 0.5 });
hideBtn.observe('click', function() {
if ($('mod-system-alert'))
{ new Effect.Move($('mod-system-alert'), { queue: 'front', x: 0, y: -offsetY, mode: 'relative', duration: 0 }); }
new Effect.Move($('footer'), { queue: 'end', x: 0, y: -offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('page-container'), { queue: 'end', x: 0, y: -offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('nav'), { queue: 'end', x: 0, y: -offsetY, mode: 'relative', duration: 0 });
new Effect.Move($('header-container'), { queue: 'end', x: 0, y: -offsetY, mode: 'relative', duration: 0 });
Effect.BlindUp(behindContainer, { queue: '开发者_如何学Cfront', duration: 0 });
Effect.BlindUp(container, { queue: 'front', duration: 0.5 });
set_cookie("HideSystemMsg", true);
});
}
hideMsg = get_cookie("HideSystemMsg");
systemMsg = '${SystemMsg}';
if (systemMsg.length > 0 && !hideMsg)
buildSystemMsg(systemMsg);
});
--></script>
This is neither inserting the javascript after the element with ID footer nor is it executing the script. It does rely on other javascript libraries that are included on the page where the update is occurring. Could this be where my problem is?
I believe evalScripts will only work if your response headers have a "text/javascript" content type. This is what tells the AJAX library that what you're getting from the server is a script..
Additionally, you would not need the mark up: <script type="text/javascript"><!--
, and: --></script>
I hope this helps.
精彩评论