Создать и удалить текст типа ввода, если установлен флажок выбранного типа ввода

У меня проблема, мне нужно создать или удалить, если необходимо, текст типа ввода, если установлен флажок Тип ввода.

На данный момент я могу создать только вводимый текст, но мне удается найти решение, чтобы очистить, если флажок не установлен.

Мой HTML-код:

<form role="form" action="" method="POST">
  <input type="checkbox" class="myCheckBox" name="category[]" value="1">
  <input type="checkbox" class="myCheckBox" name="category[]" value="2">
  <input type="checkbox" class="myCheckBox" name="category[]" value="3">
  <input type="checkbox" class="myCheckBox" name="category[]" value="4">
  <input type="checkbox" class="myCheckBox" name="category[]" value="5">
  <div class="inputCreate"></div>
  <input type="submit" name="" value="Send yours categories">
</form>

И код jQuery выглядит следующим образом

     var wrapper = $(".inputCreate");

$('.myCheckBox').click(function() {
    if ($(this).is(':checked')) {
         $(wrapper).append('<input type="text" name="mytext[]" placeholder="">');
    }
});

Как я могу это сделать, сняв флажок, также удалите текстовое поле ввода ?.

Решение этой проблемы:

var wrapper = $(".inputCreate");
$(".myCheckBox").change( function(){
    if($(this).is(':checked')){
         $(wrapper).append('<input type="text" name="mytext[]" placeholder="">');
    }
    else{
        $('.inputCreate :last-child').remove();
    }
});

Приветствие из Чили.


javascript input checkbox jquery
person Cristian Meza    schedule 29.03.2015    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Это должно быть именно то, что вам нужно: Рабочий скрипт

var wrapper = $(".inputCreate");
$(".myCheckBox").change( function(){
    if($(this).is(':checked')){
         $(wrapper).append('<input type="text" name="mytext[]" placeholder="'+$(this).val()+'">');
    }
    else{
        $('.inputCreate :last-child').remove();
    }
});
person Prashant Ghimire    schedule 29.03.2015
comment
Спасибо большое, друг, это именно то, чего мы хотели достичь. Спасибо еще раз. Привет из Чили. - person Cristian Meza; 29.03.2015
comment
Проголосуйте и проверьте пожалуйста !! ;) - person Prashant Ghimire; 29.03.2015
comment
Я зашел на сайт несколько минут назад, получаю сообщение, что мне нужно +15 репутации хе-хе. Приносим извинения за то, что не смогли вернуть вашу ценную помощь. - person Cristian Meza; 29.03.2015
comment
Lol np, я только что сказал. Stackoverflow - это помощь. Повеселись. - person Prashant Ghimire; 29.03.2015

arrow_upward
0
arrow_downward

Попробуй это. Я предполагаю, что вы хотите удалить текстовое поле, если флажок снят.

$('.myCheckBox').click(function() { 
     if ($(this).is(':checked')) { 
         $(wrapper).append('<input type="text" name="mytext[]" placeholder="">'); 
     }else{ 
         $(wrapper).find('input').remove();
     }
 });
person Imesh Chandrasiri    schedule 29.03.2015
comment
Это работает, но при повторном выборе любого флажка текстовое поле не создается. - person Cristian Meza; 29.03.2015
comment
Не работает, консоль возвращает мне следующую ошибку: ReferenceError: input не определен. Спасибо за помощь. - person Cristian Meza; 29.03.2015
comment
Приносим извинения за пропущенные двоеточия. Просто попробуйте с отредактированным ответом. - person Imesh Chandrasiri; 29.03.2015
comment
Это работает, но если у меня установлено несколько флажков и снимается только один, я стираю все поля ввода текста :(. Еще раз спасибо за вашу помощь. - person Cristian Meza; 29.03.2015