jquery find and replace string inside a variable

Question

I've been searching for ages and can't seem to find an answer to what I would think is quite a simple question. I've used .clone() to make a copy of a li containing several form fields and then i'm inserting it at the beginning of the form. This works fine.

What I am trying to do is find and replace all instances of ROWID with variable i

<ul class="form">
<li class="hide">
    <ol class="form">
        <li><label for="cat_id_ROWID">Category:</label>
            <select id="cat_id_ROWID" name="cat_id[]">
                <option>...options...</option>
            </select>
        </li>
        <li>
            <label for="value_ROWID">Value:</label>
            <input id="value_ROWID" name="value[]">
        </li>
        <li>
            <label for="description_ROWID">Description:</label>
            <textarea id="description_ROWID" name="description[]"></textarea>
        </li>
    </ol>
</li>
</ul>

Any my jquery is:

 var newitem = $('li.hide').eq(0).clone();
 newitem.removeClass('hide').addClass('row');
 $(newitem).insertBefore('ul.form li:first');

I'm trying to do something like $(newitem).replace('ROWID',i); but it doesn't work. Any help would be appreciated! Thanks.

nachito · Accepted Answer · 2012-02-19 17:44:12Z

3

Your newitem variable is a jQuery object, not a string, so a simple .replace won't work. You'll have to select the elements you want within newitem and change the attributes (which are strings) individually.

var $newitem = $('li.hide').eq(0).clone();
$('[for$="ROWID"]', $newitem).each(function () {
    $(this).attr('for', $(this).attr('for').replace('ROWID', i));
});
$('[id$="ROWID"]', $newitem).each(function () {
    $(this).attr('id', $(this).attr('id').replace('ROWID', i));
});
$newitem.removeClass('hide').addClass('row');
$newitem.insertBefore('ul.form li:first');

answered Feb 19, 2012 at 17:44

nachito

7,0352 gold badges28 silver badges44 bronze badges

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

Comments

Neysor · Accepted Answer · 2012-02-19 17:40:29Z

2

newitem is the li and not the attribute. Try someting like this:

newitem.html(newitem.html().replace("ROWID",i));

answered Feb 19, 2012 at 17:40

Neysor

3,91511 gold badges36 silver badges67 bronze badges

3 Comments

Neysor Over a year ago

you also can only edit the attributes via attr() function :) its nearly the same way!

leejmurphy Over a year ago

thanks for your reply, unfortunately this hasn't worked for me. @nachito 's solution has though. Is it possible to flatten the jQuery object so that it's just html/text rather than a series of objects? Is that what you're trying to do with .html()?

Neysor Over a year ago

if you're using .html() you get everything in your container as html or if you use .text() as text. then you can use every string manipulation you want. then you can insert it again. Just look at api.jquery.com/html and api.jquery.com/text

Collectives™ on Stack Overflow

jquery find and replace string inside a variable

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest