array push change format jquery

Question

var student = $('#student tr').find('td').find('input[type=\"text\"]');
    student.each(function(index, element) {
      var label = $(element).parent().find('span').text();
      var member = $('#student').attr('name');
      studentnames.push({
        value: $(element).val(),
        label: label,
        member: member

      });
    });

This is how i make my array. and this is the output

[{
    "value": "jackie",
    "label": "First Name",
    "member": "science club"
}, {
    "value": "chan",
    "label": "Middle Name",
    "member": "science club"
}, {
    "value": "lee",
    "label": "Last Name",
    "member": "science club"
}, {
    "value": "jr",
    "label": "Suffix",
    "member": "science club"
}, {
    "value": "Tokyo",
    "label": "City/Province",
    "member": "science club"
}, {
    "value": "Nanporo",
    "label": "Town/Municipality",
    "member": "science club"
}, {
    "value": "Sorachi",
    "label": "District",
    "member": "science club"
}, {
    "value": "1234",
    "label": "Contact Number",
    "member": "science club"
}]

how can i change it to format like

[{
    "First Name": "jackie",
    "Middle Name": "chan",
    "Last Name": "lee",
    "Suffix": "jr",
    "City/Province": "Tokyo",
    "Town/Municipality": "Nanporo",
    "District": "Sorachi",
    "member": "science club"
}]

my html table is like this

<table id="student" name="student" class="student">
    <tr>
        <td>
            <center>
                <input type="text" name="fname" class="fname" />
                <br> <span><small><i>First Name</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="mname" class="mname" />
                <br> <span><small><i>Middle Name</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="lname" class="lname" />
                <br> <span><small><i>Last Name</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="suffix" class="suffix" />
                <br> <span><small><i>Suffix</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="city" class="city" />
                <br> <span><small><i>City/Province</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="town" class="town" />
                <br> <span><small><i>Town/Municipality</i></small></span> </center>
        </td>
        <td>
            <center>
                <input type="text" name="district" class="district" />
                <br> <span><small><i>District</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <center>
                <input type="text" name="contact" class="contact" />
                <br> <span><small><i>Contact Number</i></small></span> </center>
        </td>
    </tr>
    <tr>
        <td>
            <input type="button" id="addtable" value="Add" name="" /> </td>
        <td>
            <input type="button" id="removetable" value="Remove" name="" /> </td>
    </tr>
</table>

the button add and remove has a jquery function that add the same table or remove depending on user click

North · Accepted Answer · 2015-06-11 03:08:14Z

1

var studentnames = [];
$('#checkConsole').click(function() {
    var student = $('#student tr').find('td').find('input[type=\"text\"]');

    var temp = {};
    student.each(function(index, element) {
        var label = $(element).parent().find('span').text();
        var member = $('#student').attr('name');

        temp[label] = $(element).val();
        temp['member'] = member;
    });
    studentnames.push(temp);
    console.log(studentnames);
});

Jsfiddle

answered Jun 11, 2015 at 3:08

North

1,4341 gold badge12 silver badges21 bronze badges

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

Comments

Yourway · Accepted Answer · 2015-06-11 03:05:10Z

0

we can use [] to get/set object property.

for example:

var obj = {}, key = "property1", value = "testValue";
obj[key] = value;
obj["key with space"] = "the value";
console.log(JSON.stringify(obj)); //{"property1":"testValue","key with space":"the value"}

I modify your code: http://jsfiddle.net/gtkLmgd9/

answered Jun 11, 2015 at 3:05

Yourway

216 bronze badges

Comments

Leo Silence · Accepted Answer · 2015-06-11 03:06:57Z

0

this is a simple sample you can try:

The <center> tag is not supported in HTML5. Use CSS instead.

//so the center tag you may change to another tag
var td = $('#student tr').find('center'),
arr = {};
td.each( function() {
   var label = $(this).find('i').text();
   var val = $(this).find("input[type='text']").val();
   arr[label] = val;
});

and DEMO

answered Jun 11, 2015 at 3:06

Leo Silence

1,19011 silver badges22 bronze badges

1 Comment

guradio Over a year ago

what other tag can you suggest may i use the td tag

Collectives™ on Stack Overflow

array push change format jquery

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related