如何在ASP.NET窗体中将引导程序的关闭按钮添加到ValidationSummary？
如何在ASP.NET窗体中将引导程序的关闭按钮添加到ValidationSummary？
提问于 2015-04-11 22:51:58
我正在尝试让asp:ValidationSummary使用Bootstrap的警告样式，并包含一个关闭按钮。样式可以工作，但没有添加close按钮。
这是我的.aspx的样子：
<asp:ValidationSummary class="alert alert-danger alert-dismissable"
ID="ValidationSummary1" ShowSummary="true" runat="server"
DisplayMode="BulletList"/>在$(document).ready，中，我尝试让jQuery添加按钮，如下所示：
$('.alert-dismissable').each(function ()
{
$(this).prepend('<button type="button" class="close"
data-dismiss="alert">×</button>');
});如果我使用常规的div元素，这就可以很好地工作，但不能使用asp:ValidationSummary。如果我检查客户端上的标记，按钮不会呈现在那里。
我还尝试了对asp:ValidationSummary进行子类化，以便在Render (HtmlTextWriter编写器)中插入标记。但结果与之前的尝试相同。
我还尝试将ValidationSummary封装在一个div中，如下所示：
<div class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert">×</button>
<asp:ValidationSummary
ID="ValidationSummary1" ShowSummary="true" runat="server"
DisplayMode="BulletList"/>
</div>它看起来在浏览器中呈现得很好，但关闭按钮会阻止ValidationSummary再次显示，因为它的父div现在是不可见的。
回答 2
Stack Overflow用户
发布于 2015-07-23 20:56:52
我认为你在这个问题上走对了路。
<div id="validationSummary" class="alert alert-danger alert-dismissable">
<button type="button" class="close" data-dismiss="alert">×</button>
<asp:ValidationSummary
ID="ValidationSummary1" ShowSummary="true" runat="server"
DisplayMode="BulletList"/>
</div>此外，您还需要处理导致验证的按钮单击，以重置可见性，然后从验证摘要中清除html。
$( "#myform" ).submit(function( event ) {
//clear the validation summary html
$("#ValidationSummary1").empty(); //this should be the ClientID not the serverID of your validation control.
//display the validation summary div
$("#validationSummary").toggle();
//you might want to remove the 'hidden' class instead of toggling the divs visibility
});Stack Overflow用户
发布于 2015-10-13 16:07:19
我认为这是最简单的方法：
var container = $('form').find('[data-valmsg-summary="true"]');
container.addClass('whatever').removeclass('if-you-want');
container.find('ul').find('li').append('<a class="close" onclick="clearConfirmation()">×</a>');
function clearConfirmation() {
var container = $('form').find('[data-valmsg-summary="true"]');
var html = container.html();
container.find('ul').html(null);
container.removeClass('alert').removeClass('alert-error');
}这是一个伪代码，只是为了给你一个概念。将clearConfirmation更改为您自己的需要，这将是很好的:)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29579222
复制相关文章
相似问题
腾讯云开发者
