Переименование имен атрибутов, если они были удалены перед отправкой с помощью jQuery

ProgramBox

Переименование имен атрибутов, если они были удалены перед отправкой с помощью jQuery

Post author:admin
Запись опубликована:8 марта, 2023
Post category:Вопросы по программированию

#php #jquery #rename

#php #jquery #переименовать

Вопрос:

У меня есть список входных данных, сгенерированных jQuery :

 <input type='text' name='field["  j    "]' />
<input type='file' name='field["  j    "]' />
<textarea name='field["  j    "]' value='' />
<textarea name='field["  j    "]' value=''/>

j увеличивается, когда пользователь добавляет новое поле ввода, и оно, наконец, выглядит так :

 <input type='text' name='field[0]' />
<input type='file' name='field[1]' />
<textarea name='field[2]' value='' />
<textarea name='field[3]' value=''/>

Теперь у пользователя есть возможность удалить поле с помощью кнопки, пример: если я удалил поле [2], это приводит к следующему :

 <input type='text' name='field[0]' />
<input type='file' name='field[1]' />
<textarea name='field[3]' value=''/>

Проблема в том, что увеличенные поля больше не подходят позже, потому что вместо списка типа 0,1,2,3… У меня есть 0,1,3…

Я просто хочу изменить числовой атрибут полей после того, который был удален, чтобы соответствовать другим увеличенным полям

Еще одна вещь: пользователь может перетаскивать поля, чтобы изменить порядок. Итак, если 1 поле удалено, поле сразу после этого должно занять свое числовое место и так далее

Код для удаления поля :

 $("#deletebtn").live("click", function(){
  $(this).parent("li").remove();
});

Любая помощь будет очень признательна.

Ответ №1:

Вы можете опустить индекс, использовать только field[]

1. Спасибо за ответ, я не могу удалить индекс, потому что он понадобится мне в моем коде позже

2. В чем причина, не похоже, что между индексом и полем существует особая связь, если вы хотите переназначить индекс.

3. Да, это потому, что после отправки я выполняю некоторые манипуляции с php, чтобы установить связь между массивом рангов и входными данными, поэтому входные данные должны иметь индекс, соответствующий рангу

4. Входные данные будут иметь индекс после отправки, они будут автоматически индексироваться, начиная с 0

5. Доктор Молл прав, если вы просто отправляете их на php, нет необходимости иметь какую-либо нумерацию в полях.

Ответ №2:

Добавьте общее имя класса ко всем элементам, используя порядок:

 <input type='text' name='field[0]' class='dynamic-order' />
<input type='file' name='field[1]' class='dynamic-order' />
<textarea name='field[2]' value='' class='dynamic-order' />
<textarea name='field[3]' value='' class='dynamic-order' />

Затем, после удаления элемента, выполните итерацию по полям и задайте новый индекс:

 $("#deletebtn").live("click", function(){
  $(this).parent("li").remove();
  $( ".dynamic-order" ).each(
    function( index ) {
    this.name = "field[" index "]";
    }
  );
});

Редактировать: Я обнаружил некоторые проблемы с вашим jsfiddle, вот исправленная версия:

http://jsfiddle.net/ZKFHH/1/

По какой-то причине имена не всегда показывают самое последнее значение, вы должны проверить свойство на его наличие.

1. Спасибо за ответ! Я пробовал это, и если я удаляю поле, индексы не меняются, пример: я нажимаю удалить в поле [2], а остальные не меняют свои индексы. Есть идеи?

2. Понятия не имею, если вы не ссылаетесь на страницу, где он используется 🙂

3. Ах, извините, это локально:/ Может быть, это потому, что входные данные генерируются jQuery

4. Ну, я пробовал с this.name = «field[test]»; и кажется, что единственный атрибут name, который изменяется, — это ввод непосредственно перед тем, который я удалил. Остальные сохраняют свои имена

5. Спасибо за обновление и вашу помощь! Это работает, если я удаляю ввод и добавляю другой (индекс следует за предыдущим), но если я удаляю ввод [1] между 2 другими, это все равно похоже на [0][2] [3] вместо [0][1][2]. Есть идеи?

Ответ №3:

Прежде всего: если вы используете это имя forms для публикации его с помощью php (или asp) в виде массива, вам нужно указать имя входных данных, вы можете использовать просто name=»field[]» .

Если вы хотите, чтобы таким образом были только имена, то введите в свой ввод класс:

 <input type='text' class="input" name='field[0]' />
<input type='file' class="input" name='field[1]' />
<textarea class="input" name='field[2]' value='' />
<textarea class="input" name='field[3]' value=''/>

Затем с помощью jquery каждый раз, когда пользователь изменяет порядок / удаляет ввод, просто выполняйте эту функцию:

 function re_order(class)
{
  $('.' class).each(function(index,element){
    this.name='field[' index']';
  });
}

где class — это класс, присвоенный входным данным.