skip to Main Content

I want to skip a particular input type (responsible for my row ID for editing). However, in the code below, the first console.log(formObject.rowId) returns a value, while after the serializedArray() the second console.log(formObject.rowId) returns an undefined.

function handleFormSubmit(formObject) {
console.log(formObject.rowId)
            var formObject = $("#myForm :input[value!='']").serializeArray()
            formObject.push({
              name: 'myfile',
              value: myfile
            })
console.log(formObject.rowId)
google.script.run.withSuccessHandler(createTable).processForm(formObject);
setTimeout(function() {$('#myModal').modal('hide');}, 3000);
document.getElementById("message").innerHTML = "<div class='alert alert-warning' role='alert'>Data added/updated successfully.</div>";
document.getElementById("myForm").reset();
}

Heres the HTML Element for the input type that I want to skip:

 <input type="text" id="rowId" name="rowId" value="" style="display: none">

2

Answers


  1. serializeArray ignores fields that don’t have a name:

    console.log($("#the-form").serializeArray());
    <form id="the-form">
        <input type="text" name="x">
        <input type="text" id="rowId" value="" style="display: none">
    </form>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    Notice how only the name="x" was included, not the other input.

    Login or Signup to reply.
  2. Maybe using the :not pseudo selector (or JQuery .not) is viable?

    Furthermore: the selector #myForm :input[value!=''] seems not to work. Using $(":input[value!='']") does – see snippet.

    console.log(`all input except #rowId => [${
      [...document.querySelectorAll("input:not(#rowId)")]
        .map(v => `input#${v.id}`)}]`);
    
    console.log(`all input except display:none => [${
      [...document.querySelectorAll("input:not([style*='display:none'])")]
        .map(v => `input#${v.id}`)}]`);
    
    console.log(`all input except #rowId JQuery: [${
      $.map($(":input[value!='']").not(`#rowId`), v => `input#${v.id}`)}]`);
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <form id="myForm ">
      <input type="text" id="somerowid1" value="row1">
      <input type="text" id="rowId" ame="rowId" style="display:none">
      <input type="text" id="somerowid2" value="row2">
    </form>
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search