Question

我有两个值需要在检查时存储在数据库中，如果我同时检查这两个值，则工作正常。

问题是：如果我必须添加第三个输入，并且我只检查新的“品牌3”，则已经为“品牌1”和“品牌2”存储的前2个值将被删除。但我需要保持原先的价值不变，只需为“品牌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，则会发生以下情况：

Option 1

但是，如果我返回并检查brand2复选框并取消选中brand1，则会覆盖该值并删除之前的值，将brand1清空。

我需要我的代码做的是将SOURCE发布到空字段但不覆盖以前的值，所以我的最终目标是得到这个：

Result needed

Answer 1

似乎答案部分取决于服务器端代码如何处理空值或未定义的$_POST值。您可以从查询中排除空白值，但如果要将值设置为空白字符串，该怎么办？

而不是清除输入＆＃39;值，我建议使用disabled attribute来阻止发布未经检查的值。然后，在服务器端代码中，从查询中排除未发布的值。

...禁用的控件的值不会随表单一起提交。

类似的东西：

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

这是一个使用常规文本输入的示例，仅用于演示您可以使用隐藏的输入。

＆＃13;

jQuery('input[type=checkbox]').on('change', function() {
  var code = jQuery(this).data('code');
  jQuery('input[type=text][data-code=' + code + ']').prop('disabled', !this.checked);
});

＆＃13;

div {
  margin: 0 0 1em;
}

＆＃13;

<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>

＆＃13;

表单

1 个答案: