Одна универсальная функция для JS POST AJAX

Question

Я использую функцию "$ .post" в Javascript для отправки переменных в файл php, а также для получения вывода из php и отображения его на странице.

Пока я получил> 30 повторяющихся блоков аналогичных кодов для каждой страницы, что кажется не очень эффективным:

  $(document).on('click', '#forgotpass', function() {
    var forgotpwd_email = $('#emailreg').val();
    ....
    $.post('include/forgotpwd_link.php', {
        forgotpwd_email: forgotpwd_email,
        ....
    }, function(a4) {
        $(".loginright").html(a4);
    });
  });

Где:

# Forgotpass - идентификатор кнопки, которая активирует скрипт

#emailreg - идентификатор поля со значением, которое будет отправлено в php файл

.loginright - класс div, в который я помещаю ответ

Каждый раз идентификатор кнопки, идентификатор поля, количество полей и переменных и php имя файла изменяются. Любой способ создать функцию с изменяющимся числом полей, которая может быть активирована, например, как показано ниже?

post_function('#button_id', '{variable1, variable2}', 'div with response from file_name.php','file_name.php');

Основная проблема в том, что количество отправляемых переменных не определено ... это может быть от одного до пятнадцати.

Answer 1

Спасибо El_Vanja за подсказку.

В конце я создал следующую функцию:

function ajax_post(variables, response_selector, phpfile) {
        $.each(variables, function(key) {
          variables[key] = $('#'+key).val();
        });
        $.post(phpfile, variables, function(response) {
            $(response_selector).html(response);
        });

}

и для ее вызова я добавляю входные идентификаторы (т.е. # var1 и # var2 ) в переменные объект:

var variables = {var1 : '', var2 : ''};

и вызов функции:

ajax_post(variables, '.wrapper', 'test.php');

где

переменные - объект с ID входов (также используется в качестве имени переменной)

.wrapper - div, где я хочу разместить ответ от test. php file