dynamic dictionary using javascript

Question

I am trying to populate dictionary object at client side which i can pass to my Action method. I am able to build the dictionary object with hard coded values however i want to create it dynamically based on the DOM elements.

Here is the how to code looks like:

<input type="text" id="t1" class="textClass" />
<input type="text" id="t2" class="textClass" />
<input type="text" id="t3" class="textClass" />
<input type="text" id="t4" class="textClass" />
<input type="text" id="t5" class="textClass" />

<input type="button" id="btnSubmit" value="Submit" />

Here is the JavaScript function with hard coded values. I am looping thru all the text boxes that has textClass. This works fine and i am able to see dictionary items in the Action method parameter.

<script type="text/javascript">

        $('.textClass').each(function (index) {
            dictionary = {

                '[0].Key': 'k1', 
                '[0].Value': 'v1',

            };


</script>

This is how i want to construct the dictionary but i am not able to figure out how do i use index and DOM element to create dictionary key and value. If i write the way i have written below, it does not construct the dictionary.

<script type="text/javascript">

        $('.textClass').each(function (index) {
            dictionary = {

                '[' + index '].Key': $(this).attr('id'), 
                '[' + index '].Value': $(this).val(), 

            };


</script>

Can someone please point me what am i doing wrong here?

David Hedlund · Accepted Answer · 2012-09-19 07:07:06Z

5

To be able to construct keys from strings, you'll need to set them accordingly:

var dictionary = {};
dictionary['[' + index + '].Key'] = $(this).attr('id');

Your currently overwriting the dictionary variable for each iteration. In your scenario, you'd want something like:

var dictionary = {};
$('.textClass').each(function (index) {
    dictionary['['+index+'].Key'] = $(this).attr('id');
    dictionary['['+index+'].Value'] = $(this).val();
});

answered Sep 19, 2012 at 7:07

David Hedlund

130k33 gold badges205 silver badges223 bronze badges

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

1 Comment

Asdfg Over a year ago

Thanks. I had it hardcoded to see if it works or not. Your answer works great. Thanks again.

Diode · Accepted Answer · 2012-09-19 07:13:35Z

0

$('.textClass').each(function(index) {

    dictionary = {};
    dictionary['[' + index + '].Key'] = $(this).attr('id');
    dictionary['[' + index + '].Value'] = $(this).val();

});

answered Sep 19, 2012 at 7:13

Diode

25.2k8 gold badges43 silver badges52 bronze badges

Collectives™ on Stack Overflow

dynamic dictionary using javascript

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related