JQuery: Handling name attribute

Question

    <div class="uk-sortable js-sortable-option">
        <div class="uk-margin-small-top">
            <i class="uk-icon-bars"></i>
            <input type="text" name="customfield[data][option][0]" value="First Option">
        </div>
        <div class="uk-margin-small-top">
            <i class="uk-icon-bars"></i>
            <input type="text" name="customfield[data][option][1]" value="Second Option">
        </div>
        <div class="uk-margin-small-top">
            <i class="uk-icon-bars"></i>
            <input type="text" name="customfield[data][option][2]" value="Third Option">
        </div>
    </div>
    <button class="uk-margin-small-top uk-button js-add-item" type="button">Add Item</button>

In this form, a user can create a simple list, which can be used, e.g. for a custom select input. Every item have a unique id customfield[data][option][id]. To add a item, the user can click the button. My problem is, that I have to change the name attribute for every new added item. How can I only change the id of the name-attribte?

            var sortele = $('.js-sortable-option'),
                additem = $('.js-add-item');

            additem.on('click',function(){
                ele = sortele.first();
                /** code to change name attr (e.g. to customfield[data][option][newid])*/
                sortele.append(ele);
             });

2 revs · Accepted Answer · 2014-12-14 20:42:36Z

2

to change any attribute of an element , use :

$(elm).attr("attr_name","new_val");

in this case , you should have a counter variable for using as array index.

         var counter = 0;
         additem.on('click',function(){
            ele = sortele.first();
            ele.attr("name", "customfield[data][option]["+counter+"]");
            counter++;
            sortele.append(ele);
         });

edited Dec 14, 2014 at 20:42

community wiki

2 revs
Reza-S4

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

Comments

Verhaeren · Accepted Answer · 2014-12-14 20:26:47Z

0

With jquery you can do this:

var sortele = $('.js-sortable-option'),
    additem = $('.js-add-item');

additem.on('click',function(){
    ele = sortele.first();
    myVar = "something";
    /** code to change name attr (what to do?)*/
    ele.attr("name", myVar);
 });

answered Dec 14, 2014 at 20:26

Verhaeren

1,6539 silver badges10 bronze badges

Collectives™ on Stack Overflow

JQuery: Handling name attribute

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related