call javascript function from c# not working
Question
Hello guys i have in my popupscrit.js file this method:
function afficherMessageInfo( id, message) {
//Get the A tag
alert('executing the client code');
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set heigth and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeIn(500);
$('#mask').fadeTo("slow",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(1000);
}
$('.window .close').live("click", function (event) {
//Cancel the link behavior
event.preventDefault();
$('#mask').hide();
$('.window').hide();
});
//if mask is clicked
$('#mask').live("click", function (event) {
$(this).hide();
$('.window').hide();
});
i want to show a popup from ac# button click event like this:
void BtnEnregistrer_btnClick(object sender, EventArgs e)
{
string id = "#info";
string messageInfo = "le dossier a été crée avec succès";
string script = String.Format("afficherMessageInfo({0},{1})", id, messageInfo);
this.Page.ClientScript.RegisterStartupScript(this.GetType(),
"afficherMessageInfo", script, true);
}
and the html part:
<script src="../Scripts/jquery.js" type="text/javascript"></script>
<script src="popupScript.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div id="boxes">
<!-- information -->
<div id="info" class="window" style="display:none;">
<div class="info_title">
<div class="pop_title">Information</div>
<div class="close_image"><a href="#"class="close"/><img src="images/popups/close.jpg" border="0" /></a></div>
</div>
<div class="pop_content">
<div class="pop_message">Etiam vel nisl ante. Mauris congue sodales risus ac cele risque Etiam vel nisl ante.Etiam vel nisl ante.</div>
<div align="right"><input name="" type="button" value="OK" class="info_bt"/></div>
</div>
</div>
<!-- Alerte -->
<div id="alerte" class="window" style="display:none;">
<div class="alerte_title">
<div class="pop_title">Alerte</div>
<div class="close_image"><a href="#"class="close"/><img src="images/popups/close.jpg" border="0" /></a></div>
</div>
<div class="pop_content">
<div class="pop_message">Etiam vel nisl ante. Mauris congue sodales risus ac cele risque Etiam vel nisl ante.Etiam vel nisl ante.</div>
<div align="right"><input name="" type="button" value="OK" class="alerte_bt"/></div>
</div>
</div>
<!-- validation -->
<div id="validation" class="window" style="display:none;">
<div class="validation_title">
<div class="pop_title">Validation</div>
<div class="close_image"><a href="#"class="close"/><img src="images/popups/close.jpg" border="0" /></a></div>
</div>
<div class="pop_content">
<div class="pop_message">Etiam vel nisl ante. Mauris congue sodales risus ac cele risque Etiam vel nisl ante.Etiam vel nisl ante.</div>
<div align="right"><input name="" type="button" value="Annuler" class="validation_bt"/> <input name="" type="button" value="OK" class="validation_bt"/></div>
</div>
</div>
<!-- confirmation -->
<div id="confirmation" class="window" style="display:none;">
<div class="confirmation_title">
<div class="pop_title">Demande de Confirmation</div>
<div class="close_image"><a href="#"class="close"/><img src="images/popups/close.jpg" border="0" /></a></div>
</div>
<div class="pop_content">
<div class="pop_message">Etiam vel nisl ante. Mauris congue sodales risus ac cele risque Etiam vel nisl ante.Etiam vel nisl ante.</div>
<div align="right"><input name="" type="button" value="Exemple 1" class="confirmation_bt"/> <input name="" type="button" value="Exemple 2" class="confirmation_bt"/> <input name="" type="button" value="Exemple 3" class="confirmation_bt"/> <input name="" type="button" value="Annuler" class="confirmation_bt"/> <input name="" type="button" value="OK" class="confirmation_bt"/></div>
</div>
</div>
<!-- Masque pour couvrir la page -->
<div id="mask"></div>
</div>
what's the pb the alert is not showing
5 answers
solution1
1 2011-11-10 15:21:18
It looks like the parameters you are passing to your javascript function is missing quotes:
The line
string script = String.Format("afficherMessageInfo({0},{1})", id, messageInfo);
should read
string script = String.Format("afficherMessageInfo('{0}','{1}')", id, messageInfo);
solution2
1 2011-11-10 15:21:38
you are missing a semi-colon after afficherMessageInfo()...
have you tried debugging this using browser tools?
solution3
0 2011-11-10 15:21:47
Remove the true parameter on your RegisterStartupScript function call, the reason being that it's already defined in your markup for sure within a <script></script> block.
RegisterStartupScript has an overload that does not take the include script block param at the end.
So change your line to this:
this.Page.ClientScript.RegisterStartupScript(this.GetType(),
"afficherMessageInfo", script);
solution4
0 2011-11-10 15:27:54
Why don't you just add OnClientClick attribute?
protected void Page_Load(object sender, EventArgs e)
{
string id = "#info";
string messageInfo = "le dossier a été crée avec succès";
BtnEnregistrer.OnClientClick = String.Format("afficherMessageInfo('{0}','{1}')", id, messageInfo);
}
This method will refrain you from a PostBack and will give you a popup instantly.
solution5
0 2011-11-11 14:01:11
// Round your values before using them since they can result in float.
// Also you have to implicitly add '.px' to them.
//Get the screen height and width
var maskHeight = $(document).height() + '.px';
var maskWidth = $(window).width() + '.px';
//Set heigth and width to mask to fill up the whole screen
$('#mask').css({
'width':maskWidth,
'height':maskHeight
});
var windowH = Math.round(winH/2-$(id).height()/2) + '.px';
var windowW = Math.round(winW/2-$(id).width()/2) + '.px';
$(id).css({
'top': windowH,
'left': windowW
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Call JavaScript function from codebehind(c#) is not working
How to call C# function from Javascript
Call C# method from javascript function
Call JavaScript function from C#
How to call a C# function from JavaScript?
Call javascript function (with args) from c#
document.getElementById() not working when call javascript function from code behind in c#
call javascript function by c#
Javascript : call a C# function
Call razor c# function from javascript function
Related Tags