1

私はjqGridが初めてで、単純なjqGridを機能させようとしました。

http://www.trirand.com/blog/jqgrid/jqgrid.htmlからコードをコピーし て html ファイルに入れ、firefox で開きましたが、グリッドはデータを正常にロードできません

ここにhtmlがあります：

<html>
<head>
    <link rel="stylesheet" type="text/css" href="http://www.trirand.com/blog/jqgrid/themes/redmond/jquery-ui-1.8.1.custom.css"/>
    <link rel="stylesheet" type="text/css" href="http://www.trirand.com/blog/jqgrid/themes/ui.jqgrid.css"/>
    <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery-ui-1.8.1.custom.min.js"></script>

        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery.layout.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/ui.multiselect.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery.jqGrid.min.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery.tablednd.js"></script>
        <script type="text/javascript" src="http://www.trirand.com/blog/jqgrid/js/jquery.contextmenu.js"></script>
    </head>
<body>
    <table id="list2">
        </table><div id="pager2"></div>
</body>
<script type="text/javascript">
    jQuery("#list2").jqGrid({
    url:'http://www.trirand.com/blog/jqgrid/server.php?q=2',
    datatype: "json",
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90},
        {name:'name',index:'name asc, invdate', width:100},
        {name:'amount',index:'amount', width:80, align:"right"},
        {name:'tax',index:'tax', width:80, align:"right"},      
        {name:'total',index:'total', width:80,align:"right"},       
        {name:'note',index:'note', width:150, sortable:false}       
    ],
    rowNum:10,
    rowList:[10,20,30],
    pager: '#pager2',
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    caption:"JSON Example"
});
jQuery("#list2").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false});

</script>
</html>
4

2 に答える 2

2

あなたが投稿したコードには多くの問題があります。

最初のものurl:'http://www.trirand.com/blog/jqgrid/server.php?q=2'は間違っています。Web ブラウザーで URL を開いて結果を表示することはできますが、同一オリジン ポリシーと呼ばれる重要なセキュリティ制限のため、Ajax 要求では使用できません。JSON データは、彼自身の Web サイトからのみ取得できます。したがって、たとえば、によって返されたデータをurl:'http://www.trirand.com/blog/jqgrid/server.php?q=2'のようなファイルに保存してmy.json使用することができますurl: 'my.json'。あなたのコードが動作する場合。

次の問題は、 の前に何らかの形式の<!DOCTYPE html ...ステートメントを含める必要があることです<html>。それは本当に重要です!!! これを行わないと、Web ブラウザーは Internet Explorer ブラウザーで IE5 などの非常に古いブラウザーの動作をシミュレートしようとします。このようなモードには、 quirks モードという名前があります。

次の問題は<script>、<body>. このような HTML バリデーターでページを検証することをお勧めします。

の中に JavaScript コードを配置することをお勧めします$(function(){/*place code here*/});。詳細については、 jQuery.readyを参照してください。

于 2012-06-14T10:23:28.840 に答える
1

呼び出しているURL

http://www.trirand.com/blog/jqgrid/server.php?q=2

エラーを返しています：

警告：145行目の/home/trirand/public_html/blog/jqgrid/server.phpのゼロ除算クエリを実行できませんでした。SQL構文にエラーがあります。1行目の''の近くで使用する正しい構文については、MySQLサーバーのバージョンに対応するマニュアルを確認してください。

最初にデータクエリを機能させる必要があります:-)

何か問題が発生した場合に意味のあるエラーメッセージを表示できるように、ロードエラーを処理することもおそらく価値があります。ここに完全な議論があります：

JQGridにサーバー送信エラーを認識させるにはどうすればよいですか？

于 2012-06-14T03:12:59.807 に答える