Batyabest 02 августа 2015 1 39
Добрый день.
Подскажите, как реализовать с помощью Formlt отправку формы таким образом, чтобы если в списке выбрано значение «Другое» — то отправлялся бы текст из соответствующего поля input. А иначе — значение из select?
Форма самая простая, вот кусок с select и input

<div class="form-group [[!+error.firma:notempty=`has-error`]]">
        <label for="firma" class="col-lg-4 control-label">Фирма</label>
        <div class="col-lg-8">
          <select id="select" name="firma" class="form-control">
                <option value="[[!+firma]]">Выберите фирму...</option>
                <option value="Sony" [[!+fi.firma:FormItIsSelected=`Sony`]]>Sony</option>
                <option value="BBK" [[!+fi.firma:FormItIsSelected=`BBK`]]>BBK</option>
                <option value="Oursson" [[!+fi.firma:FormItIsSelected=`Oursson`]]>Oursson</option>
                <option value="Toshiba" [[!+fi.firma:FormItIsSelected=`Toshiba`]]>Toshiba</option>
                <option value="Другое" [[!+fi.firma:FormItIsSelected=`Другое`]]>Другое</option>
          </select>
          <input type="text" value="[[!+firma]]" class="form-control" id="custom" placeholder="Введите свое значение" name="firma">
        </div>
      </div>
39 комментариев
А
Андрей Балкин 02 августа 2015г в 16:27 #
Повесьте функцию onchange на ваш select, добавьте в форму input type=hidden и подставляйте туда при смене нужные значения
B
Batyabest 02 августа 2015г в 16:46 #
Вот такой скрипт использую — все равно отправляется значение из select — слово «Другое»

$(document).ready(function() {
    var $select = $('#select');
    var $custom = $('#custom');
    var customValue = 'Другое';
    
    $('#form').on('submit', function() {
        var $element = $select;
        if ($select.val() == customValue) {
            $element = $custom;
        }
        $element.attr('name', 'value');
    });
    
    $select.on('change', function() {
        $custom.toggle($(this).val() == customValue);
    });
});
А
Андрей Балкин 02 августа 2015г в 16:54 #
Правильно вы же элементу $custom подставляете значение
if ($select.val() == customValue) {
            $element = $custom;
        }


а нужно $select
B
Batyabest 02 августа 2015г в 17:00 #
А в таком случае если выбрано в селекте не «Другое», то есть должно отправляться значение из селекта, приходит пустое значение.
А
Андрей Балкин 02 августа 2015г в 17:01 #
Принимай значение не selecta а inputa а при смене подставляй в этот интуп что хочешь
B
Batyabest 02 августа 2015г в 17:05 #
А подскажите как? Что-то я не соображу.
А
Андрей Балкин 02 августа 2015г в 17:03 #
input другой не твой custom, еще один скрытый
B
Batyabest 02 августа 2015г в 17:06 #
Да, это я так и делаю. Помимо всего еще один скрытый, в него нужно передать значение перед отправкой?
А
Андрей Балкин 02 августа 2015г в 17:51 #
нет теперь не надо код ниже
А
Андрей Балкин 02 августа 2015г в 17:17 #
Даже вот так попробуй проще
$(document).ready(function() {
    var $select = $('#select');
    var $custom = $('#custom');
    var $customValue = 'Другое';

    $select.on('change', function() {
       if ( ($this).val() == $customValue) && ($custom.val() != '') ) {
         $(this).val() = $custom.val();
        }
    });
});
B
Batyabest 02 августа 2015г в 17:23 #
А так все равно из инпута значение берет. При любом значении в селекте. Мне нужно чтобы при значении селекта «Другое» — появлялся инпут для ввода этого самого своего значения. Значит и отправляться он должен. Иначе — отправляются значения из селекта и инпут не появляется))
А
Андрей Балкин 02 августа 2015г в 17:27 #
$(document).ready(function() {
    var $select = $('#select');
    var $custom = $('#custom');
    var $customValue = 'Другое';

    $select.on('change', function() {
$name =  $(this).val();
       if ( ($this).val() == $customValue) && ($custom.val() != '') ) {
         $(this).val() = $custom.val();
        }
else {
$(this).val() = $name;
}
    });
});
А
Андрей Балкин 02 августа 2015г в 17:29 #
чтобы появлялся добавьте show, а изначально спрячьте
B
Batyabest 02 августа 2015г в 17:34 #
А куда добавить show?
А
Андрей Балкин 02 августа 2015г в 17:44 #
$(document).ready(function() {
    var $select = $('#select');
    var $custom = $('#custom');
    var $customValue = 'Другое';

    $select.on('change', function() {
     $name =  $(this).val();
       if  ($this).val() == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
}
    });

 $('#form').on('submit', function() {
         if ( ($select.val() == $customValue) && ($custom.val() != '') ) {
            $select.val() = $custom.val();
        }
      else{
      $select.val() = $name;
      } 
    });
});
А
Андрей Балкин 02 августа 2015г в 17:48 #
$(document).ready(function() {
    var $select = $('#select'),
    $custom = $('#custom'),
    $customValue = 'Другое',
    $name =  $('#select').val();

    $select.on('change', function() {
       if  ($name == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
}
    });

 $('#form').on('submit', function() {
         if ( ($select.val() == $customValue) && ($custom.val() != '') ) {
            $select.val() = $custom.val();
        }
      else{
      $select.val() = $name;
      } 
    });
});
B
Batyabest 02 августа 2015г в 17:55 #
$(document).ready(function() {
    var $select = $('#select');
    var $custom = $('#custom');
    var $customValue = 'Другое';

    $select.on('change', function() {
     $name =  $(this).val();
       if  ($(this).val() == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
}
    });

 $('#form').on('submit', function() {
         if ( ($select.val() == $customValue) && ($custom.val() != '') ) {
            $select.val() = $custom.val();
        }
      else{
      $select.val() = $name;
      } 
    });
});


