Javascript 循环表单中的字段

假设我有一张桌子。每行包含用户可以填充或不填充的表单字段。我需要检查每一行是否填充了所有表单字段或没有表单字段

html是这样的：

<tr class="riga_gar">
    <td class="report">     
        <input type="hidden" id="crediti[<?php echo $i; ?>]" name="crediti[<?php echo $i; ?>]"
                    value="<?php echo $cred['id_cre']; ?>" >
            <?php echo $cred['id_cre'] ?>
    </td>
    <td class="report gbv" data-gbv="<?php echo $cred['gbv_tot']; ?>">
        <?php echo num2cur($cred['gbv_tot']); ?>
    </td>
    <td class="report">
        <?php echo veicolo2name($cred['titolare'],$pdo); ?>
    </td>
    <td class="report">
        <?php echo $cred['stato']; ?>
    </td>
    <td class="report">
        <input class="input_field numerico" id="chiesto" type="text" name="garanzia[<?php echo $i; ?>]" value="<?php echo $chiesto; ?>">
    </td>
    <td class="report">
        <select name="tipo_gar[<?php echo $i; ?>]">
            <option value="">Scegli</option>
            <?php foreach($tipo_gars as $tipo_gar){
                echo '<option value="'.$tipo_gar['id'].'">'.$tipo_gar['descrizione'].'</option>';
                            }?>
        </select>
    </td>
</tr>

我想运行这个ajax函数：

$.ajax({
    type: "POST",
    url: dest,
    data: submit_val,
    success: function(data){ 
        data1=data.split("|");
        if(data1[0]=="Successo"){ 
            $("#spnmsg").fadeTo(200,0.1,
            function(){$(this).removeClass().addClass("spn_success").html(data1[1]).fadeTo(900,1)});
        }else if(data1[0]=="Errore"){
            $("#spnmsg").fadeTo(200,0.1,
            function(){$(this).removeClass().addClass("spn_error").html(data1[1]).fadeTo(900,1)});  
        }
    },
    complete: function(){
        $.fancybox.close();
    //setTimeout(function(){ $('.container').load('sofferenze/dashboard.php?from=<?php echo $id_soff ?>');},3000); 
    setTimeout(function(){
        $('#upper').load('sofferenze/soff.php?soff=<?php echo $id_soff ?>');
        $("#spnmsg").fadeTo(200,0.1,
            function(){$(this).removeClass().addClass("spn_normal").html('Cruscotto della sofferenza <?php echo soff2name($id_soff,$pdo); ?>').fadeTo(900,1)});
    },3000); 
    } //chiudo complete function
}); //chiudo $.ajax

仅当：

至少有一行同时具有两个值； 所有具有值的行都具有这两个值；

---

但是我被困在如何参考输入值并在每个循环中选择，以便检查我的条件

我想这对你有帮助。这将读取每一行并忽略隐藏字段。一旦代码发现填充了这两个值，validateForm变量将为true，如果在下一行中，输入或选择中的一个值都为空，则该变量将变为false

$(document).ready(function(){
    var validateForm = false;
    var check = 0;
    $("form").on('submit',function(){
        $("tr").each(function(){
            console.log($.trim($(this).find("input.input_field").val()) +", "+ $.trim($(this).find("select").val()));
            if($.trim($(this).find("input.input_field").val()) != "" && $.trim($(this).find("select").val()) != ""){
                validateForm = true;
            }
            else{

                if($.trim($(this).find("input.input_field").val())  == "" && $.trim($(this).find("select").val()) != ""){
                    if(validateForm){
                        validateForm = false;
                        check = 1;
                        return false;
                    }
                }
                if($.trim($(this).find("input.input_field").val())  != "" && $.trim($(this).find("select").val()) == ""){
                    if(validateForm){
                        validateForm = false;
                        check = 1;
                        return false;
                    }
                }

            }

        });
        if(validateForm && check == 0){
              validateForm = true;
            }
        else{
            validateForm = false;
        }
        if(validateForm){
            //call ajax
        }
    });
});

---

演示：

我想这会对您有所帮助。这将读取每一行并忽略隐藏字段。一旦代码发现填充了这两个值，validateForm变量将为true，如果在下一行中，输入或选择中的一个值都为空，则该变量将变为false

$(document).ready(function(){
    var validateForm = false;
    var check = 0;
    $("form").on('submit',function(){
        $("tr").each(function(){
            console.log($.trim($(this).find("input.input_field").val()) +", "+ $.trim($(this).find("select").val()));
            if($.trim($(this).find("input.input_field").val()) != "" && $.trim($(this).find("select").val()) != ""){
                validateForm = true;
            }
            else{

                if($.trim($(this).find("input.input_field").val())  == "" && $.trim($(this).find("select").val()) != ""){
                    if(validateForm){
                        validateForm = false;
                        check = 1;
                        return false;
                    }
                }
                if($.trim($(this).find("input.input_field").val())  != "" && $.trim($(this).find("select").val()) == ""){
                    if(validateForm){
                        validateForm = false;
                        check = 1;
                        return false;
                    }
                }

            }

        });
        if(validateForm && check == 0){
              validateForm = true;
            }
        else{
            validateForm = false;
        }
        if(validateForm){
            //call ajax
        }
    });
});

---

演示：

这是未经测试的，但像这样的东西怎么样：

var allowSubmit = false;

$("form").on("submit", function(e) {
    $("tr").each(function() {
        var input = $(this).find("input").val();
        var select= $(this).find("select").val();
        if ((input == "" && select != "") || (input != "" && select == "")) {
            return;
        } else if (input != "" && select != "") {
            allowSubmit = true;
        }
    });
    if (allowSubmit == false) {
        e.preventDefault();
    }
});

---

这是未经测试的，但像这样的东西怎么样：

var allowSubmit = false;

$("form").on("submit", function(e) {
    $("tr").each(function() {
        var input = $(this).find("input").val();
        var select= $(this).find("select").val();
        if ((input == "" && select != "") || (input != "" && select == "")) {
            return;
        } else if (input != "" && select != "") {
            allowSubmit = true;
        }
    });
    if (allowSubmit == false) {
        e.preventDefault();
    }
});

---

select有默认值我想，你只是想检查输入是否被填充？我只看到HTML中的一行-你的意思是你需要检查其中一列中的值是否被填充了吗？不。select不需要使用默认值。但问题不在于条件。重点在于each：如何引用输入并选择each@MatthewHerbst只有一行，因为这是行结构。在表中，该行的数量将与从数据库中获取的行的数量相同。您知道这不是HTML，对吗？我认为select具有默认值，您只想检查输入是否已填充？我在HTML中只看到一行-您的意思是需要检查其中一列中的值是否已填充？否。选择不需要使用默认值。但问题不在于条件。重点在于each：如何引用输入并选择each@MatthewHerbst只有一行，因为这是行结构。在表中，这一行的数量与从数据库中获取的行的数量相同。您知道这不是HTML，对吗？