Forum | Appery.io

I have a List that I want to duplicate an item and then change the text using javascript. I want to make sure that when I duplicate the item I do not lose the formatting of the list item.

How can I accomplish this using JavaScript ?

Hello,

You can change label value with JS:
Apperyio("labelName").text("new text");

here labelName - label's name

And duplicate list item like here: http://stackoverflow.com/questions/15...

Let me express my requirements differently: my requirements are:

I have a list, created with Appery designer, and I would like to dynamically add or remove items from it according to when a user types in an input field and presses a button "Add to list" .... e/g/ he Type some text in an input field and presses a button . The Event "click" for the button should invoke javascript that will add a new item to the list .. including any formatting. Appery('list').append('input text'); doesnt add any formatting ... the text is added as plain text ... I would like the list to expand as per the formatting used in the designer .
Thanks
DD

Hi Doo,

Please use following code to duplicate last item in your list component and set certain text to new item:

pre

//Note you need replace "mobilelistitem_42" with your list item component name.
var items = jQuery('[name="mobilelistitem_42"]:not([_tmpl="true"])');

var itemToDuplicate = jQuery(items[items.length - 1]);

//Duplicate an item.
var clone = itemToDuplicate.clone();

//Set text to new item
clone.find("h3").text("New text you need");

//Attach item in the list(after last item);
clone.insertAfter(itemToDuplicate);

/pre

Note please read comments in the code above.

Regards.

Thanks ... clone.find("h3").text("New text you need");
was what I was looking for ....
Im not sure about :
var items = jQuery('[name="mobilelistitem_42"]:not([_tmpl="true"])');

(I used var = itemToClone = Appery('procedure_list').find('li:first');)

what does: :not([_tmpl="true"])' mean in this context ?

Hi Doo,

I've gave you ready solution, so you don't need modify it. So you can try it.

Your code:

pre

('li:first')

/pre

gets first list item.

pre

jQuery('[name="mobilelistitem_42"]:not([_tmpl="true"])')

/pre

Code above get all list items besides template.

Regards.