Question

我遇到一个问题，即当我的ajax表格随后被提交时，我得到一个收音机价值的空值。

顺序发生这种情况：

用户选择一个电台并提交表格
获取所选广播var enable = $('input[name=enable]:checked').attr('value');
通过AJAX data: { 'enable' : enable, },

一切正常。但是，如果用户再次提交表单，则无线电的值为空，则不提交任何内容。

我正在使用样式和Jquery隐藏“标准”无线电并用样式版替换它们。关闭样式后，我可以看到正确选择了无线电，但没有提交任何值。

如果需要，我可以发布更多代码。感谢。

<form method="post" id="add-form" class="form" onsubmit="return false;">
<label>Enable Location</label>
<input type="radio" name="location_enable" id="location_enable" value="enable" checked="checked" />
<input type="radio" name="location_enable" id="location_disable" value="disable" />
<button>Submit</button>
</form>

验证表格

        <script type="text/javascript">
        $().ready(function() {
            $("#add-form").validate({
                rules: {
                    location_enable: { required: true }
                },
                success: function(span) { 
                    span.html(" ").addClass("checked"); 
                },
                submitHandler: function(form) {
                    $('#add-form').submitForm();
                }
            });
        });
        </script>

发布数据

            <script type="text/javascript">
            $(document).ready(function() {
                $.fn.submitForm = function() {
                    var location_enable = $('input[name=location_enable]:checked').attr('value');

                    $.ajax({
                        type: 'POST',
                        data: { 'location_enable' : location_enable },
                        url: 'script.php',
                        dataType: 'json',
                        success: function($data) {
                            var result = $data.result;
                            var msg = $data.msg;

                            if (result == "success") {
                                formMessageDisplay(msg, result);
                                $(':input', '#add-form').each( function() {
                                    // Set the values to empty
                                    $(':input').val('');
                                });
                            }
                            else {
                                formMessageDisplay(msg, result);
                            }
                        },
                        error: function($data) {
                            formMessageDisplay('<?php echo AJAX_ERROR; ?>', result);
                        }
                    })
                }
            });
        </script>

在第一次提交时，如果用户选择“启用”，AJAX会将'enable'作为值发布到script.php。如果用户再次提交表单，则无需重新加载页面，即使用户已选择“启用”，AJAX也会发布空值。

抱歉，之前没有使用过jsFiddle。

在Firebug中，这是两个提交的输出而不重新加载页面。

json_action addEloc
location_address    Test
location_desc   Test
location_enable enable
location_loc    Test
location_map    enable
location_name   Testing radio
location_postcode   Test
location_state  QLD

请注意无线电字段中的两个“启用”。

第二次提交：

json_action addEloc
location_address    Test
location_desc   Test
location_enable 
location_loc    Test
location_map    
location_name   Testing radio
location_postcode   Test
location_state  QLD

第二次提交时两个无线电没有任何价值。

enter image description here

Answer 1

由于您的脚本

，会出现此问题

if (result == "success") {
                formMessageDisplay(msg, result);
                $(':input', '#add-form').each( function() {
                    // Set the values to empty
                     $(':input').val('');
                });
}

您要将''设置为所有输入类型元素

$(':input').val('');

这就是为什么单选按钮值也会设置为''，并且会在返回时返回空白响应，直到您刷新页面为止。

您可以使用reset()函数重置表单值，而不是这样做。

$('#add-form').reset();

随后提交表单时，Jquery为无线电的空值

1 个答案: