CODEWITHSUNDEEP
javascriptjqueryajax
xXPhenom22Xx
xXPhenom22Xx

Reputation: 1275

Determine # of items in jQuery array and loop through them?

I have an AJAX script that receives a string from a mySQL query returned by PHP. This string is then parsed and put into an array in Jquery and the results are printed to the screen using .html()

The length of this array varies from 0 items to many, how would I count the items in the array then loop through and print them to the screen.

Here is my UPDATED code per the advice below, though I am still not sure if the for loop goes inside the .html() function or outside?

UPDATED CODE TO INCLUDE .each()

UPDATE 2: Replace (this) in the .html() function with the element I want the text written in and it is working partially, issue is now it is only printing the last item in the array?

UPDATE 3: Seems you can only have a single .html() function run, for instance if I add another .html() statement under the one that is returning the last item in my array it will only now echo on the screen the test value.

$("#n_detail").html(partsArray[index]+"<br />").addClass('jText').fadeTo(900,1);
$("#n_detail").html("Test").addClass('jText').fadeTo(900,1);

It will only print "Test", not the last item in the array like it was previously?

<script type="text/javascript">
       $(document).ready(function() {
        $("#primary").change(function()
            {                                
             $.post("lib/ajax_load_job_detail.php",{ _primaryid_n:$(this).val() } ,function(data)
            {
            var string = data;
            var partsArray = string.split('|');
               $("#n_detail").fadeTo(200,0.1,function() //start fading the messagebox
               {
                 $.each(partsArray, function(index) {
                        $("#n_detail").html(partsArray[index]+"<br />").addClass('jText').fadeTo(900,1);
                    });     
                });
              });
            });
           });

Sample value of array partsArray[0]12/12/2005, partsArray[1]This is a sample note from December, etc...

Upvotes: 0

Views: 442

Answers (4)

james lewis
james lewis

Reputation: 2532

If you are iterating through an array then you could use the jQuery function each().

Here's a link to the docs: http://api.jquery.com/jQuery.each/

Here's a sample from the docs using your array:

$.each(partsArray, function(index, value) { 
  alert(index + ': ' + value); 
});

EDIT - based on a comment the OP added to another answer, here's a better example using the OPs code:

$.each(partsArray, function(index, value) { 
  value.addClass('jText').fadeTo(900,1);
});

EDIT 2 - you need the part of the code that is per element of the arry inside the loop and based on your edits I think it should look like this:

$.each(partsArray, function(index) {
    $(this).append(partsArray[index]+"br />").addClass('jText').fadeTo(900,1);
}

Cheers,

James

Upvotes: 1

Joe
Joe

Reputation: 15802

Use for ... in, it's significantly faster than jQuery's $.each method, and isn't much different - it provides you with the index of the item in i, rather than the value.

for (var i in partsArray)
{
    // You can access values via...
    console.log( partsArray[i] );

    // Alternatively, this will make it an exact clone of $.each
    var value = partsArray[i];
    console.log( value );
}

Upvotes: 0

Paul
Paul

Reputation: 36329

partsArray.length

will give you the items in the array. You can loop either with 

for(var i=0;i<partsArray.length;i++){

or using the jquery addon

$.forEach

Upvotes: 2

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

Here is a typical loop structure:

var partsArray = string.split('|');
for(var x=0;x<partsArray.length;x++) {
    //...your code ...
    //x is the index., so partsArray[x] is the current element
}

Upvotes: 1

Related Questions