Am I using indexof correctly? - javascript

I'm trying to use indexof to tell me if a string appears on page.
The function below should cycle through all checkboxes (name="comment") in my form checking for each checkbox's value within the rest of the document (only because I can't figure out how to search just one span). If the string value is found to exist elsewhere on the page, that checkbox will change css style.
function loop() {
var comment=document.forms[0].comment;
var ii;
for (ii=0;ii<comment.length;ii++) {
str=comment[ii].value;
id = comment[ii].id;
if(document.body.innerHTML.toString().indexOf(str) !=-1)
{
document.getElementById(id).style.visibility = "hidden";
}
}
}
The result is that all checkboxes turn "hidden". I thought the problem was the checkbox finding its own value in the HTML, but the same happens when I search for nonsense.
Am I using indexof incorrectly? Can anyone point out how and where? I don't want to use window.find.
To elaborate:
Checkbox 1 value is "A IS FOR APPLE". Check the page for the string "A IS FOR APPLE". If found, make checkbox 1 hidden. Go to checkbox 2 and repeat.

If I understood what are you trying to do, I think a better approach should be something like this:
function loop() {
var inputs = document.getElementsByTagName("input");
var span = document.getElementsById("txtHint");
for(var i = 0; i < inputs.length; i++) {
//Let's check only the checkbox with the name comment
if(inputs[i].name == "comment" && inputs[i].value == span.innerText) {
inputs[i].style.visibility = "hidden";
}
}

Related

Check if display is none using Javascript

I'm using javascript and want to hit a button however if the button is "display:none" then I would like to skip it.
So currently I have this code:
var sf = document.querySelectorAll(input.button")[0];
Now as an example there may be other "input.buttons" on the page that are set to "display:none", I would like to skip these and only click on the visible one.
I appreciate any advice.
var sf = document.querySelectorAll(input.button")[0];
There is problem in above statement. document.querySelectorAll(input.button")[0] will return an empty array if you want to select an input of type button use the following
var sf = document.querySelectorAll("input[type='button']"); // array of button
var sf = document.querySelectorAll("input[type='button']").[0]; // first index element
assume you sf is an array
for (var i = 0; i < sf.length; i++) {
if (sf[i].style.display != "none") {
console.log(elem[i])
}
}
To check for display: none in jquery is using sub-selectors (usually called) :visible.
if(document.getElementById("id").is(':visible')){
// YES, ITS WORKING..!
}

Looping through a ASP.NET Listbox with Javascript not working

I'm trying to loop through an ASP.NET listbox with Javascript, but I'm getting a null object or undefined when it hits the lboxRight variable in the for loop. Here's what I have.
function save() {
var containsTypeA = false;
var containsTypeB = false;
var containsType = false;
var lboxRight = $get('<%=lboxRight.ClientID %>').value;
if (lboxRight != null) {
for (var i = 0; i < lboxRight.options.length; ++i) {
if (lboxRight.options[i].value == "Type A") {
containsTypeA = true;
}
if (lboxRight.options[i].value == "Type B") {
containsTybeB = true;
}
}
containsType = true;
}
}
There's an onclick event mapped to when the save button is pressed that calls this function. Am I doing this the right way to look at the listbox and tell me if it has this specific value in it? My intention is for the listbox to contain Type A as a value and then when it loops through the listbox, if it finds that value within the list it will set that variable to true for some other logic. Visual Studio seems to complain about the for loop line, what am I doing wrong here? I am using the exact same loop written elsewhere and it works fine, so I am not understanding why this one isn't working.
Is there anything wrong with this as I have written it?
If it is complaining about something being null or undefined on the for loop line I would check to see what lboxRight.options is since you already check lboxRight.
Actually it wouldn't make sense for options to exist since lboxRight is being set to the value of the select not the select.
Try changing
var lboxRight = $get('<%=lboxRight.ClientID %>').value;
to
var lboxRight = $get('<%=lboxRight.ClientID %>');

Javascript form validation

I'm wondering, Is there a JavaScript command (whats the proper name for the thing im looking for?) where I can select all input boxes in a form rather than just one?
E.g:
function checkform(id){
var theForm = document.getElementById( id );
if (theForm.surname.value == '') {
alert( "you didn't type in your surname");
theForm.surname.focus();
return false;
}
else if (theForm.surname.value.length == 0) {
alert( 'You\'ve left some of the fields blank' );
theForm.surname.focus();
return false;
}
return true;
}
I have this code. The purpose of it is that it checks each input box in the form to see if information has been entered, and if it hasn't, an alert appears when the user submits the form.
Is there a way I could change this piece of JavaScript in order to check every input box and not just the surname one (as seen in the example).
The method getElementsByTagName can give you all the inputs, the elements property will hold a NodeList of all the controls in a form.
var nodeList = theForm.getElementsByTagName('input');
or
var nodeList = theForm.elements;
I think you need the document.getElementsByTagName() method for this one. You could link this up with your current function like so:
var inputs = document.getElementsByTagName('input'), // get all input tags in the document
i = 0, // set counter to zero
l = inputs.length; // get number of inputs you have found
for (i; i < l; i += 1) { // loop through the inputs you have found
checkform(inputs[i].id); // send the id of each input to the `checkform` method
}
Of course you might want to rewrite the function you have to make it more efficient, but you could potentially drop this straight into your code (outside the checkform function) and it should do what you want.

How to get the option tag selected in the function parameters?

My aim is dynamically setting the option tag's default display.
I want to create a function,and give it two variables as parameters.Like this function(para1, para2) and the first parameter is the option tag,the second is a value.If the first parameter's value or id equals the second value,this option tag will be set to default display.
I want to know how to write the first expression in brackets.I have used document.getElementsByTagName(option) and others,but they are all wrong.
Though I am not sure exactly what you are looking, this is my best guess with jQuery solution
Assuming
para1 - id of the dropdown
para2 - value which should be selected in dropdwon
You can use .val
$("#tagId").val(desiredValue);
in your case it will be like
$("#para1").val(para2);
In javascript
var index;
var dd = document.getElementById('para1');
for (var i = 0; i < dd.options.length; i++) {
if (dd.options[i].text === para1) {
index =i;
break;
}
}
dd.options[index].selected = true;

Javascript function not getting a value from an input box and loop through an array

im trying to gather an amount from a input box and then tick a certain amount of boxes which is an array.
this is what i got so far and it doesnt work :S
function checkAmount(ting) {
var boxes = document.getElementsByTagName("input");
for (var i = 0; i < ting.value; i++) {
if (boxes[i].name == "vote[]") {
boxes[i].checked = true;
}
}
}
And im calling it with this:
uncheckAll();
checkAmount(document.getElementsByName(\'ammount\'));
getElementsByName returns an array and your function is expecting a single element, you need to access the first element like this:
checkAmount(document.getElementsByName(\'ammount\')[0]);
Change the ting.value to boxes.length in the for loop:
function checkAmount(ting) {
var boxes = document.getElementsByTagName("input");
for (var i = 0; i < boxes.length; i++) {
boxes[i].checked = (boxes[i].name == "vote[]") ;
}
}
Try this:
boxes.item(i).checked = checked
sorry not sure how to insert javascript into the post
are you posting your real code?
If so, you realize that you are spelling 'amount' wrong in your function call?
From your statement "gather an amount from an input box" I think you expect ting to be a number entered into a text box and so you are calling a function that expects a number with a value that should resolve to an array of form element objects?
var m = document.getElementsByName("amount");
m will be an array!
in other words, it might work better if you made sure you were passing a number when you call checkAmount:
checkAmount(documents.forms[0].amount.value)
or:
checkAmount(documents.getElementsByName("amount")[0].value)
It would help a lot if you post the actual HTML and actual javascript code.
There are several problems with the code you posted, as indicated by the previous answers and replies. Try something like this:
function checkAmount(ting) {
var boxes = document.getElementsByTagName("input");
for (var i = 0; i < ting.value && i < boxes.length; i++) {
if (boxes[i].name == "vote[]") {
boxes[i].checked = true;
}
}
}
Called like this:
uncheckAll();
checkAmount(document.getElementsByName(\'ammount\')[0]);
Now you are safe from array out of bounds errors no matter the value typed in the input field and the call to checkAmount should work.
Try using
checked=checked
instead of
checked=true

Categories

Resources