How to receive array data using this code?

Question

This is live search script. Livesearch works fine but can't get every array data. I would like to get each searchComponent's 'name' and 'code' and 'location' data.

UPDATE

Here is js whole code.

https://jsfiddle.net/blueink/wyejqhsz/3/

I already have $data array so I would like to ADD those items INTO IT.

<div id="searchComponent-1">
    <div class="btn-group">
        <input type="text" name="search" placeholder="input 1" class="search form-control" size="3000"
               onkeypress="return event.keyCode!=13"/>
        <span class="searchclear glyphicon glyphicon-remove-circle"></span>
    </div>

    <ul class="list-group result"></ul>
</div>
<div id="searchComponent-2">
    <div class="btn-group">
        <input type="text" name="search" placeholder="input 2" class="search form-control" size="3000"
               onkeypress="return event.keyCode!=13"/>
        <span class="searchclear glyphicon glyphicon-remove-circle"></span>
    </div>
    <ul class="list-group result"></ul>
</div>

jQuery

searchWrapper.find('.result').after('<input type="hidden" name="name" value="' + name + '">');
searchWrapper.find('.result').after('<input type="hidden" name="code" value="' + code + '">');
searchWrapper.find('.result').after('<input type="hidden" name="location" value="' + location + '">');


$(document).ready(function () {
   //then apply same method on each element
    $("#searchComponent-1").searchAndDisplay(); 
    $("#searchComponent-2").searchAndDisplay();
}

Rajan · Accepted Answer · 2019-04-06 18:25:10Z

1

I assumed your dom will have input data like this:

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name2">
    <input type="hidden" name="code" value="Code2">
    <input type="hidden" name="location" value="Location2">
  </ul>

You can do as the following to get the desired result:

$(document).ready(function() {
  var result_array = []
  $('.result').each(function() {
    var name = $(this).find("input[name='name']").val();
    var code = $(this).find("input[name='code']").val();
    var location = $(this).find("input[name='location']").val();
    result_array.push([name, code, location])
  });

  console.log('As Array:')
  console.log(result_array)

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="searchComponent-1">

  <div class="btn-group">
    <input type="text" name="search" placeholder="input 1" class="search form-control" size="3000" onkeypress="return event.keyCode!=13" />
    <span class="searchclear glyphicon glyphicon-remove-circle"></span>
  </div>

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name1">
    <input type="hidden" name="code" value="Code1">
    <input type="hidden" name="location" value="Location1">
  </ul>
</div>
<div id="searchComponent-2">

  <div class="btn-group">
    <input type="text" name="search" placeholder="input 2" class="search form-control" size="3000" onkeypress="return event.keyCode!=13" />
    <span class="searchclear glyphicon glyphicon-remove-circle"></span>
  </div>

  <ul class="list-group result">
    <input type="hidden" name="name" value="Name2">
    <input type="hidden" name="code" value="Code2">
    <input type="hidden" name="location" value="Location2">
  </ul>
</div>

If you want your result in One Dimensional Array you can do:

result_array.push(name, code, location)

Output will be:

["Name1", "Code1", "Location1", "Name2", "Code2", "Location2"]

edited Apr 6, 2019 at 18:25

answered Apr 6, 2019 at 18:20

Rajan

1,49714 silver badges28 bronze badges

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

7 Comments

charlietfl Over a year ago

<input> is invalid child of <ul>

Rajan Over a year ago

@charlietfl Nevertheless the HTML does not throw an error if you have input inside the ul Right? and he seems to have input inside the ul

mikancode Over a year ago

@Rajan Thank you very much your help. I appreciate alot. However still I couldn't get item data. that becase I didn't show whole js code I think. I update whole js scripts above. Could you look at it please? and I also add I already have $data array I woud like to add this items data into it. Thank you again your help.

Rajan Over a year ago

@mikancode I am still not clear what exactly you want. I have working code for your Case: Fiddle Please Update your Question or let me know what do you want. And when do you want (eg: after search or after you select any item)

mikancode Over a year ago

@Rajan Thank you again. I need time I'm slow understading so Could you wait little more. I will contact you again. Thank you for all of your help.

|

Collectives™ on Stack Overflow

How to receive array data using this code?

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related