Оператор jQuery if / else для формы

#javascript #jquery #forms

#javascript #jquery #формы

Вопрос:

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

Проблема в том, что если мне нужно добавить третий ввод, и я проверяю только новый «бренд 3», первые 2 значения, уже сохраненные для «бренда 1» и «бренда 2», будут удалены. Но мне нужно, чтобы эти предыдущие значения оставались нетронутыми и просто записывали новое значение для «brand 3»

 $(function() {

	set_checkbox_source_values();

	$('#at').submit(function(e) {
		set_checkbox_source_values();
	});
	
});


function set_checkbox_source_values() {
	$(".sub_checkbox").each(function(index){
		if ($(this).attr('checked')) 
		{
			$("input[data-brand='"   $(this).attr("data-brand")   "'][type='hidden']").val("ONBOT");
			
		} else {
			$("input[data-brand='"   $(this).attr("data-brand")   "'][type='hidden']").val('');
		}
	});
}  
 <form method="POST" name="at" id="at">
      
      <input type="hidden" name="SOURCE_ORIG_brand1" value="" data-brand="1" />
      <input type="hidden" name="SOURCE_LAST_brand1" value="" data-brand="1" />
      <input type="hidden" name="SOURCE_ORIG_brand2" value="" data-brand="2" /> 
      <input type="hidden" name="SOURCE_LAST_brand2" value="" data-brand="2" /> 
      
      <input value="1617027553" data-brand="1" name="sub" type="checkbox" class="sub_checkbox" />
      <input value="1617027907" data-brand="2" name="sub" class="sub_checkbox" type="checkbox" />
	  <input name="submit" value="sumbit" /> 
</form>  

Итак, чтобы прояснить еще больше, вот что происходит.
Если я установлю флажок brand1 и оставлю флажок brand2 снятым, это произойдет:

Вариант 1

Но если я вернусь и установлю флажок brand2 и оставлю флажок brand1 снятым, значение переопределяется и удаляет предыдущее значение, оставляя brand1 пустым.

Что мне нужно, чтобы мой код делал, это отправлял ИСХОДНЫЙ КОД в пустое поле, но не переопределял предыдущее значение, поэтому моя конечная цель — получить это:

Требуется результат

Комментарии:

1. Это может помочь, если вы включите свой HTML и серверный код.

2. Как ваш серверный код обрабатывает пустые или неотправленные значения?

3. Есть 2 другие формы, которые также передают значения в определенное поле в базе данных… итак, чего я пытаюсь добиться здесь: если поле пустое / пустое, то оно передает значение, в противном случае оно не влияет на существующее значение в поле

4. Я включил образец HTML и гораздо более четкое объяснение того, чего я пытаюсь достичь

5. Идея, которую я предлагаю, состоит в том, чтобы исключить неизмененные переменные из вашего запроса к базе данных, но есть несколько способов сделать это. Какой язык на стороне сервера вы используете? Можем ли мы увидеть, как вы обрабатываете опубликованные значения и строите запрос к базе данных?

Ответ №1:

Похоже, что ответ частично зависит от того, как ваш серверный код обрабатывает пустые или неопределенные $_POST значения. Вы могли бы исключить пустые значения из своего запроса, но что тогда, если вы хотите задать значение в пустой строке?

Вместо очистки входных значений я предлагаю использовать disabled атрибут для предотвращения публикации непроверенных значений. Затем в вашем коде на стороне сервера исключите неотправленные значения из вашего запроса.

… значение отключенного элемента управления не передается вместе с формой.

Что-то вроде:

 function set_checkbox_source_values() {
  $(".sub_checkbox").each(function(index) {
    $("input[data-brand='"   $(this).attr("data-brand")   "'][type='hidden']").prop('disabled', !this.checked);
  });
}
  

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

 jQuery('input[type=checkbox]').on('change', function() {
  var code = jQuery(this).data('code');
  jQuery('input[type=text][data-code='   code   ']').prop('disabled', !this.checked);
});  
 div {
  margin: 0 0 1em;
}  
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  <input type="text" value="test1" data-code="tester1" disabled />
  <input type="checkbox" data-code="tester1" />
</div>
<div>
  <input type="text" value="test2" data-code="tester2" disabled />
  <input type="checkbox" data-code="tester2" />
</div>
<div>
  <input type="text" value="test3" data-code="tester3" disabled />
  <input type="checkbox" data-code="tester3" />
</div>  

Комментарии:

1. Спасибо! Позвольте мне попробовать это, и я дам вам знать, если это сработает, как можно скорее 🙂

2.Я включил образец HTML и гораздо более четкое объяснение того, чего я пытаюсь достичь

3. Добавлена дополнительная информация … надеюсь, вы сможете помочь 🙂