Какие есть причины, почему отключенные поля в форме HTML по-прежнему передаются? - PullRequest
0 голосов
/ 16 января 2020

Итак, у меня есть фиксированная структура HTML, на которую я не могу влиять. Структура обеспечивается инструментом, в который вы добавляете поля выделения / ввода / et c с помощью перетаскивания.

Например, обычное текстовое поле получает этот HTML код:

<div id="d_001" class="field  text ">
    <label for="f_001" id="l_001">Shortdescription</label>
        <input id="f_001" name="id1" value=""     />
</div>

И текстовая область получит этот код:

<div id="d_002" class="field  area ">
    <label for="f_002" id="l_002">Description</label>
        <textarea id="f_002" name="id2" cols="45" rows="5" ></textarea>
</div>

У меня также есть список выбора, который на основе выбранного элемента показывает / скрывает дополнительные информационные поля. Скажем, например, список выбора содержит различную одежду. Когда вы выбираете "брюки", два поля ввода "длина" и "ширина" становятся видимыми. Когда вы выбираете «бюстгальтер», два поля ввода «размер чашки» и «под грудью» становятся видимыми.

Так вот в чем дело: при выборе «штаны», он в настоящее время будет передавать следующую информацию в систему:

Short Descritption: Pants
Description: I would like to by black skinny jeans
Length: 32
Width: 32
Cup Size:
Underbust:

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

На основе приведенных выше фрагментов HTML я пытался отключить через

document.getElementsByTagName('input').disabled = true;

->, который отключает все поля ввода «input», но по-прежнему отправляет метку без содержимого. Несмотря на то, что я не уверен, что он не отправляет содержимое или отправляет пустое содержимое.
(да, это исключило бы списки выбора, textareas и т. Д. c., Но это вторичная проблема, можно решить, выполнив одно и то же для всех типов тегов)

Поэтому я подумал, что, может быть, мне нужно отключить все элементы в элементе div, то есть мне нужно также «отключить» метки с помощью

documents.getElementsByTagName('label').disabled = true;

Я не слишком удивлен, что это не работает. Но так как я не могу отключить элементы div в целом, я действительно не знаю, что мне не хватает. Есть ли что-то еще, что заставляет поля быть представленными? Я очень благодарен за любые подсказки, которые указывают мне * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 10 * * * * * * * * * * * * * 'U * 10' '* * поля:

// list with links to make the items clickable
      <ul id="myUL">
          <li><a id="li1" title="pants" href="javascript:void(0)" onclick="returncontent(this);showpants();">Pants</a></li>
          <li><a id="li2" title="bra" href="javascript:void(0)" onclick="returncontent(this);showbra();">Bra></li>
          <li><a id="li3" title="tshirt" href="javascript:void(0)" onclick="returncontent(this);showtshirt();">T-Shirt</a></li>
          <li><a id="li4" title="socks" href="javascript:void(0)" onclick="returncontent(this);showsocks();">Socks</a></li>
      </ul>

// a var array containing the available class attributes
var elemente = ["pants","bra","tshirt","socks"];

// defining the functions triggered by the list
function showpants(){
    howtocode(0);
}
function showbra(){
    howtocode(1);
}
function showtshirt(){
    howtocode(2);
    wosOSD();
}
function showsocks(){
    howtocode(3);

// have the function do different things depending on the selected list item
function howtocode(value){
    var arrayLength = elemente.length;
    for (var i = 0; i < arrayLength; i++) {
    var classEle = document.getElementsByClassName(elemente[i]);
    if (elemente[i] === elemente[value]){
      changeStyle(elemente[i],classEle,"block");
      setRequired(elemente[i],classEle);
    }
    else{
      changeStyle(elemente[i],classEle,"block");
      disableFields(elemente[i],classEle);
      emptyFields(elemente[i],classEle);
    }

  }
}
function disableFields(ele, classEle){
    for (var n = 0; n < classEle.length; n++) {
        var inputfields3 = classEle[n].getElementsByTagName('input');
        var textfield3 = classEle[n].getElementsByTagName('textarea');
        for (var o = 0; o < inputfields3.length; o++){
            inputfields3[o].disabled = true;
        }
        for (var p = 0; p < textfield3.length; p++){
            textfield3[p].disabled = true;
        }
    }
}

и другие функции выполняют следующие действия:
- changeStyle () [устанавливает для элемента div значение "block" или "none"
- setRequired () [не требует пояснений Я надеюсь]
- emptyFields () [сбрасывает все поля ввода, если выбранный элемент изменяется)

Я знаю, что в настоящее время он не работает. Я работаю над созданием скрипки.

Edit 2:

Итак, я нашел следующий код где-то в системных файлах JS / jQuery. Может ли это быть как-то связано с этим? Пока я еще не понял, что он делает.

    var data = elements.inject({ }, function(result, element) {
      if (!element.disabled && element.name) {
        key = element.name; value = $(element).getValue();
        if (value != null && (element.type != 'submit' || (!submitted &&
            submit !== false && (!submit || key == submit) && (submitted = true)))) {
          if (key in result) {
            // a key is already present; construct an array of values
            if (!Object.isArray(result[key])) result[key] = [result[key]];
            result[key].push(value);
          }
          else result[key] = value;
        }
      }
      return result;
    });

1 Ответ

0 голосов
/ 16 января 2020

Взгляните на этот вопрос, Как отключить тип ввода = текст?

Вместо установки disabled = true вам необходимо установить disabled = "disabled".

...