Tengo dos entradas, la primera es una casilla de verificación y la otra es una entrada oculta. También tengo entrada múltiple en 1 página

 <input type="checkbox" class="comp-checkk" value="45164c0b-fc92-4f93-9c62-ea61336130eb"> <input type="hidden" class="comp-id" name="component_id[]" value="45164c0b-fc92-4f93-9c62-ea61336130eb"> <input type="checkbox" class="comp-checkk" value="45164c0b-fc92-4f93-9c62-ea61336130eb"> <input type="hidden" class="comp-id" name="component_id[]"> <input type="checkbox" class="comp-checkk" value="45164c0b-fc92-4f93-9c62-ea61336130eb"> <input type="hidden" class="comp-id" name="component_id[]">

Quiero establecer el valor de entrada con la clase comp-id usando el valor del valor de la clase comp-checkk . Y si el valor de comp-id no es nulo, quiero establecer comp-id en nulo, de lo contrario, si el valor de comp-id es nulo, quiero establecer el valor de comp-id con el valor de comp-check

He intentado así:

 $(document).on('change','.comp-checkk',function(){ if ($(this).next().val() != null) { $(this).next().val(null); } else { $(this).next().val($(this).val()); } });

Funciona si el comp-id no es nulo, pero cuando el valor es nulo no funciona (no pasó nada). No sé lo que está mal con mi código.

También hice JsFiddle aquí