Expand my Community achievements bar.

The 5th edition of the Campaign Community Lens newsletter is out now!

how to remove content children in webapp

Avatar

Level 3

I am building a webapp for editing email content, and have a problem when saving content child elements; I can modify the children via ctx in the webapp but, when I save via Storage object, removed children still remain. That is, if I load the following content:

 

<content>
 <child id="1" ... />
 <child id="2" ... />
 <child id="3" ... />
</content>

 

And manipulate ctx in webapp to change order of 1 and 2, and remove 3

 

<content>
 <child id="2" ... />
 <child id="1" ... />
</content>

 

After passing the Storage Object the resulting children on the stored content is 2,1,3

If I change to 3,2 the resulting children on the stored content is 3,2,3

 

So my conclusion are: child elements are inserted or updated in the storage processes - excising ones are not removed. Anyone have a workaround or tips?

 

I am thinking of doing an enabled attribute and set to false for all "excedeing" children but is seems like a very unnecessary step, and making the solution more complicated that needed.

 

For info, my code for manipulating ctx is as follows:

var ids = "2,1".split(",")
delete ctx.content.child
for(var i=0;i<ids.length;i++){
 ctx.content.appendChild(<child id={i} ... />)
}

 

6 Replies

Avatar

Community Advisor

Hello Jonas,

 

I'm not sure this is a good way to delete child elements from a XML.

Can you try to user the removeChild method instead of 'delete' instruction ?

Here a code but I'm not 100% sure (because iterate and delete from a list is always not simple... but as I use the element and not the index for removeChild, it should work ?)

var allChilds = ctx.content.getElements('child');
for(var i=0;i<allChilds.length;i++){
 ctx.content.removeChild(allChilds[i])
}

Then you can add your new child.

Or if you want to replace a child, you can use 'replaceChild' function.

If it doesn't work I'll try on my side.

 

Cedric

Avatar

Level 3

Dear Cédric, thank you for your kind reply. I get TypeError: ctx.content.getElements is not a function However I can do:

 

for(var i=0;i<ctx.content.child.length();i++){
  ctx.test.child[i] = ctx.content.child[i]
 // ctx.content.removeChild(ctx.content.child[i])
}

 

and ctx.test is populated, hower removeChild causes the same type of error. ctx.content.appendChild(<child ... />) seems to work fine thought. The mysterium deepens...

Avatar

Community Advisor

hmmmmm, sorry, I thought that ct.content was a DOMElement. My bad. So yes, I've just checked, delete works for xml list, I was totally wrong, forget my message 🙂

I think I know where your problem is : you insert the value 'i' into the id child attribute.

But i is not the value of your array(["2","1"], but the index.

So, you insert <child id="0"/> <child id="1"/> and not <child id="2"/> and <child id="1"/> as expected 😉

Just tried and saw this problem.

Changing by

ctx.content.appendChild(<child id={ids[i]}/>)

resolved the problem 😉 (or if you prefered, you can also use the foreach() instruction instead of for(), and keep the 'i')

Avatar

Level 3
My apologies, I wrote wrong when copying the code. You are right id={ids[i]} it should be, but the problem with the removed child remains. It is still included in the content after save. I have made a workaround to clear data from each child before saving, so the child is not rendered in the template. But still annoying to have blank children i a content.

Avatar

Community Advisor
So you have not anymore the child if you log it via a page after the process (via the debug) but when you save the content, children still present ? Have you checked the box 'Update the preloaded record' of the Storage activity ?

Avatar

Administrator

Hi @RBE_jonas,

Were you able to resolve this query or do you still need more help here? Do let us know.

Thanks!

page footer