Accessing all input elements value attribute set in jquery

Question

I want to access all the input tags that have type="date" and value of date set

let matchedelem = $('input[type="date"]').html();  
alert(matchedelem.length);

This alerts as all the input elements whether date is set or not

My requirement is I want to select all the input elements that has value of date set, how do I modify jquery selector?

let buttonsdiv;

function maintest() {
  constructTable();
  getDOMButtons();
}

function constructTable() {
  table = $('<table>');
  let row;
  let cell1;
  let cell2;
  let header2;

  table.attr({
    "id": "testTable"
  });


  row = $('<tr>');
  table.append(row);

  header2 = $('<th>').text("Feature");
  header3 = $('<th>');
  input = header3.text("Return Date/Time");
  header3.append(input);
  row.append(header2);
  row.append(header3);

  for (i = 0; i < 3; i++) {
    row = $('<tr>');
    table.append(row);


    cell1 = $('<td>').html("cell1");
    row.append(cell1);

    cell2 = $('<td>');
    row.append(cell2);

    input = $('<input>').attr({
      "type": "date",
      "id": "input" + i
    });
    cell2.append(input);
  }

  $("#mainDiv").append(table);
}


function getDOMButtons() {

  buttonsdiv = $("<div></div>").attr({
    "id": "buttonsdiv"
  });
  $("<button>Save</button>").attr({
      "value": "Save",
      "id": "saveButton"
    })
    .appendTo(buttonsdiv).click(function() {
      parseDOM();
    });

  $("#mainDiv").append(buttonsdiv);
}

function parseDOM() {
  $(document).ready(function() {
    let divs = $('input[type="date"]');
    alert(divs.length);
  })
}

table {
  display: unset !important;
  border-collapse: collapse;
}

td,
th {
  border: 1px solid black;
  padding: 10px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<body onload="maintest()">
  <div id="mainDiv"></div>
</body>

Can you keep your selector but after selection do a filter? If yes, then maybe this solves for you: $('input[type="date"]').filter((i,el) => el.value != ""); — Calvin Nunes
– Calvin Nunes, Commented Feb 11, 2020 at 19:19

Henrique · Accepted Answer · 2020-02-11 19:44:46Z

1

Try this:

$(function() {
  $('button').click(function() {
    $('body').find("input[type='date']").each(function(i) {
      console.log($(this).val());
    });
  });
});

<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  #1 <input type="date" name="date1" /><br> #2 <input type="date" name="date2" /><br> #3 <input type="date" name="date3" /><br>
  <button>Submit!</button>
</body>

answered Feb 11, 2020 at 19:44

Henrique

485 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Accessing all input elements value attribute set in jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related