I have a grdiview in which I have added the Multi-delete functionality. Please see the code for your reference:-
<script type="text/javascript">
function ValidateAll() {
var chkselectcount = 0;
var gridview = document.getElementById('<%= grdTeacherProfile.ClientID %>');
for (var i = 0; i < gridview.getElementsByTagName("input").length; i++) {
var node = gridview.getElementsByTagName("input")[i];
if (node != null && node.type == "checkbox" && node.checked) {
chkselectcount = chkselectcount + 1;
}
}
if (chkselectcount == 0) {
alert("Please select atleast One CheckBox");
return false;
}
else {
ConfirmationBox();
}
}
function ConfirmationBox() {
var result = confirm("Are you sure, you want to delete the Users ?");
if (result) {
return true;
}
else {
return false;
}
}
</script>
Also see the button html:-
<asp:Button ID="btnDelete" runat="server" CausesValidation="false" CssClass="btn btn-danger" Text="Delete" OnClick="btnDelete_Click" OnClientClick="javascript:return ValidateAll();" />
The issue is that,
when I check the checkboxes and Click on delete button, it asks for confirmation. When I click on Cancel it still deletes the row from the Gridview as well as sql table.
What should I do for the proper working of this. ? Please suggest
I think you need to use
return ConfirmationBox();
instead of
ConfirmationBox();
So your code becomes
function ValidateAll() {
var chkselectcount = 0;
var gridview = document.getElementById('<%= grdTeacherProfile.ClientID %>');
for (var i = 0; i < gridview.getElementsByTagName("input").length; i++) {
var node = gridview.getElementsByTagName("input")[i];
if (node != null && node.type == "checkbox" && node.checked) {
chkselectcount = chkselectcount + 1;
}
}
if (chkselectcount == 0) {
alert("Please select atleast One CheckBox");
return false;
}
else {
return ConfirmationBox();
}
}
You need to remove the javascript: from OnClientClick you can use OnClientClick="return ValidateAll();"
Related
I'm creating a scenario where I need 3 radio buttons for multiple questions. I added values to the radio button and I want to add up the total points of the selected radio button and display it into a text box.
Here's is my code and I'm having difficulties with trying to figure out why I'm getting an undefined error message.
function getSelectionPoints(selection) {
return parseInt(selection.split(",")[1]);
}
function getSelectionObj(selectionID) {
var selection = null;
if(selectionID == 1)
selection = document.getElementById("<%=selection1.ClientID %>").getElementsByTagName("input");
else if (selectionID == 2)
selection = document.getElementById("<%=selection2.ClientID %>").getElementsByTagName("input");
else if (selectionID == 3)
selection = document.getElementById("<%=selection3.ClientID %>").getElementsByTagName("input");
return selection;
}
function getTotalPoints() {
var totalPoints = 0;
var selection;
var promotionDropdown = document.getElementById("<%=dropDownPromotionTo.ClientID %>");
var promotionFromID = parseInt(document.getElementById("<%=promotionIDFromHidden.ClientID %>").value);
var promotionToID = parseInt(promotionDropdown.options[promotionDropdown.selectedIndex].value);
for (var i = 1; i <= 9; i++) {
selection = getSelectionObj(i);
if (i == 9 && (promotionFromID == 2 || promotionFromID == 3 || promotionToID == 2 || promotionToID == 3)) {
totalPoints += 0;
}
else if (selection != null) {
for (var j = 0; j < selection.length; j++) {
if (selection[j].checked) {
totalPoints += getSelectionPoints(selection[j].value);
break;
}
}
}
}
alert(totalpoints);
return totalPoints;
}
<asp:RadioButtonList ID="selection1" runat="server"
EnableTheming="True" SkinID="Black" CausesValidation="True" onchange="updateMyPoints(false, true);">
<asp:ListItem Value="1,6">Spectacular</asp:ListItem>
<asp:ListItem Value="2,4" Selected="True">Average</asp:ListItem>
<asp:ListItem Value="3,0">Needs improvement</asp:ListItem>
</asp:RadioButtonList>
JavaScript is case sensitive, use totalPoints instead of totalpoints:
alert(totalPoints);
I'm making a register page using HTML, CSS and JS and Java servlet etc. I have a monitorer() function which checks if the user has finished inputting everything before making the register button visible. But now everything works, but somewhere am getting screwed over and the button never comes back..
my button in reg.html :
<input type="submit" value="Register" class="btnSub" id="btnReg" style="visibility:hidden;"/>
javascript function monitorer()
function monitorer() {
var btnReg = document.getElementById("btnReg");
btnReg.style.visibility = "hidden";
var flag = true;
if (document.getElementById("fname").value.length >= 3) {
if (document.getElementById("lname").value.length >= 3) {
if (valiDate(document.getElementById("dob"))) {
if (document.getElementById("USN").value.length == 10) {
if (document.getElementById("passw").value.length > 5) {
var ticks = document.getElementsByClassName("checker"), i = 0;
for (i = 0; i < ticks.length; i++) {
if (ticks.item(i).innerHTML == "✔") {
alert("i val = " + i);
continue;
} else {
flag = false;
break;
}
}
}
} else {
flag = false;
document.getElementById("USN").focus();
}
} else {
flag = false;
document.getElementById("dob").focus();
}
} else {
flag = false;
document.getElementById("lname").focus();
}
} else {
flag = false;
document.getElementById("fname").focus();
}
if (flag == true) {
btnReg.style.visibility = "visible";
} else if(flag == false) {
btnReg.style.visibility = "hidden";
}}
And to help you get as good a picture as you can, a screenshot
See - all the ticks are there, the first name, last name etc are having value.length >=3 but still the register button doesn't show..
Also, I have put the monitorer() method in every input's "onBlur", "onChange" events.
Here is a link to my html file >>> reg.html
and please let me know if i can improve anything?
I have drop-down and text-box in a gridview and I am trying to check if the selected value of a drop-down is set to "No" and no comments is entered in the text-box then i want to show message. The requirement should be as long as the selected value of the drop down is set to No then comments must be entered in the text-box. My issue is that i am getting the message even if the drop-down is set to Yes or comments is provided when the drop down is set to No. Here is the code:
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var ddl = gridView.rows[i].getElementsByTagName('Select');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (ddl != null && ddl.length > 1 && ddl[0] != null && areas != null && areas.length > 1 && areas[0] != null) {
if (areas[0].type == "textarea" && ddl[0].type == "select-one") {
var txtval = areas[0].value;
var txtddl = ddl[0].value;
if (txtddl.value == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true
}
}
}
}
if (!flag) {
alert('Please note that comments is required if drop down is set to No. Thanks');
areas[i].focus();
}
return flag;
}
</script>
You can do like this:
<script>
function validate() {
var flag = false;
var gridView = document.getElementById('<%= GridView1.ClientID %>');
for (var i = 1; i < gridView.rows.length; i++) {
var selects = gridView.rows[i].getElementsByTagName('select');
//var inputs = gridView.rows[i].getElementsByTagName('input');
var areas = gridView.rows[i].getElementsByTagName('textarea');
if (selects != null && areas != null) {
if (areas[0].type == "textarea") {
var txtval = areas[0].value;
var selectval = selects[0].value;
if (selectval == "No" && (txtval == "" || txtval == null)) {
flag = false;
break;
}
else {
flag = true;
}
}
}
}
if (!flag) {
alert('Please enter comments. Thanks');
}
return flag;
}
</script>
Try this:
$('#select').on('change', function () {
var text = $(this).find(":selected").text();
var textBox = $(this).parent().filter('input [name="InputName"]');
if(text == "no" && textBox.val() =="")
{
\\display your message
}
});
I am using following code to detect whether the check box inside my gridview template field is checked or not. If none of the check box is selected then I want to show alert message.
function findCheckBox() {
var inputElements = document.getElementsByTagName('input');
var chekSelect = false;
for (var i = 0; i < inputElements.length; i++) {
var myElement = inputElements[i];
if (myElement.type === "checkbox") {
if (myElement.checked === false) {
chekSelect = true;
return true;
}
}
if (chekSelect === true) {
return true;
}
else {
alert('Please Check Atleast one record to print cheque!!!');
return false;
}
}
}
But with this code when I click on my button its showing me error message for one time even if one or more check box is checked. What I am doing wrong here. Can anyone help me please.
Your logic is slightly off. Corrected version:
jsFiddle demo
function findCheckBox() {
var inputElements = document.getElementsByTagName('input');
var chekSelect = false;
for (var i = 0; i < inputElements.length; i++) {
var myElement = inputElements[i];
if (myElement.type === "checkbox") {
if (myElement.checked) {
chekSelect = true;
break;
}
}
}
if(!chekSelect) {
alert('Please Check Atleast one record to print cheque!!!');
return false;
} else {
return true;
}
}
I've changed the .checked test, to test for it being true not false, because you want to know if at least one checkbox is checked. I also added a break, and moved the alert to outside of the for, because you won't know if there is a checkbox checked until the for completes.
Try this
function findCheckBox() {
var inputElements = document.getElementsByTagName('input');
for (var i = 0; i < inputElements.length; i++) {
var myElement = inputElements[i];
if (myElement.type === "checkbox" && myElement.checked) {
return true;
}
}
alert('Please Check Atleast one record to print cheque!!!');
return false;
}
Using JQuery:
var checked = false;
$('input:checkbox').each(function(){
if($(this).prop('checked')){
checked = true;
break;
}
});
if(!checked) alert('Please Check At least one record to print cheque!!!')
I have number of checkboxes and another checkbox for "Select All"
I want to check if the user has selected at least one checkbox. Need modification in javascript
<script language="Javascript">
function doSubmit(){
function check_checkboxes()
{
checked=false;
var c = document.getElementsByTagName('INPUT');
for (var i = 1; i < c.length; i++)
{
if (c[i].type == 'checkbox')
{
if (c[i].checked) {
return true}
else {alert("Please identify what warehouses comply:"); }
}
} //if I place my struts action here..its not working?
}
document.holiDay.command.value= 'addingApp'; //My Struts action if something checked.
document.holiDay.submit();
}
var all=document.getElementById('holiDay');
In HTML IDs should be unique, so getElementById will only return 1 element. Perhaps you could try getElementsByTagName - http://msdn.microsoft.com/en-us/library/ms536439(VS.85).aspx ?
Something like...
function check_checkboxes()
{
var c = document.getElementsByTagName('input');
for (var i = 0; i < c.length; i++)
{
if (c[i].type == 'checkbox')
{
if (c[i].checked) {return true}
}
}
return false;
}
and change your Validate function to...
function Validate()
{
if(!check_checkboxes())
{
alert("Please identify what warehouses comply:");
return false;
}
return true;
}
Select at least one check box using jqQery. Try the following code.
$('input[type="checkbox"][name="class"]').on('change', function () {
var getArrVal = $('input[type="checkbox"][name="class"]:checked').map(function () {
return this.value;
}).toArray();
if (getArrVal.length) {
//execute the code
} else {
$(this).prop("checked", true);
alert("Select at least one column");
return false;
}
;
});
(function() {
for(x in $ = document.getElementsByTagName("input"))
with($[x])
return (type == "checkbox" ? checked == true : 0)
})