只有当parsley.js的警报激活时,才会出现警告框
Alert Box appear only when alerts from parsley.js are active
我正在使用Bootstrap和parsley.js(用于表单验证)所有工作都很好,除了我现在有错误消息显示在警报(Bootstrap)现在警报框显示在屏幕上是否有错误。我希望它出现只有当有错误和消失时,没有任何错误从欧芹。js。我试着研究这个问题,发现了一些隐藏警报框的代码,但没有一个与Parsley.js的警报一起工作。我输入了我自己的Javascript,下面认为我可以让它工作,它没有(显然)。我应该改变什么?我应该把javascript全部扔到一起,然后做点别的吗?我真的很喜欢每个警报出现在它自己的警报框中,一个堆叠在另一个的顶部。我创建了一个jsFiddle
两部分问题
-
使警报框只在内部有错误时出现。
-
让Parsley.js传递的每个警报出现在它自己的警报框中(一个一个堆叠在一起)
尝试Javascript:
var x = document.getElementById("ol-error-container").innerHTML
if (x == "")
{
document.getElementById("error-container").className +=" hide";
}
else
{
document.getElementById("error-container").className =" alert";
}
Html表单代码:
<form class="form-horizontal well" data-validate="parsley" method="post">
<div class="control-group">
<input type="text" class="input-xlarge" id="fullName" placeholder="Full Name" data-required="true" data-error-container="ol#ol-error-container li.error-message" data-error-message="Please provide your name!">
</div>
<div class="control-group">
<input type="text" class="input-xlarge" id="email" placeholder="E-mail Address" data-required="true" data-type="email" data-error-container="ol#ol-error-container li.error-message" data-error-message="You must provide a valid Email Address">
</div>
<div class="control-group">
<input type="text" class="input-xlarge" id="phoneNumber" placeholder="Phone Number" data-required="true" data-type="phone" data-error-container="ol#ol-error-container li.error-message" data-error-message="You must provide a valid US Phone Number">
</div>
<div class="control-group">
<textarea cols="5" class="input-xlarge" id="question" placeholder="Question/Comments" data-required="true" data-minlength="6" data-maxlength="200" data-error-container="ol#ol-error-container li.error-message" data-error-message="Please provide a message that is 6-200 characters in lenght."></textarea>
</div>
<div class="control-group">
<div class="input-append">
<input class="input-medium" id="priority" type="text" disabled>
<div class="btn-group" data-required="true">
<button class="btn dropdown-toggle" data-toggle="dropdown">Priority <span class="caret"></span>
</button>
<ul class="dropdown-menu" id="selectPriority">
<li><a onclick="document.getElementById('priority').value='High'">High</a>
</li>
<li><a onclick="document.getElementById('priority').value='Normal'">Normal</a>
</li>
<li><a onclick="document.getElementById('priority').value='Low'">Low</a>
</li>
</ul>
</div>
</div>
</div>
<div class="control-group">
<button type="submit" class="btn btn-primary">Submit</button>
<input type="reset" class="btn" value="cancel">
<hr>
<p class="muted"><small>We will never sell or provide your information to anyone!</small>
</p>
</div>
HTML警告框代码:
<div class="alert" id="error-container">
<ol id="ol-error-container" style="list-style-type:none">
<li class="error-message" style="list-style-type:none"></li>
</ol>
应该是x == ""
而不是x = ""
相关文章:
- chrome扩展更改主机/域警告
- 激活chrome上的chrome.notifications对象
- 提示使用服务器端事件处理程序激活JavaScript
- 如何从外部页面激活非默认引导选项卡
- 选项卡侦听器未被来自后台脚本的消息激活
- 基于localStorage的Meteor激活模板
- 如何永久停止jshint'只读'警告/错误
- 如何通过按键激活按钮应用CSS效果
- JShint-.jshintrc中的ES6有esversion,但仍收到警告(使用atom)
- 在BoilerplateJS浏览器加载所有脚本(在其他模块中),而不考虑激活的模块
- Webpack UglifyJS仍在发出警告消息
- 我必须点击两次才能激活任何按钮操作(离子/角度)
- 流星:点击激活其他模板
- 我确实有一个表单,如果用户输入了输入,它应该检查否定或空的输入框,并抛出一条警告消息
- 关闭在加载时激活,而不是复选框更改
- (取消)使用单独的复选框激活复选框列表
- 访问令牌facebook未激活
- React Router一直给我一个警告:你不能更改<路由器路由>
- 为什么Grunt Copy给了我一个'undefined不是函数'警告
- 只有当parsley.js的警报激活时,才会出现警告框