引导模式:未定义
Bootstrap Modal: Undefined
我试图在我的网站上添加一个模态,当表单的"名称"字段为空时,该模态会出现,以通知用户。
到目前为止,我拥有的是:
<div id="myModal-winner" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">There is a Problem!</h4>
</div>
<div class="modal-body">
<p>Please Enter Name of Winner.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-info" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
如果Name为空,则应显示模态的JS:
//when user clicks on the "submit" button
form.submit({point: point}, function (event) {
//prevent the default form behavior (which would refresh the page)
event.preventDefault();
//form validation
if( !$("input[name=name]", this).val() ) {
$("#myModal-winner").modal('show');
}
//put all form elements in a "data" object
var data = {
name: $("input[name=name]", this).val(),
address: $("textarea[name=address]", this).val(),
about: $("textarea[name=about]", this).val(),
month: $("select[name=month]",this).val(),
year: $("select[name=year]",this).val(),
lat: event.data.point.overlay.getPosition().lat(),
lon: event.data.point.overlay.getPosition().lng()
};
trace(data)
//send the results to the PHP script that adds the point to the database
$.post("addwinner.php", data, tidy_maps.saveStopResponse, "json");
但控制台返回:Uncaught TypeError: undefined is not a function
,在线:
$("#myModal-winner").modal('show');
这是带有提交按钮的表单:
<div class="winner-add">
<form class="form-horizontal winner-form" method="post" style="display: none" action="addwinner.php">
<h4>Add Winner</h4>
<img src="" >
<fieldset>
<label for="name">
<span>Event Name :</span>
<input id="name" type="text" name="name" placeholder="Enter Name of Winner" />
</label>
<label for="address">
<span>Description :</span>
<textarea id="address" name="address" placeholder="Address of Winner"></textarea>
</label>
<label for="about">
<span>Description :</span>
<textarea id="about" name="about" placeholder="Details of Award"></textarea>
</label>
<label for="image">
<span>Upload a Photo:</span>
<input type="file" id="image" name="image" />
</label>
<hr>
<div class="form-actions">
<input name="Save" type="submit" class="btn btn-success btn-sm" value="Save">
</div>
</fieldset>
</form>
我同意Jarod的观点,看起来jQuery没有被加载。确保在引导程序的脚本标记正上方有<script src="path_to_jquery"></script>
。
或者,如果你的项目文件夹中没有jQuery,你可以从互联网上获取:<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
这是一个jQuery问题。我在这里的"MyModal赢家"中出现拼写错误:
<script type="text/javascript">
$(document).ready(function(){
$("#myModal-winner").modal('hide');
});
</script>
此外,在jQuery之前加载Bootstrap导致了2之间的冲突,所以现在我在Bootstrap之前加载了jQuery。
相关文章:
- 引导模式:未定义
- 为什么我的Mongoose DB模式之一可能是“;强制转换为未定义的“;当它的实例被放置在第二个模式中时
- 模块模式:函数未定义
- 语义 UI 模式未定义
- 揭示模块模式:对象未定义
- 模块模式中的私有方法:类型错误:未定义不是一个函数
- 为什么我的类在运行时未定义.Javascript 模块模式
- IE8 中的 IE7 模式 - 本地存储不是未定义的
- JavaScript 中介器模式;组件名称未定义
- 生成器模式应如何处理未定义的可选项
- Google闭包在高级模式下调用未定义的函数
- 当不处于编辑模式时,下拉列表中的Kendo单元格值显示为未定义
- 属性<的值无效;旅行模式>:未定义,什么
- 引导模式relatedTarget未定义
- 揭示模块模式&变量范围->异步调用返回后未定义公共对象
- javascript模块模式中未定义变量的意义何在
- JSHint投掷'未定义'显示模块模式中的警告
- 当使用IE兼容模式与剑道UI SPA应用程序时,NodeFilter是未定义的错误
- Bootstrap3模式js未定义函数
- 第一次实现模块模式变量是未定义的