获取多个无线电值

时间:2014-02-27 13:52:39

标签: javascript html forms

我有一个包含很多块的部分(在这个例子中我只使用两个)。情况是:我有<div><input><select>组和<radio>按钮。填写完所有内容并单击“Grab”按钮后,脚本将显示包含此值的警报。

但是如果你填充的块数超过一个,那么最后一个块就不会占用无线电。它总是返回"undefined"。如果您将第一个块留有空无线电并填充最后一个,则警报屏幕上的信息将显示最后一个,但这是错误的。

我做错了什么?

以下是JSFiddle

的JavaScript

$(document).ready(function(){
    var contentArray = '';

    $('button').click(function() { 
        $('.option_group').each(function(i) { 
            var NotEmptyTextBoxes = $('input:text').filter(function() { return this.value !== ""; });
            var NotEmptyCombo = $('option:selected').filter(function() { return this.text !== ""; });       

            NotEmptyTextBoxes.each(function() {
                name = this.name;
                val = this.value;                       
                var combo = $('#c_'+name).val();                    
                var radio = $('input[name=r_'+name+']:checked', '#theform').val();
                contentArray = contentArray+name+'='+"'"+val+"'"+","+"'"+combo+"'"+","+radio+";"+"|";   
                radio = '';
            });

            alert(contentArray);    
            contentArray = '';

            return false;
        }); 
    }); 
}); 

HTML

<form id ="theform">
    <div class="option_group" id="bloco">
        <input type="text" placeholder="Cargo" name="cargo" id="carga"/>
        <select class="filtercombo" id="c_cargo">
            <option>like</option>
            <option>=</option>
            <option>!=</option>
            <option><</option>
            <option><=</option>
            <option>></option>
            <option>>=</option>
            <option>is null</option>
            <option>is not null</option>
            <option>in</option>
            <option>not in</option>
            <option>between</option>
            <option>contains</option>
            <option>not like</option>
        </select>

        <input type="radio" value="up" name="r_cargo">
        <input type="radio" value="down" name="r_cargo">
        <input type="radio" value="flat" name="r_cargo">
    </div><!-- @end of option_group -->

    <div class="option_group" id="bloco">   
        <input type="text" placeholder="provider" name="provider" id="provider"/>
        <select class="filtercombo" id="c_provider">
            <option>like</option>
            <option>=</option>
            <option>!=</option>
            <option><</option>
            <option><=</option>
            <option>></option>
            <option>>=</option>
            <option>is null</option>
            <option>is not null</option>
            <option>in</option>
            <option>not in</option>
            <option>between</option>
            <option>contains</option>
            <option>not like</option>
        </select>

        <input type="radio" value="up" name="r_provider1" />
        <input type="radio" value="down" name="r_provider2" />
        <input type="radio" value="flat" name="r_provider3" />  
    </div><!-- @end of option_group -->

    <button type="button">grab</button> 

</form>

1 个答案:

答案 0 :(得分:2)

您的最后一组无线电r_provider1, r_provider2, r_provider3有不同的名称,它们都应具有相同的名称'r_provider'。

相关问题