Question

我想以我的形式验证我的textareas ..但我有一个问题，只是试图验证我的一个文本区域，但之后我的表单不起作用 - 我做了本地和会话存储和隐藏/通过检查复选框显示我的radiobuttons ..但添加我的功能后形成它不起作用..我不知道哪里有问题

我的JS文件，保存和加载是本地和sessionstorage，切换功能使我的属性和辐射隐藏/可见。检查功能验证我的一个textAreas。

function toggleAttributes(checkbox, radios, attribute, attributeValue) {
  for (var i = 0; i < radios.length; i += 1) {
    // If checkbox is checked, set the attribute and the attribute value. If not, remove the attribute
    checkbox.checked === true ? radios[i].setAttribute(attribute, attributeValue) : radios[i].removeAttribute(attribute);
  }
}

function toggleRadios(el, id) {
  var radiosSelector = `#${id} input[type='radio']`,
    container = document.getElementById(id),
    radios = document.querySelectorAll(radiosSelector);
  container.classList.toggle("hide");
  toggleAttributes(el, radios, "required", "");
}
var i;
var checkboxes = document.querySelectorAll('input[type=checkbox]');
var radio = document.querySelectorAll('input[type=radio]');
function check()
{
var ok=true;

regLast = /^[a-zA-Z]{2,20}$/;

if (!regLast.test(document.getElementById("lastName")))
{
    ok=false;
    document.getElementsByClassName("lastNameCheck").innerHTML= "Put valid data";
}
else
    document.getElementsByClassName("lastNameCheck").innerHTML="";

return ok;
}

<form "needs-validation" onsubmit "return check()">
    <div class="form-group">
      <label for ="lastName">Last Name:</label>
      <input type = "text" class = "form-control" id = "lastName" placeholder = "Podaj nazwisko" name = "nazwisko" />
      <div class="invalid-tooltip lastNameCheck">
      </div>
    </div>
    </div>
    <p>
      Choose dishes:
    </p>
    <div class="custom-control custom-checkbox custom-control-inline">
      <input type="checkbox" class="custom-control-input" id="checkGlowne" data-target="pierwsze" onclick="toggleRadios(this, 'pierwsze')">
      <label class="custom-control-label" for="checkGlowne">Main</label>
    </div>
    <p>
      Main dishes
    </p>
    <div id = "pierwsze" class = "hide">
      <div class="custom-control custom-radio custom-control-inline">
        <input type="radio" class="custom-control-input" id="1" name = "pierwsze">
        <label class="custom-control-label" for="1">1</label>
      </div>
      <div class="custom-control custom-radio custom-control-inline">
        <input type="radio" class="custom-control-input" id="2" name = "pierwsze">
        <label class="custom-control-label" for="2">2</label>
      </div>
      <div class="custom-control custom-radio custom-control-inline">
        <input type="radio" class="custom-control-input" id="3" name = "pierwsze">
        <label class="custom-control-label" for="3">3</label>
      </div>
      <div class="custom-control custom-radio custom-control-inline">
        <input type="radio" class="custom-control-input" id="4" name = "pierwsze">
        <label class="custom-control-label" for="4">4</label>
      </div>
    </div>
    <button type="submit" class="btn btn-primary" onclick="save()" >Submit</button>
</form>

如果有可能我想：验证我的表单，如果它是正确的我想将我的表单发送到本地和sessionstorage并显示警告，但是当它不正确时我只想把工具提示输入错误。我有一个功能来保存和提醒我的输入..如何连接它？

JS的表单验证

0 个答案: