Hi,
I have an issue javascript not reloading in IE7, in all the other browsers this works good. My application has a Multiview controlled by some LinkButtons. Inside of each view I have a user control and I have some javascript inside of each of them. All this inside of a RadAjaxManager.
The code on the page looks like this:
The code inside of the user controls looks like this:
I just need that javascript to load every time the multiview is updated.
I have an issue javascript not reloading in IE7, in all the other browsers this works good. My application has a Multiview controlled by some LinkButtons. Inside of each view I have a user control and I have some javascript inside of each of them. All this inside of a RadAjaxManager.
The code on the page looks like this:
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"LinkScottDecker"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"LinkScottDecker"
/>
<
telerik:AjaxUpdatedControl
ControlID
=
"MultiView1"
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
<
telerik:AjaxSetting
AjaxControlID
=
"LinkBradBlock"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"LinkBradBlock"
/>
<
telerik:AjaxUpdatedControl
ControlID
=
"MultiView1"
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
</
telerik:RadAjaxManager
>
<
asp:LinkButton
ID
=
"LinkScottDecker"
runat
=
"server"
OnClick
=
"LinkScottDecker_Click"
ToolTip
=
"Scott Decker"
>
<
asp:Image
ID
=
"scottdeckerImage"
runat
=
"server"
ImageUrl
=
"~/img/executive-thumb-scott-decker.jpg"
CssClass
=
"exec-thumbs-scott"
/>
</
asp:LinkButton
>
<
asp:LinkButton
ID
=
"LinkBradBlock"
runat
=
"server"
OnClick
=
"LinkBradBlock_Click"
ToolTip
=
"Brad Block"
>
<
asp:Image
ID
=
"bradblockImage"
runat
=
"server"
ImageUrl
=
"~/img/executive-thumb-brad-block.jpg"
CssClass
=
"exec-thumbs-first-line"
/>
</
asp:LinkButton
>
<
asp:MultiView
ID
=
"MultiView1"
runat
=
"server"
ActiveViewIndex
=
"0"
>
<
asp:View
ID
=
"ViewScottDecker"
runat
=
"server"
>
<
ucBio1:ucScottDecker
ID
=
"ucScottDekcer1"
runat
=
"server"
/>
</
asp:View
>
<
asp:View
ID
=
"ViewBradBlock"
runat
=
"server"
>
<
ucBio2:ucBradBlock
ID
=
"ucBradBlock1"
runat
=
"server"
/>
</
asp:View
>
</
asp:MultiView
>
The code inside of the user controls looks like this:
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ucScottDecker.ascx.cs" Inherits="uc_bios_ScottDecker" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<
img
src
=
"../img/executive-photo-scott-decker.jpg"
class
=
"exec-photo"
alt
=
"Scott Decker"
/>
<
p
>Scott Decker</
p
>
<
p
>As President, Scott Decker believes the best is yet to come............</
p
>
<
telerik:radscriptblock
id
=
"RadScriptBlock2"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
var $j = jQuery.noConflict();
$j(document).ready(function () {
//When you click on a link with class of poplight and the href starts with a #
$j('a.poplight[href^=#]').click(function () {
var popID = $j(this).attr('rel'); //Get Popup Name
var popURL = $j(this).attr('href'); //Get Popup href to define size
//Pull Query & Variables from href URL
var query = popURL.split('?');
var dim = query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
//Fade in the Popup and add close button
$j('#' + popID).fadeIn().css({ 'width': Number(popWidth) }).prepend('<
a
href
=
"#"
class
=
"close"
onclick
=
"javascript:ytplayer.stopVideo()"
><
img
src
=
"../img/close_pop.png"
class
=
"btn_close"
title
=
"Close Window"
alt
=
"Close"
border
=
"0"
/></
a
>');
//Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
var popMargTop = ($j('#' + popID).height() + 80) / 2;
var popMargLeft = ($j('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$j('#' + popID).css({
'margin-top': -popMargTop,
'margin-left': -popMargLeft
});
//Fade in Background
$j('body').append('<
div
id
=
"fade"
></
div
>'); //Add the fade layer to bottom of the body tag.
$j('#fade').css({ 'filter': 'alpha(opacity=80)' }).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
return false;
});
//Close Popups and Fade Layer
$j('a.close, #fade').live('click', function () { //When clicking on the close or fade layer...
$j('#fade , .popup_block').fadeOut(function () {
$j('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</
script
>
<
script
type
=
"text/javascript"
>
var params = { allowScriptAccess: "always" };
var atts = { id: "myytplayer" };
swfobject.embedSWF("http://www.youtube.com/e/I5QezMuqpJA?enablejsapi=1&playerapiid=ytplayer",
"ytapiplayer", "560", "349", "8", null, null, params, atts);
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
}
</
script
>
</
telerik:radscriptblock
>
<
div
>
<
p
>Transforming Healthcare:br />
<
a
href
=
"#?w=560"
class
=
"poplight"
rel
=
"popup_name"
>How NextGen continues to be an industry
leader.</
a
>
</
p
>
</
div
>
<
div
id
=
"popup_name"
class
=
"popup_block"
>
<!--<center><iframe title="YouTube video player" width="560" height="349" src="http://www.youtube.com/embed/I5QezMuqpJA" frameborder="0" allowfullscreen></iframe></center>-->
<
div
id
=
"ytapiplayer"
>
You need Flash player 8+ and JavaScript enabled to view this video.
</
div
>
</
div
>
I just need that javascript to load every time the multiview is updated.