Constructing an array of objects

Question

I need to submit a Collection (set, list, array) with objects that consists of:

id, phoneNumber, phoneType

I have a bunch of divs, here's some example HTML:

<div id="f9" class="facilityBox">
    <div style="float:left;">
        <label>BRANCH</label>
    </div>
    <div style="float:right;"> <a href="#" onclick="return Location.submitUpdateFacility(9)'">Save changes</a> 
    </div>
    <div class="phoneSet">
        <input type="text" value="787-788-1111" class="phones" name="number" />
        <select class="phoneType" name="type">
            <option selected="selected" value="PHONE">Phone</option>
            <option value="FAX">Fax</option>
        </select>
        <input type="hidden" value="6" class="phoneId" name="id" />
    </div>
    <div class="phoneSet">
        <input type="text" value="787-795-4095" class="phones" name="number" />
        <select class="phoneType" name="type">
            <option value="PHONE">Phone</option>
            <option selected="selected" value="FAX">Fax</option>
        </select>
        <input type="hidden" value="106" class="phoneId" name="id" />
    </div>
</div>

This div's id will be f+identifier, so for now it's f9

the js I have so far is:

Location.submitUpdateFacility = function (facilityId) {
    $("#updateFacility input[name=index]").val(facilityId);
    var id = facilityId;
    var phones;
    $("#" + id + " .phoneSet").each(function () {
        phones += {
            id: $(".phoneId input[name=id]").val(),
            phoneNumber: $(".phones input[name=number]").val(),
            phoneType: $(".phoneType select[name=type]").selected().val()
        };
    });    
};

My problem is upon Firebug/Chrome console debugging, it does not go into the loop and thus no array is ever created. What am I doing wrong?

Considering it should iterate over #f9 .phoneSet which should be every div with class phoneSet under div with id f9, I'm not convinced this would make any difference. Furthermore I have no need for the index anywhere, so yea. I'm not particularly sure what element does though. — Nimchip
– Nimchip, Commented Jul 24, 2013 at 15:50
@MelanciaUK: So, in HTML5 you're now allowed to have IDs starting with numbers. Still a bad idea from a compatibility standpoint, but it is allowed. — Colin DeClue
– Colin DeClue, Commented Jul 24, 2013 at 18:23

Chris · Accepted Answer · 2013-07-24 15:51:53Z

1

The problem looks to be that you are passing "9" in as the function parameter that is then being converted to a jquery selector as "#" + id + " .phoneSet". This is generating "#9 .phoneSet" which is incorrect.

You should be using "#f" + id + " .phoneSet".

It should also be noted that the other selectors that you use (eg ".phoneId input[name=id]") may also need correcting before this works fully as you expect.

answered Jul 24, 2013 at 15:51

Chris

27.7k7 gold badges77 silver badges94 bronze badges

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

2 Comments

Nimchip Over a year ago

it seems I did miss that f... christ, and to think i've been at this for at least 2 hours.

Chris Over a year ago

@Nimchip: Its what I call "Code blindness". You've been looking at the code long enough that you knew that the f was there so you didn't actually look closely at the code to ensure that it actually was. :)

Collectives™ on Stack Overflow

Constructing an array of objects

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related