Question

我的表单上的其他字段中有多个select字段，并使用ajax将数据提交到数据库。数据提交成功，但问题是，当多选字段为空时，注意工作：js和php代码都不执行。即使我认为我在表格上有多重选择，但我打算不强制要求。请帮忙

$(function() {
    $('#form1').on('click', function(e) {
        e.preventDefault(); // do not allow the default form action

        /*  var realvalues = new Array();//storing the selected values inside an array
               $('#s2_multi_value:selected').each(function(i, selected) {
                 realvalues[i] = $(selected).val();
               });  */

        var form = $(this)[0].form;
        var data = $(form).serialize();

        $.ajax({
                method: "POST",
                url: "orgprocess1.php",
                data: data
            })
            .done(function(data) { // capture the return from process.php
                var obj = $.parseJSON(data);
                var orgvalid = obj.valid2;
                var buty = obj.$bty;
                var orgmessage = obj.msg_orgcode;
                var btypemessage = obj.msg_business;


                if (orgvalid == 1) { // place results on the page
                    $('input[name="org_Code"]').removeClass('textBoxError');
                    $('#result2').html('<div class="valid"></div>');
                } else {
                    $('input[name="org_Code"]').addClass('textBoxError');
                    $('#result2').html('<div class="error">' + orgmessage + '</div>');

                }
                if (buty == 1) { // place results on the page
                    $('select[name="btype"]').removeClass('textBoxError');
                    $('#result3').html('<div class="valid"></div>');
                } else {
                    $('input[name="btype"]').addClass('textBoxError');
                    $('#select3').html('<div class="error">' + btypemessage + '</div>');

                }

            });
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
    <div class="col-sm-4">
        <p>Email Address</p>
        <input type="text" class="form-control" id="email" name="email" placeholder="Email Address">
    </div>
    <div class="col-sm-4">
        <p>Address</p>
        <input type="text" class="form-control" id="addre" name="addre" placeholder="Physical Assress">
    </div>
    <div class="col-sm-4">
        <p>Business Type</p>
        <select id="s2_multi_value" name="btype[]" class="form-control" multiple="multiple">
            <option value="">select one</option>
            <option value="Goods">Goods</option>
            <option value="Consultancy">Consultancy</option>
        </select>
        <input type="submit" value="submit" name="submit">
    </div>

Answer 1

尝试使用以下代码段提交表格天气您选择任何值。

$(document).ready(function() {
  $(document).on('submit', function(e) {
    e.preventDefault(); // do not allow the default form action
    console.log("form submitting and sending ajax call");
    /*  var realvalues = new Array();//storing the selected values inside an array
               $('#s2_multi_value:selected').each(function(i, selected) {
                 realvalues[i] = $(selected).val();
               });  */

    var form = $(this)[0].form;
    var data = $(form).serialize();



    $.ajax({
        method: "POST",
        url: "orgprocess1.php",
        data: data



      }).error(function(){
      console.log('error for ajax')
      })
      .done(function(data) { // capture the return from process.php
        var obj = $.parseJSON(data);
        var orgvalid = obj.valid2;
        var buty = obj.$bty;
        var orgmessage = obj.msg_orgcode;
        var btypemessage = obj.msg_business;
console.log("into ajax done function",data);



        if (orgvalid == 1) { // place results on the page
          $('input[name="org_Code"]').removeClass('textBoxError');
          $('#result2').html('<div class="valid"></div>');
        } else {
          $('input[name="org_Code"]').addClass('textBoxError');
          $('#result2').html('<div class="error">' + orgmessage + '</div>');

        }
        if (buty == 1) { // place results on the page
          $('select[name="btype"]').removeClass('textBoxError');
          $('#result3').html('<div class="valid"></div>');
        } else {
          $('input[name="btype"]').addClass('textBoxError');
          $('#select3').html('<div class="error">' + btypemessage + '</div>');

        }

      });
  });

})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="my-form" action="http://google.com">
<div class="form-group">
    <div class="col-sm-4">
        <p>Email Address</p>
        <input type="text" class="form-control" id="email" name="email" placeholder="Email Address">
    </div>
    <div class="col-sm-4">
        <p>Address</p>
        <input type="text" class="form-control" id="addre" name="addre" placeholder="Physical Assress">
    </div>
    <div class="col-sm-4">
        <p>Business Type</p>
        <select id="s2_multi_value" name="btype[]" class="form-control" multiple="multiple">
            <option value="">select one</option>
            <option value="Goods">Goods</option>
            <option value="Consultancy">Consultancy</option>
        </select>
        <input type="submit" value="submit" name="submit">
    </div>
    </form>

空多个选择字段阻止表单提交

1 个答案: