i have some interesting side effects here in https://perchance.org/simple-txt2img where adding another row of images refreshes all the images and calling update() only re-generates the last row of images.

how do i add a row of images without re-generating the existing ones? for example if i want to generate until i like the image then create another row to generate more until i like those.

you are viewing a single comment's thread
view the rest of the comments
[–] 2 points 1 year ago

So, on your:

<div class="flex">[output]</div>

You need to enclose the [output] in a div for the Update Rows to work since it looks for the number of div on the .flex container like so:

<div class="flex"><div>[output]</div></div>

Also, you changed the start of the 'for loop' on the update rows with let i = numRows - 1 which would mean it can only update one row since the loop terminates if it exceeds the numRows. Just use the let i = 0.

If you want to only update the 'last' row, you can do:

function updateLast() {
  let lastRow = [...document.querySelector(".flex").querySelectorAll('div')].at(-1)
  lastRow.innerHTML = output
}
  • source
  • parent