我使用ASP.NET,Bootstrap和jQuery来显示和编辑数据。
ASP.NET代码搜索并返回数据,然后更新围绕更新数据的控件的更新面板。
我在更新面板外部有一个HTML按钮,它将Bootstrap选项卡从tab(0)移动到tab(1)。
如果在搜索数据之前按下按钮,onclick事件将会触发,我收到警告,表示我尚未完成所有必需的数据。
如果我搜索数据并更新更新面板,则onclick事件不会触发。
如果我点击页面上的任意位置然后按下按钮,则会触发onclick事件并移至下一个标签页。
在Chrome中,即使在更新面板更新后,onclick事件也会正确触发。
我在html的顶部有以下内容来设置jQuery函数:
<script type="text/jscript" language="javascript">
$(document).ready(startUp);
</script>
javascript在一个单独的文件中,我认为这不会导致问题。
function firstButtonClick(move) {
if (move = 1) {
$(".nav-tabs > .active").next("li").find("a").trigger("click");
}
}
我添加了参数来停止更新后运行的代码,以便用户可以实际更新它。
这是标签和按钮以及更新面板的代码:
<div id="mnuSupporterDetails" class="tab-pane fade in active">
<div class="panel panel-default">
<div class="panel-heading">
<div class="row">
<div class="col-lg-3">
Supporter Details
</div>
<div class="col-lg-8">
<div class="row">
<div class="pull-right">
<%--<a class="btn btn-default btnPrevious">Previous</a> --%>
<a class="btn btn-success" onclick="firstButtonClick(1)">Next</a>
</div>
</div>
</div>
<div class="col-lg-1">
</div>
</div>
</div>
<div class="panel-body">
<asp:UpdatePanel ID="uppContactDetails" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<script type="text/javascript">
Sys.Application.add_load(firstButtonClick(0));
</script>
<div class="row">
<div class="col-lg-3">
</div>
<div class="col-lg-6">
<div class="row">
<label for="inpSupporterNumber">
Supporter Number:</label>
<div class="input-group">
<input type="text" class="form-control summary" runat="server" id="inpSupporterNumber"
placeholder="Supporter Number" maxlength="10" />
<span class="input-group-btn">
<button class="btn btn-primary" id="btnSearchContacts" runat="server" type="submit">
Search</button>
</span>
</div>
<label for="inpTitle">
Title:</label>
<input type="text" class="form-control summary" runat="server" id="inpTitle" placeholder="Title"
required="true" maxlength="50" />
<label for="inpForename">
Forename:</label>
<input type="text" class="form-control summary" runat="server" id="inpForename" placeholder="Forename"
required="true" maxlength="30" />
<label for="inpSurname">
Surname:</label>
<input type="text" class="form-control summary" runat="server" id="inpSurname" placeholder="Surname"
required="true" maxlength="30" />
<label for="inpAddressLine1">
Address:</label>
<%--<div class="input-group">--%>
<input type="text" class="form-control summary" runat="server" id="inpAddressLine1"
placeholder="Address Line 1" required="true" maxlength="60" />
<%--<span class="input-group-btn">--%>
<%--<button class="btn btn-primary" id="btnQAS" type="button" data-toggle="modal" data-target="#mdlQAS">--%>
<%-- <i class="glyphicon glyphicon-home"></i>--%>
<%--</button>--%>
<%--</span>--%>
<%--</div>--%>
<label for="inpAddressLine2">
</label>
<input type="text" class="form-control summary" runat="server" id="inpAddressLine2"
placeholder="Address Line 2" maxlength="35" />
<label for="inpAddressLine3">
</label>
<input type="text" class="form-control summary" runat="server" id="inpAddressLine3"
placeholder="Address Line 3" maxlength="35" />
<label for="inpAddressLine4">
</label>
<input type="text" class="form-control summary" runat="server" id="inpAddressLine4"
placeholder="Address Line 4" maxlength="35" />
<label for="inpAddressLine5">
</label>
<input type="text" class="form-control summary" runat="server" id="inpAddressLine5"
placeholder="Address Line 5" maxlength="35" />
<label for="inpPostCode">
Post Code:</label>
<input type="text" class="form-control summary" runat="server" id="inpPostCode" placeholder="Post Code"
required="true" maxlength="8" />
<label for="inpCountry">
Country:</label>
<input type="text" class="form-control summary" runat="server" id="inpCountry" placeholder="Country"
maxlength="42" />
</div>
<div class="row">
<div class="form-group">
<label for="inpTelephoneNumber">
Telephone Number:</label>
<input type="text" class="form-control summary" runat="server" id="inpTelephoneNumber"
placeholder="Phone Number" maxlength="20" />
<label for="inpEmailAddress">
EMail Address:</label>
<input type="text" class="form-control summary" runat="server" id="inpEmailAddress"
placeholder="EMail Address" maxlength="100" />
</div>
</div>
</div>
<div class="col-lg-3">
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="panel-footer">
<div class="row">
<div class="col-lg-3">
</div>
<div class="col-lg-8">
<div class="row">
<div class="pull-right">
<a class="btn btn-success btnNext">Next</a>
</div>
</div>
</div>
<div class="col-lg-1 ">
</div>
</div>
</div>
</div>
</div>
任何帮助都将不胜感激。
肖恩
答案 0 :(得分:0)
你清理了缓存了吗?有时,Javascript可以在Chrome中闲逛并做一些奇怪的事情。
干杯, 绝对不是Mac
我接受道歉。