序列化sortables无法正常工作

时间:2012-06-14 22:53:02

标签: jquery

我已经尝试了一切但仍然失败了!这段代码出了什么问题?!?!我想得到序列化的可排序,就这么简单,但我看了SO并找到了片段..应用我的代码,它仍然无法正常工作。这根本没有意义。我确实看到了可能的错误(是的,有jQuery doc指定的set_number)......但仍然无效。

 <html>
<body>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'>
    </script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js">
    </script>
    <script>

$(function() {
    $( "#sortable" ).sortable();
    $( "#sortable" ).disableSelection();     
});

    $("form").submit(function(){         
    $('#thedata').val($( "#sortable" ).sortable("serialize"));
    return false;        
    });

    </script>
    <h1>
        Filters For Tables
    </h1>
    <h2>
        Filters for Assets
    </h2>
    <form action="validate.php" method="post">
        <input type='text' name='thedata' id='thedata' />
        <ul id="sortable">
            <li id="foo_0">ID</li>
            <li id="foo_1">TIME LOG</li>
            <li id="foo_2">DEVICE TYPE</li>
            <li id="foo_3">CHASSIS TYPE</li>
            <li id="foo_4">PARENT ID</li>
            <li id="foo_5">PARENT</li>              
        </ul>
        <input type="submit" name="submit" id="submit" value="Update" />
    </form>
</body>

 </html>

2 个答案:

答案 0 :(得分:3)

表单元素不存在。您必须在DOM准备好时绑定事件。移动它:

$("form").submit(function(){         
    $('#thedata').val($( "#sortable" ).sortable("serialize"));
    return false;        
});

这个函数:$(function(){}); 它适用于JSFiddle,因为我认为在加载DOM时会调用JavaScript。

答案 1 :(得分:0)

从html中剥离出来似乎对我没问题。 http://jsfiddle.net/Zfu6N/

我注意到你没有使用有效的doctype,例如:

<!doctype html>

或者例如

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

这可能会使浏览器陷入奇怪的模式。

这可能只是因为你在你的例子中遗漏了它,但以防万一。