I add news without reloading the page, + photo, how not to shove all the code that needs to be updated into js without reloading?

Question

AJAX

Hello.
Perhaps the title is stupid) but I thought how to form it correctly.

I add news without reloading the page, via ajax, and also add a photo to the news without reloading, but in order for the photo to appear, shove the photo output code into js, ​​through which ajax passes.

My code is like this:

<div id="photoBox">
      <? if (!empty($data['images'])) : ?>
      <div id="product_images">
        <? foreach ($data['images'] as $i => $image) : ?>
        <div class="fotoadmin" data-id="<?= $image->id ?>">
          <div class="fotoadminnn">
            <a href="/media/uploads/prozhivanie/<?php echo $image->image ?>" target="_blank">
              <img src="/media/uploads/prozhivanie/small/small-<?php echo $image->image ?>" width="150px">
            </a>
            <br>
            <a href="/admin/prozhivanie/delimg/<?php echo $image->id ?>">Удалить</a>
            <? if ($image->id != $data['image_id']): ?>
            | <a href="/admin/prozhivanie/mainimg/<?php echo $image->id ?>">Главная</a>
            <? else: ?>
            | <b>Главная</b>
            <? endif ?>
          </div>
        </div>
        <? endforeach ?>
        <input type="hidden" name="imagepos" value="" />
      </div>
      <a name="img"></a>
      <? endif ?>

    </div>

In js it looks like this:

if (d.image_is) {
              $('#photoBox').append('<div class="fotoadmin"><div class="fotoadminnn"><a href="/media/uploads/prozhivanie/' + d.image.filename + '" target="_blank"><img src="/media/uploads/prozhivanie/small/small-' + d.image.filename + '" width="150px"></a><br><a href="/admin/prozhivanie/delimg/' + d.image.id + '">Удалить</a> | <a href="/admin/prozhivanie/mainimg/' + d.image.id + '">Главная</a></div></div>');
            }

But is it really possible to do something so as not to shove everything into js, ​​but simply he took a certain id that includes all this code, let's say id = "photoBox", or it's impossible.

There was such a problem, there in the code where to make it the main one, there is an option, and so, in js how to add it correctly, otherwise when I upload a photo and it should become the main one and the main link, it becomes not clickable, but it doesn’t do that, that is does but it is not immediately visible, you have to press f5.

Here is that part of the code:

<? if ($image->id != $data['image_id']): ?>
            | <a href="/admin/prozhivanie/mainimg/<?php echo $image->id ?>">Главная</a>
            <? else: ?>
            | <b>Главная</b>
            <? endif ?>

How can I add a piece of this code to js, ​​here:

if (d.image_is) {
              $('#photoBox').append('<div class="fotoadmin"><div class="fotoadminnn"><a href="/media/uploads/prozhivanie/' + d.image.filename + '" target="_blank"><img src="/media/uploads/prozhivanie/small/small-' + d.image.filename + '" width="150px"></a><br><a href="/admin/prozhivanie/delimg/' + d.image.id + '">Удалить</a> | <a href="/admin/prozhivanie/mainimg/' + d.image.id + '">Главная</a></div></div>');
            }

Answer 1

Can be used<template>