В этом коде в плане отображения/скрытия инпута все ОК. Но отправляет только из инпута значение. Здесь нужен скрытый инпут или все работает в связке select/input type «text»
B
Batyabest 02 августа 2015г в 17:57 #
Может в форме чего я не та прописал?

<div class="form-group [[!+error.firma:notempty=`has-error`]]">
        <label for="firma" class="col-lg-4 control-label">Фирма</label>
        <div class="col-lg-8">
          <select id="select" name="firma" class="form-control">
                <option value="[[!+firma]]">Выберите фирму...</option>
                <option value="Sony" [[!+fi.firma:FormItIsSelected=`Sony`]]>Sony</option>
                <option value="BBK" [[!+fi.firma:FormItIsSelected=`BBK`]]>BBK</option>
                <option value="Oursson" [[!+fi.firma:FormItIsSelected=`Oursson`]]>Oursson</option>
                <option value="Toshiba" [[!+fi.firma:FormItIsSelected=`Toshiba`]]>Toshiba</option>
                <option value="Другое" [[!+fi.firma:FormItIsSelected=`Другое`]]>Другое</option>
          </select>
          <input type="text" value="[[!+firma]]" class="form-control" id="custom" placeholder="Введите свое значение" name="firma">
        </div>
      </div>
А
Андрей Балкин 02 августа 2015г в 17:58 #
нет последний код бери Этот...
B
Batyabest 02 августа 2015г в 18:01 #
А в нем не появляется input…
А
Андрей Балкин 02 августа 2015г в 18:05 #
Я то пишу не проверяю ) поидее так
$(document).ready(function() {
    var $select = $('#select'),
    $custom = $('#custom'),
    $customValue = 'Другое',
    $name =  $select.val();

    $select.on('change', function() {
       if  ($select.val() == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
}
    });

 $('#form').on('submit', function() {
         if ( ($select.val() == $customValue) && ($custom.val() != '') ) {
            $select.val() = $custom.val();
        }
      else{
      $select.val() = $name;
      } 
    });
});
B
Batyabest 02 августа 2015г в 18:11 #
Так все работает, опять же в плане скрытия/отображения все ОК. Но при выборе в селекте не «Другое» приходит пустое значение. Это видимо из-за того, что в верстке после селекта присутствует (хоть и скрытый через display:none) input. Он получается с пустым значением и оно и перезаписывает при отправке значение из селекта (вернее, они 2 по порядку уходят — последний пустой.)
Возможно, нужно не отображать/скрывать а вобще добавлять элемент, а чтобы при выборе не «Другое» — он удалялся из верстки. Как это сделать?
А
Андрей Балкин 02 августа 2015г в 18:18 #
Нет проверьте код select в форме на правильность передачи значений FORMIT, кажется там некорректно у вас что то

если там верно

то пробуйте так


$(document).ready(function() {
    var $select = $('#select'),
    $custom = $('#custom'),
    $customValue = 'Другое',
    $name =  $select.val();

    $select.on('change', function() {
$name =  $select.val();
       if  ($select.val() == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
$name =  $select.val();
}
    });

 $('#form').on('submit', function() {
         if ( ($select.val() == $customValue) && ($custom.val() != '') ) {
            $select.val() = $custom.val();
        }
      else{
      $select.val() = $name;
      } 
    });
});
B
Batyabest 02 августа 2015г в 18:22 #
Форма тут — все ли правильно?
B
Batyabest 02 августа 2015г в 18:23 #
Вот так передаются значения по консоли посмотрел:

