Question

已更新：DOM正在创建#dockhouse-reservation-vessel的第二个选择实例。它覆盖了第一个具有正确值的“真实”

触发事件，检索和替换数据。 #dockhouse-reservation-vessel的值显示在alert()中，但不显示在$_POST中。如果我注释掉jQuery的第二个块，那么有问题的select的值会被正确记住。

$('form').delegate('#dockhouse-reservation-owner','change', function(){
    $.ajax({
        url: '/dockhouse/ajax/vessels/' + $(this).val() +  '/',
        success: function(data){
            $('#dockhouse-reservation-vessel').empty();
            $('#dockhouse-reservation-vessel').append(data);
        }
    });
});

data代表option元素：

<!DOCTYPE html>
<option value="">Choose a vessel</option>
<option value="1744">Stinkpot</option>
<option value="1726">Poopy Snoop</option>
<option value="1704">Catchup</option>

下面的data代表一个表格。

$('form').delegate('#dockhouse-reservation-vessel','change',function(){
    $.ajax({
        url: '/dockhouse/ajax/locations-by-reservation-criteria/' + $(this).val() +  '/',
        success: function(data){
            $('#assign-location').empty();
            $('#assign-location').append(data);
        }
    });
});

有什么想法吗？

Answer 1

当您删除并重新插入整个选择框时，状态将被删除。您可以将旧值保存在临时变量中并将其应用于回调：

$('form').delegate('#dockhouse-reservation-vessel','change',function(){
        // save the value
        var oldValue = $(this).val();
        $.ajax({
            url: '/dockhouse/ajax/locations-by-reservation-criteria/' + oldValue +  '/',
            success: function(data){
                $('#assign-location').empty();
                $('#assign-location').append(data);
                // select the old value
                $('#dockhouse-reservation-vessel').val(oldValue);
            }
        });
    });

Answer 2

哇，愚蠢的错误。有一个具有相同名称的选择字段与表ajax响应一起被拉入。羞耻地走开......

即使更改，AJAXed Select表单元素也默认为第一个选项

2 个答案: