2011-02-03 38 views
1

我是Jquery的新手,并试图开始学习新工具。我想要做的是在完成处理后从我的gridViews行命令函数中调用JQuery消息框,以便通知用户进程已完成。我试图用这个网站作为保证 http://stuntsnippets.com/jquery-message-box/从服务器端代码的Jquery Messagebox调用

但不知道如何从服务器端调用函数。我曾尝试ClientScript.RegisterStartupScript 谢谢 Spafa9

将这个脚本标签中......

$(document).ready(function() { 
    //Determining if there is a message to be shown if the message is not equal to empty string then the messagebox should appear. 
    if(message != '') { 
     message_box.show_message('Equipment Request:', message); 
    }    
}); 

//JQuery to set up the messagebox. 
var message_box = function() { 
    var button = '<input type="button" onclick="message_box.close_message();" value="Ok" />'; 
    return { 
     show_message: function (title, body) { 
      if (jQuery('#message_box').html() === null) { 
       var message = '<div id="message_box"><h1>' + title + '</h1>' + body + '<br/>' + button + '</div>'; 
       jQuery(document.body).append(message); 
       jQuery(document.body).append('<div id="darkbg"></div>'); 
       jQuery('#darkbg').show(); 
       jQuery('#darkbg').css('height', jQuery('html, body').height()); 

       jQuery('#message_box').css('top', jQuery('html, body').scrollTop() + 150); 
       jQuery('#message_box').show('slow'); 
      } else { 
       var message = '<h1>' + title + '</h1>' + body + '<br/>' + button; 
       jQuery('#darkbg').show(); 
       jQuery('#darkbg').css('height', jQuery('html, body').height()); 

       jQuery('#message_box').css('top', jQuery('html, body').scrollTop() + 150); 
       jQuery('#message_box').show('slow'); 
       jQuery('#message_box').html(message); 
      } 
     }, 
     close_message: function() { 
      jQuery('#message_box').hide('fast'); 
      jQuery('#darkbg').hide(); 
     } 
    } 
}(); 

这正好在CSS:

#darkbg { 
    display: none; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: #000; 

    opacity: .5; 
    filter: alpha(opacity=50); 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
} 
#message_box { 
    width: 300px; 
    height: 150px; 
    background: #fff; 

    border: 4px solid #f0f0f0; 
    border-radius: 10px; 
    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 

    position: absolute; 
    top: 100px; 
    left: 50%; 
    margin-left: -150px; 

    text-align: center; 
    z-index: 1000; 
    display: none; 
} 
#message_box input[type=button] { 
    float:left; 
    margin-left: 145px; 
} 

在如果没有,就会回复您正在使用该信息框的页面放上此行代码:

ltlMessage.Text = "<script type=""text/javascript"">var message = """"; </script>" 

然后在你想要显示消息框的函数的下面放置此代码。

ltlMessage.Text = "<script type=""text/javascript"">var message = ""Email has been sent.""; </script>" 
+0

你有没有你已经尝试过的例子? – 2011-02-03 16:59:13

回答

0

我修改了我的帖子以包含工作示例。希望这可以帮助别人。我忘记注意的一件事是在你想要消息框的页面上,你将需要一个字面控件来保存消息,在我的情况下它被称为ltlmessage。 Spafa9