firma:Oursson
firma:

В результате пустое значение приходит.
А
Андрей Балкин 02 августа 2015г в 18:31 #
ну проверь по букварю я не помню формит уже давно не использую
B
Batyabest 02 августа 2015г в 18:36 #
Так как бы форма то правильная но проблему я вижу в том, что поля идут один за одним с одинаковым name. И приходил последнее значение (пустое).
А
Андрей Балкин 02 августа 2015г в 19:00 #
Это в форму и пропиши ее на прием Formit как там правильно теги забыл, у selecta убери их совсем
<input type="hidden" name="firma" value="" id="firma" />


$(document).ready(function() {
    var $select = $('#select'),
    $custom = $('#custom'),
    $customValue = 'Другое',
    
    $select.on('change', function() {
       if  ($('#select :selected').val() == $customValue) {
         $('#custom').show();
        }
else {
$('#custom').hide();
}
    });

 $('#form').on('submit', function() {
         if ( ($('#select :selected').val() == $customValue) && ($custom.val() != '') ) {
           $('#firma).val() = $custom.val();
        }
      else{
      $('#firma).val() = $('#select :selected').val();
      } 
       
    });
});
А
Андрей Балкин 02 августа 2015г в 19:03 #
else{
      $('#firma').val() = $('#select :selected').val();
      } 
B
Batyabest 02 августа 2015г в 18:54 #
Как я предполагал, мешает инпут, идущий после select с тем же name. Костыль конечно, но свою задачу решает. Сделал просто удаление инпута перед отправкой формы, все работает как надо. Спасибо за помощь!

else{
        $('#custom').remove();
        $select.val() = $name;
      }
А
Андрей Балкин 02 августа 2015г в 19:04 #
Смени ему name просто тогда, зачем ему такое же, в том коде не нужно оно таким же
B
Batyabest 02 августа 2015г в 19:14 #
У меня идет не отправка а запись в БД, тогда нужно при записи в БД делать дополнительную выборку, из какого поля записывать? Типа проверки на данные?
А
Андрей Балкин 02 августа 2015г в 19:18 #
в каком случае? если со старым кодом то из селекта и записывать
B
Batyabest 02 августа 2015г в 19:24 #
С Вашим кодом и с моим костылем)) Все правильно работает. А если сделать разные name то тогда при записи в БД нужно делать проверку из какого name данные приходят?
А
Андрей Балкин 02 августа 2015г в 19:39 #
они у вас приходят все время из одного — которое select, из второго мы подставляем значение в первый
А
Андрей Балкин 02 августа 2015г в 17:56 #
последний бери в этом да может только input
S
Siretsky 17 августа 2015г в 03:26 #
Андрей, не могли бы вы выложить полностью рабочий код вместе с формой, тоже мучаюсь этим вопросом. Спасибо!
B
Batyabest 17 августа 2015г в 07:41 #
Да, конечно. Вот полный код формы.


