0

Помогите в поиске решение проблемы.

Есть JS скрипты которые выполняют некую функцию.

function delete_estimate_position_type() {
    var estpt_tr_jqobj, estpt_action_links_td_jqobj, styep_id, authenticity_token, request_url, stya_id;

styep_id = $(this).attr("styep_id");

// Если только добавили, то удаляем и с DOM
if (styep_id == "") {
    estpt_action_links_td_jqobj = $(this).parent();
    estpt_tr_jqobj = estpt_action_links_td_jqobj.parent();
    stya_id = $("td.service-type-est-position-estimate-position-type-name>input.stya-id-for-styep", estpt_tr_jqobj).val();
    estpt_tr_jqobj.remove();
    show_stya_delete_link_if_possible(stya_id);
    remove_estpgt_if_has_no_estpt($(this).attr("estpgt_id"));
}
else {
    // Удаляем с базы данных
    authenticity_token = $("#authenticity_token").val();
    request_url = "/service_type_est_positions/" + styep_id + "/destroy_from_service_type_config";

    $.post(request_url, { authenticity_token: authenticity_token}, process_service_type_est_position_delete, "json");

}
    return false;
}



function process_service_type_est_position_delete(response_data) {
    var estpt_tr_jqobj, stya_id;

    if (response_data.status == "OK") {
        estpt_tr_jqobj = $("#styep_id_" + response_data.deleted_styep_id);
        stya_id = $("td.service-type-est-position-estimate-position-type-name>input.stya-id-for-styep", estpt_tr_jqobj).val();
        estpt_tr_jqobj.remove();
        show_stya_delete_link_if_possible(stya_id);
        remove_estpgt_if_has_no_estpt(response_data.estpgt_id);
    }
    else {
    show_error($("#styep_id_" + response_data.deleted_styep_id),
      "Kļūda dzēšot pakalpojuma veida tāmes pozīciju: " + response_data.error_text);
    }
}

Здесь выполняется удаление позиции с service_type. Проблема в том, что когда идёт удаление(функция на верху привязана к кнопке удалить), он удаляет её полностью, а так быть не должно.

Должна быть возможность восстановить. Как? Смотрите, есть вот такая функция которая делает проверку на изменение и выводит попап где спрашивается, "Продолжать без сохранения изменений?" И там 2 варианта, либо "да" либо "нет". Так вот, когда нажимаешь "да", то он не возвращает удалённые данные, а просто переходит на следующую страницу, при этом выкидывая попап.

Есть идеи как это поправить?

P.S даже если после удаления обновить страницу, то строка не вернётся которую удалили, учитывая тот факт, что мы сделали сохранение до того как удалили.

function check_form_changes(){
    $(".check_changes").click(function(){
        var link = this;
        var form_is_changed = false;
        $('form').each(function(){
            if ($(this).has_unsaved_data()) {
                form_is_changed = true;
                return false;
            }
        })

        if (form_is_changed){
            $.alerts.cancelButton = 'Nē';
            jConfirm('Продолжать без сохранения изменений?', 'Brīdinājums', function(result) {
                if (result) {

                   window.location = $(link).attr("href");

                }
            })
        }
    })
}

Добавляю код от Ruby

def destroy_from_service_type_config
    @service_type_est_position = ServiceTypeEstPosition.find_by_id(params[:id])

    @error_messages = ""

    if @service_type_est_position.destroy_without_raise
        @status = "OK"
    else
        @status = "ERROR"
        @service_type_est_position.errors.full_messages.each do |error_message|
            @error_messages += "#{error_message}; "
        end
    end

    render :layout => false

end


    def self.destroy_without_raise(id)
      destroy(id)
    rescue ActiveRecord::Rollback
      false
    end


    def destroy_without_raise
      destroy
    rescue ActiveRecord::Rollback
      false
    end
9
  • Вы хотите отменить удаление из базы данных? 16 мая 2018 в 4:35
  • @StepanKasyanenko Я хочу, чтобы когда выводился попап, при нажатии на кнопку "да", он возвращал удалённую позицию.
    – Viktor
    16 мая 2018 в 6:57
  • Вот что значит возращал удаленную позицию? Восстанавивал запись в базе данных? Или строил заново html элемент? 16 мая 2018 в 7:14
  • @StepanKasyanenko Оба, ибо восстановить html элемент будет не досаточно, т.к позиция занесена и в базу данных.
    – Viktor
    16 мая 2018 в 7:26
  • Проблема в destroy_without_raise
    – Viktor
    16 мая 2018 в 9:35

1 ответ 1

0

Предлагаю следующий принцип:

  1. Все удаляемые элементы не удаляем, а сохраняем в массив. Строчки просто прячем.
  2. При нажатии на кнопку Сохранить, отправляем ранее заполненный массив удаленных элементов на сервер для удаления.
  3. Соотвественно, пока пользователь не нажмет на кнопку сохранить, данные удалены не будут.

Пример кода.

// наши данные, на основе которого строим список
var data = [{
  name: "1"
}, {
  name: "2"
}, {
  name: "3"
}, {
  name: "4"
}, {
  name: "5"
}];
// здесь будут храниться удаленные данные
var dataDeleted = [];

//строим html
$('.content').append(data.map(m => $(`<div class="row"><div>Row ${m.name}</div><button class="delete">Delete</button></div>`).data("item", m)));

$(window).on('beforeunlod', function() {
  // если есть элементы ожидаюшие удаления - спрашиваем пользователя.
  if (dataDeleted.length)
    return "Измененные данные не сохраняться. Выйти?";
});

// можно даже реализовать функцию восстановления
function checkRestore() {
  if (dataDeleted.length === 0)
    $('#restore').prop("disabled", true);
  else
    $('#restore').prop("disabled", false);
}

// удаляем данные.
$('.delete').on('click', function() {
  var $button = $(this);
  $button.parent().hide(); //строчки никуд не удаляем - просто прячем 
  dataDeleted.push($button.parent().data('item')); // сохраняем, что удалили, в отдельный массив 
  checkRestore();
});

checkRestore();

// функция восстановления
$("#restore").on('click', function() {
  $('.delete').parent().show();
  dataDeleted = [];
  checkRestore();
});

// а вот здесь выполняем реальную работу - Отправляем на сервер запрос на удаление
$("#save").on('click', function() {
  deleteFromDB();
  // после успешного удаления желательно заново запросить данные
  $('.delete:not(:visible)').parent().remove() // в реальном коде нам это не нужно. 
  dataDeleted = [];
  checkRestore();
});

// Отправляем на сервер запрос на удаление
function deleteFromDB() {
  // Здесь отправляете запрос на удаление каждого элемента. Если можете сделать пакетное удаление - еще лучше будет
  dataDeleted.forEach(function(item) {
    // $.delete делаем AJAX запрос на удаление
  });
}
.content {
  margin: 10px;
}

.row {
  box-shadow: 2px 0 4px gray;
  margin: 10px;
  padding: 5px;
  display: flex;
  justify-content: space-between;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content"></div>

<div>
  <button id="save">Save</button>
  <button id="restore">Restore</button>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.