0

I'm using the querySelectorAll() JS function to retrieve all elements under a datagrid table (aspx page) , that datagrid contains several checkboxes / textboxes , there's a save button which should only be enabled when the following rule is satisfied :

At least 1 checkbox needs to be checked OR at least one textbox needs to contain text ( not empty )

Is there a way to check if any of the textbox input elements returned by querySelectorAll() , has a value ?

function validate() {
            var search = document.getElementById("myGrdID").children;

            //var hasAnyText = search[0].querySelectorAll("input:valid");
            var hasAnyChecked = search[0].querySelectorAll("input:checked");

            console.log("Any check? " + hasAnyChecked.length);
        }

i'd like to avoid using Jquery , already managed to get all the checked input elements , couldn't find a way yet to find all the textboxes with values (any value not a specific string).

3Daygg
  • 63
  • 1
  • 7
  • You can use a loop through the input elements and check their value: function checkInputs() { const inputs = document.getElementsByTagName('input'); for (let i = 0; i < inputs.length; i++) { if (inputs[i].value) { return true; } } return false; } checkInputs() will return true if at least one of the input fields is filled. Alternatively, you can use `.checkValidity()` instead of `.value` to check the validity of the input field instead of it's value. – Charis Moutafidis Feb 03 '20 at 13:56
  • `const filled= search[0].querySelectorAll("input[type=text").fillter(inp => inp.value.trim()!==");` – mplungjan Feb 03 '20 at 14:01
  • @mplungjan I think you will have to use spread operator as nodeList is not exactly an array. `const textBoxes = search[0].querySelectorAll('.-textbox-selector-name'); const hasAnyEmptyText = [...textBoxes].filter(input => input.value !== '');` – naveen Feb 03 '20 at 14:05
  • Yeah I think you are correct - just a quick comment from my mobile – mplungjan Feb 03 '20 at 14:19

1 Answers1

0

Are you able to use the filter function ? 

var results = hasAnyChecked.filter(input => input.value != null)

Edit : comment below me has a point, but if you use those kind of selectors you won't be able to check multiple scenarios : 

var results = hasAnyChecked.filter(input => input.value !== null || input.value !== false) // Handles both text inputs and checkboxes
Raekh Void
  • 441
  • 3
  • 11