[[!getSheetData]]
[[!FormIt?  
  &hooks=`add_remont,redirect`
  &redirectTo=`10`
  &placeholderPrefix=``
  &validate=`fio:required,
       dogovor:required`
]]
<div class="row">
<div class="col-lg-6" style="margin-left: auto; margin-right: auto; float: none;">
[[!+error.process_error:notempty=`<div class="alert alert-dismissable alert-danger">
  <button type="button" class="close" data-dismiss="alert">×</button>
  <strong>Ошибка!</strong> [[!+error.process_error]]
</div>`]]
<div class="well">
  <form class="bs-example form-horizontal" action="[[~[[*id]]]]" method="post" id="form">
    <input type="hidden" value="[[!+id]]" name="sheet">
    <fieldset>
      <legend>[[*pagetitle]]</legend>
	  <div class="form-group [[!+error.group:notempty=`has-error`]]">
        <label for="dogovor" class="col-lg-4 control-label">Номер договора</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+dogovor]]" class="form-control"
          id="dogovor" placeholder="12345/2015-25" name="dogovor">
          <span class="help-block">[[!+error.dogovor]]</span>
        </div>
      </div>
      <div class="form-group [[!+error.fio:notempty=`has-error`]]">
        <label for="fio" class="col-lg-4 control-label">ФИО</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+fio]]" class="form-control"
          id="fio" placeholder="Иванов Иван Иванович" name="fio">
          <span class="help-block">[[!+error.fio]]</span>
        </div>
      </div>
	  	  <div class="form-group [[!+error.phone:notempty=`has-error`]]">
        <label for="phone" class="col-lg-4 control-label">Телефон</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+phone]]" class="form-control"
          id="phone" placeholder="8xxxxxxxxxx" name="phone">
          <span class="help-block">[[!+error.phone]]</span>
        </div>
      </div>
	  
	  
	  
	  <div class="form-group [[!+error.firma:notempty=`has-error`]]">
        <label for="firma" class="col-lg-4 control-label">Фирма</label>
        <div class="col-lg-8">
          <select id="select" name="firma" class="form-control">
                <option value="[[!+firma]]">Выберите фирму...</option>
                <option value="Sony" [[!+fi.firma:FormItIsSelected=`Sony`]]>Sony</option>
                <option value="BBK" [[!+fi.firma:FormItIsSelected=`BBK`]]>BBK</option>
                <option value="Oursson" [[!+fi.firma:FormItIsSelected=`Oursson`]]>Oursson</option>
                <option value="Toshiba" [[!+fi.firma:FormItIsSelected=`Toshiba`]]>Toshiba</option>
                <option value="Другое" [[!+fi.firma:FormItIsSelected=`Другое`]]>Другое</option>
          </select>
          <input type="text" value="[[!+firma]]" class="form-control" id="custom" placeholder="Введите свое значение" name="firma">
        </div>
      </div>
	  <div class="form-group [[!+error.model:notempty=`has-error`]]">
        <label for="model" class="col-lg-4 control-label">Модель</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+model]]" class="form-control" id="model" placeholder="Bravia" name="model">
          <span class="help-block">[[!+error.model]]</span>
        </div>
      </div>
	  <div class="form-group [[!+error.serial:notempty=`has-error`]]">
        <label for="serial" class="col-lg-4 control-label">Серийный номер</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+serial]]" class="form-control" id="serial" placeholder="XPH1245879" name="serial">
          <span class="help-block">[[!+error.serial]]</span>
        </div>
      </div>
 
      <div class="form-group [[!+error.remonttype:notempty=`has-error`]]">
        <label for="remonttype" class="col-lg-4 control-label">Тип ремонта</label>
        <div class="col-lg-8">
          <select name="remonttype" class="form-control">
              <option value="Гарантийный" [[!+fi.remonttype:FormItIsSelected=`Гарантийный`]]>Гарантийный</option>
              <option value="Платный" [[!+fi.remonttype:FormItIsSelected=`Платный`]]>Платный</option>
          </select>
        </div>
      </div>
      <div class="form-group [[!+error.status:notempty=`has-error`]]">
        <label for="status" class="col-lg-4 control-label">Статус</label>
        <div class="col-lg-8">
          <select name="status" class="form-control">
           <option value="[[!+status]]">Выберите статус...</option>
              <option value="Принят" [[!+fi.status:FormItIsSelected=`Принят`]]>Принят</option>
              <option value="Направлен в ремонт" [[!+fi.status:FormItIsSelected=`Направлен в ремонт`]]>Направлен в ремонт</option>
              <option value="В процессе" [[!+fi.status:FormItIsSelected=`В процессе`]]>В процессе</option>
              <option value="Ожидание запчасти" [[!+fi.status:FormItIsSelected=`Ожидание запчасти`]]>Ожидание запчасти</option>
              <option value="Ремонт окончен" [[!+fi.status:FormItIsSelected=`Ремонт окончен`]]>Ремонт окончен</option>
              <option value="Аппарат выдан" [[!+fi.status:FormItIsSelected=`Аппарат выдан`]]>Аппарат выдан</option>
          </select>
        </div>
      </div>

      <div class="form-group [[!+error.description:notempty=`has-error`]]">
        <label for="description" class="col-lg-4 control-label">Комментарий</label>
        <div class="col-lg-8">
          <input type="text" value="[[!+description]]" class="form-control"
          id="description" placeholder="Комментарий к ремонту" name="description">
          <span class="help-block">[[!+error.description]]</span>
        </div>
      </div>
      <div class="form-group">
        <div class="col-lg-8 col-lg-offset-4">
          <button type="submit" class="btn btn-primary">Сохранить</button>
          <button type="submit" class="btn btn-danger btn-xs"
            name="remove" value="remove"
            onclick="return confirm('Удалить заказ?')">Удалить</button>
        </div>
      </div>
    </fieldset>
  </form>
</div>
</div>
</div>
S
Siretsky 17 августа 2015г в 03:28 #
Или Batyabest )
Авторизуйтесь или зарегистрируйтесь (можно через соцсети ), чтобы оставлять комментарии.