[英]onclick=“confirm()” cancel button not working
I have grid , in that gird , for particular record I'm keeping active/inactive status. 我在该网格中具有grid,对于特定记录,我保持活动/不活动状态。 this is the view of that status
这是那种状态的看法
when I click active button Its showing this alert message. 当我单击活动按钮时,它将显示此警报消息。
but when I click cancel button I cant stop the action which is going to be active status. 但是当我单击取消按钮时,我无法停止将要处于活动状态的操作。
this is the html code snippet for this active/inactive buttons 这是此活动/非活动按钮的html代码段
@if (item.Status == true)
{
<button class="btn btn-xs active btn-primary" data-HEI_ID = "@item.HEI_ID" data-status = "true" onclick="confirm_active()">Active</button>
<button class="btn btn-xs inactiveColor btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "false" onclick="confirm_inactive()">Inactive</button>
}
else
{
<button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true" onclick="confirm_active()">Active</button>
<button class="btn btn-xs inactiveColor btn-primary active" data-HEI_ID = "@item.HEI_ID" data-status = "false" onclick="confirm_inactive()">Inactive</button>
}
this is script part for the alert message 这是警报消息的脚本部分
<script type="text/javascript">
function confirm_active() {
var retVal = confirm("Are you sure you want to change the status to Active?");
if (retVal == true) {
// do stuff
return true;
} else {
return false;
}
}
function confirm_inactive() {
var retVal = confirm("Are you sure you want to change the status to Inactive?");
if (retVal == true) {
// do stuff
return true;
} else {
return false;
}
}
How can I make workable cancel button 如何使可行的取消按钮
You missed the return
statement in the onclick
handler. 您错过了
onclick
处理程序中的return
语句。 As a additional note its good practice to end the function call with semi-colon 另外请注意,以分号结束函数调用是一种很好的做法
Change 更改
onclick="confirm_active()"
To 至
onclick="return confirm_active();"
Same applies to confirm_inactive()
as well. 同样适用于
confirm_inactive()
。
If you use onclick function that return any value you must write return
before function here is example 如果您使用返回任何值的onclick函数,则必须在函数之前写
return
此处为示例)
@if (item.Status == true)
{
<button class="btn btn-xs active btn-primary" data-HEI_ID = "@item.HEI_ID" data-status = "true" onclick="return confirm_active()">Active</button>
<button class="btn btn-xs inactiveColor btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "false" onclick="return confirm_inactive()">Inactive</button>
}
else
{
<button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true" onclick="return confirm_active()">Active</button>
<button class="btn btn-xs inactiveColor btn-primary active" data-HEI_ID = "@item.HEI_ID" data-status = "false" onclick="return confirm_inactive()">Inactive</button>
}
Also you can write direct confirm in your html 您也可以在您的html中写直接确认
<button class="btn btn-xs btn-default" data-HEI_ID = "@item.HEI_ID" data-status = "true" onclick='confirm("Are you sure you want to change the status to Inactive?")'>Active</button>
You need to return value to the element who is creating this event. 您需要将值返回给创建此事件的元素。 You are calling a function on click of that element, how element would know the return value of that function.
您在单击该元素时调用一个函数,元素如何知道该函数的返回值。 so instead of
confirm_inactive()
you need to use return confirm_inactive()
in on click. 因此,您需要在点击时使用
return confirm_inactive()
来代替confirm_inactive()
。
Using confirm_inactive() is just like 使用confirm_inactive()就像
function onClick(){
confirm_inactive()
}
where return confirm_inactive() is like 返回confirm_inactive()就像
function onClick(){
return confirm_inactive()
}
in first case even confirm_inactive() returns something, you will get undefined when you call onClick(). 在第一种情况下,即使Confirm_inactive()返回某些内容,调用onClick()也会使您不确定。 But in second case, when you call onClick(), it calls confirm_inactive() and returns its result.
但是在第二种情况下,当您调用onClick()时,它将调用Confirm_inactive()并返回其结果。
This example is just to understand, the problem. 这个例子只是为了理解问题。
<!DOCTYPE html>
<html>
<head>
<META HTTP-EQUIV="Content-Language" charset="UTF-8">
<script type="text/javascript" src="jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="bootstrap.css">
<style>
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>University ID</th>
<th>University Name</th>
<th>Established Year</th>
<th>Type</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>000001</td>
<td>Kelum U</td>
<td>1976</td>
<td class="privacy">Private</td>
<td class="status">
<button class='btn btn-xs btn-default confirm_active' data-HEI_ID = '@item.HEI_ID' data-status = 'true'>Active</button><button class='btn btn-xs btn-danger active confirm_inactive' data-HEI_ID = '@item.HEI_ID' data-status = 'false'>Inactive</button>
</td>
</tr>
<tr>
<td>000002</td>
<td>Wiling M</td>
<td>1977</td>
<td class="privacy">Public</td>
<td class="status">
<button class='btn btn-xs btn-default confirm_active' data-HEI_ID = '@item.HEI_ID' data-status = 'true'>Active</button><button class='btn btn-xs btn-danger active confirm_inactive' data-HEI_ID = '@item.HEI_ID' data-status = 'false'>Inactive</button>
</td>
</tr>
</tbody>
</table>
<script>
$(".status .confirm_active").on('click', function(){
var retVal = confirm("Are you sure you want to change the status to Active?");
if(retVal == true){
$(this).removeClass('btn-default').addClass('btn-primary active');
$(this).closest('.status').find('.confirm_inactive')
.removeClass('btn-danger active').addClass('btn-default');
$(this).closest('tr').find('.privacy').html('Private');
}
});
$(".status .confirm_inactive").on('click', function(){
var retVal = confirm("Are you sure you want to change the status to Inactive?");
if(retVal == true){
$(this).removeClass('btn-default').addClass('btn-danger active');
$(this).closest('.status').find('.confirm_active')
.removeClass('btn-primary active').addClass('btn-default');
$(this).closest('tr').find('.privacy').html('Public');
}
});
</script>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.