Passing Multiple arguments to jQuery Function

Question

I have a function which gets the data from various input ( multiple values ) and populate into a table.

Here is the jquery snippet :

var row =1   
$("input[name='product_id[]']").each(function() {               
        $rows[row].cells[0].innerText = $(this).val();      
        row = row+1;
    });

    row=1;
    $("input[name='product_name[]']").each(function() {             
        $rows[row].cells[1].innerText = $(this).val();      
        row = row+1;
    });

    row=1;
    $("input[name='manufacturer[]']").each(function() {             
        $rows[row].cells[2].innerText = $(this).val();      
        row = row+1;
    });

    row=1;
    $("input[name='composition[]']").each(function() {              
        $rows[row].cells[3].innerText = $(this).val();      
        row = row+1;
    });

I was wondering if I can combine multiple iterators into a single iterator ?

Thanks Kiran

CertainPerformance · Accepted Answer · 2019-03-06 06:10:45Z

4

You can join the selectors by commas:

$("input[name='product_id[]'], input[name='product_name[]'], input[name='manufacturer[]'], input[name='composition[]']")
.each(function() {
  // ...
});

To be more DRY, use an array:

const selectorStr = ['product_id', 'product_name', 'manufacturer', 'composition']
  .map(str => `input[name='${str}[]']`)
  .join(',');
$(selectorStr).each(function() {
  // ...
});

If you need row to be 1 in all but the first iteration, then:

['product_id', 'product_name', 'manufacturer', 'composition']
  .forEach((str, i) => {
    if (i !== 0) {
      row = 1;
    }
    $(`input[name='${str}[]']`).each(function(){
      // etc
    });
  });

edited Mar 6, 2019 at 6:10

answered Mar 6, 2019 at 6:05

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

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

3 Comments

Mrunmay Deswandikar Over a year ago

Good one. But the variable row value will differ. It should be initialized to 1, before each separate iteration starts, as he added in question. In your case the common row value will be shared in all iterations

CertainPerformance Over a year ago

OP didn't describe his use of rows or show how / if it's relevant to the iterations, but if needed, use forEach and check the current index

Mrunmay Deswandikar Over a year ago

Yes he didn't mentioned, but he has initialized row to 1 before each iteration. But now your updated answer for row logic looks perfect :)

Mrunmay Deswandikar · Accepted Answer · 2019-03-06 06:11:36Z

4

Create a common function, this will help your row logic, which gets value 1 before each iteration

function iteratorOperation(){
}

And then pass this to the iterators,

$("input[name='product_id[]']").each(iteratorOperation);

row=1;
$("input[name='product_name[]']").each(iteratorOperation);

row=1;
$("input[name='manufacturer[]']").each(iteratorOperation);

row=1;
$("input[name='composition[]']").each(iteratorOperation);

edited Mar 6, 2019 at 6:11

answered Mar 6, 2019 at 6:04

Mrunmay Deswandikar

18913 bronze badges

Comments

Maheer Ali · Accepted Answer · 2019-03-06 06:06:01Z

2

Use , to separate multiple selectors

$("input[name='product_id[]'],input[name='product_name[]'],input[name='manufacturer[],input[name='composition[]']").each(function() {               

});

answered Mar 6, 2019 at 6:06

Maheer Ali

36.5k8 gold badges53 silver badges83 bronze badges

Comments

mplungjan · Accepted Answer · 2022-01-22 06:16:18Z

2

Perhaps this is interesting?

note the escaping of the []

const fieldNames = ["product_id[]", "product_name[]", "manufacturer[]", "composition[]"];
const selector = fieldNames.map(item => `input[name='${item}\\\\[\\\\]']`).join(", ")
$rows.each((row) => { 
  $(selector).each(() => {
    let idx = fieldNames.indexOf(this.name)
    row.cells[idx].innerText = $(this).val(); // jquery object or collection?
  })
})

edited Jan 22, 2022 at 6:16

answered Mar 6, 2019 at 6:54

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Collectives™ on Stack Overflow

Passing Multiple arguments to jQuery Function

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related