Question

我试图阻止空字段以搜索形式提交表单。我发现了一个很好的解决方案并且它可以工作，但我不太了解jQuery，所以代码看起来非常难看。任何人都可以推荐更好的解决方案吗？

这是表格JS：

＆＃13;

$(document).ready(function() {
        $("#form1").submit(function() {
            if($("#form-make").val()=="") {
                $("#form-make").prop('disabled', true);
            }
        });
    });
$(document).ready(function() {
    $("#form1").submit(function() {
        if($("#form-model").val()=="") {
            $("#form-model").prop('disabled', true);
        }
    });
});
$(document).ready(function() {
    $("#form1").submit(function() {
        if($("#form-score_start").val()=="") {
            $("#form-score_start").prop('disabled', true);
        }
    });
});
$(document).ready(function() {
    $("#form1").submit(function() {
        if($("#form-score_end").val()=="") {
            $("#form-score_end").prop('disabled', true);
        }
    });
});

＆＃13;

<form method="GET" action="/lots" id="form1">
<div class="col-xs-6 col-sm-3">
  <div>
      <select name="make" class="form-control" id="form-make">
          <option value="" selected='false'>Select Make</option>
          @foreach($companies as $company)
          <option value="{{ $company->name }}">{{ $company->name }}</option>
          @endforeach
      </select>
  </div>
  <br>
  <div>
      <select name="model" class="form-control" id="form-model">
          <option value="" selected='false'>Select Model</option>
          @foreach($models as $model)
              <option value="{{ $model->name }}">{{ $model->name }}</option>
          @endforeach
      </select>
  </div>
  <br>
  <div>
      Condition:
      <select name="score_start" id="form-score_start">
      <option value=""selected="TRUE">select</option>
      <option value="3.5">3.5</option>
      <option value="4">4</option>
      <option value="4.5">4.5</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="9">9</option>
  </select>
  to
  <select name="score_end" id="form-score_end">
      <option value=""selected="TRUE">select</option>
      <option value="3">3</option>
      <option value="3.5">3.5</option>
      <option value="4">4</option>
      <option value="4.5">4.5</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="9">9</option>
  </select>
 </form>

＆＃13;

Answer 1

序列化表单值，检查值foreach字段，如果有任何错误则停止提交，否则提交它！

那将是用例。

确保为每个输入字段命名！可以使用serializeArray()这样实现：

    var $form = $(form).serializeArray();
    var $errors = 0;
    $.each($form, function(i, field) {
        $("*[name="+field.name+"]").removeClass("error");
        var $val = $.trim(field.value);
        if($val == "") {
            $("*[name="+field.name+"]").addClass("error");
            $errors++;
        }
    });

有关正常运行的演示，请参阅the fiddle

GET格式的jQuery简单解决方案

1 个答案: