0

JqG​​rid の動作がおかしい。データベース内のテーブルを参照する jqGrid を含むマスターページを作成するだけです。

このページは完全に機能しています。次に、同じロジックを使用する必要があり、正確なページを追加のphpファイルでコピーし、適切なテーブルを指すように調整を作成します。

私のマスターページ(部門ページ-最初のページ(100%動作))では、jqgrid関数は正常に機能していますが、最初のページに基づく2番目と3番目のページでは、jqgridが奇妙に動作しています。

新しい値を作成するか、いくつかの値を更新すると、jqgrid は新しいデータでグリッドを自動的にリロードする必要があります。しかし、私の場合、グリッドはデータをリロードしますが、まったく書き込みません。

この奇妙な動作は、最初の jQGrid ページ (dept ページ) では発生しません。

より明確にするためにスクリーンショットも挿入します

まず、ページをリロードします。 firebug コンソールには、サーバーから JSON データをロードしていると書かれています

次に、いくつかの php ファイルを参照して、単純にグリッドに値を追加します。値が実行され、データベースに格納されます。このメソッドは POST メソッドを使用します。

POST データをテキストボックスから db に送信する

次に、jQgrid はデータベースから新しいデータを自動的に取得し、GRID に書き込む必要があります。しかし、私のケースでは、グリッドはデータを書き込んでいません。

新しいデータを取得し、グリッドに書き込む必要がありますが、そうではありません:(

スクリーン ショットの右下を見るとわかるように、11 個の値がありますが、最初のスクリーンショットでは 10 個しかありません。したがって、グリッドは実際に INSERT ステートメントを実行しますが、リロードすると壊れます。

これを克服する方法はありますか?? ありがとうございました。

編集済み: HTML コード:

<table id="location"><tr><td /></tr></table>
<div id="pager-location"></div>

JavaScript コード:

$(document).ready(function() {
    //alert("start");
    jQuery("#location").jqGrid({
        mtype:'GET',
        url:'functions/get_location.php',
        editurl:'functions/edit_location.php',
        datatype: "JSON",
        colNames:['Location ID','Location'],
        colModel:[
            {name:'idms_location',index:'idms_location', width:150, editable:true,add:true, del:true, key:true},
            {name:'location',index:'location', width:800,editable:true, add:true, del:true}     
        ],
        loadComplete: function () {
        alert("OK");
        },    
        loadError: function (jqXHR, textStatus, errorThrown) {
            alert('HTTP status code: ' + jqXHR.status + '\n' +
                  'textStatus: ' + textStatus + '\n' +
                  'errorThrown: ' + errorThrown);
            alert('HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
        },
        rowNum:10,
        rowList:[5,10,15],
        pager: '#pager-location',
        sortname: 'idms_location',
        viewrecords: true,
        jsonReader: {repeatitems: true, idms_location: "idms_location" },
        sortorder: "asc",
        caption:"MSC Locations"
    });
    jQuery("#location").jqGrid('navGrid','#pager-location',{edit:true,add:true,del:true},{},{},{},{closeAfterSearch:true},{});
    jQuery("#location").jqGrid('gridResize',{minWidth:350,maxWidth:850,minHeight:80, maxHeight:350});
    //alert("end");
});
4

1 に答える 1

1

あなたが使用したコードを確認したところ、その理由がわかりました。コードに重複した問題がありましid<table>jqGrid に使用される要素を次のように定義しました

<table id="location"><tr><td /></tr></table>
<div id="pager-location"></div>

"location"として持っていidます。後で定義した

colModel: [
    {name:'idms_location',index:'idms_location', width:150, editable:true,add:true, del:true, key:true},
    {name:'location',index:'location', width:800,editable:true, add:true, del:true}     
],

名前locationは列名として使用されます。id問題は、グリッドのさまざまな要素の名前を作成するために列名が使用されることです。さらに、フォーム編集では、場所を表すフィールドの値として列名を直接使用しますid<input>。Add form の使用後、次の要素

<input name="location" class="FormElement ui-widget-content ui-corner-all" id="location" role="textbox" type="text">

ページにも存在しid="location"ます。ユーザーがフォームを閉じると、非表示になりますが、破棄されません。編集フォームは、次の行で使用される にページに配置されるため、テーブルが見つからず、グリッドは空のままです。<table id="location">$("#location tbody:first")

やるべきことは、名前を grid-location">` の<table id="location">ようなものに変更するか<table id="、他の名前を選択するだけです。対応する JavaScript コードを更新する必要があります。

グリッドで行うべきその他の変更:

  • に変更jsonReader: {repeatitems: true, idms_location: "idms_location" }jsonReader: {id: "idms_location" }ます。
  • gridview: trueオプションを追加。
  • autoencode: trueオプションを追加。
  • add:true, del:trueから存在しないオプション プロパティを削除しますcolModel
  • indexからプロパティを削除しますcolModel
  • Content-Typeサーバー応答で使用する HTTP ヘッダーを JSON データで修正する必要があります。Content-Type: application/json現在使用しているものの代わりに使用する必要がContent-Type: text/htmlあります。これはたった 1 行の PHP コードです。
  • {edit:true,add:true,del:true}のオプションを削除できますnavGrid-これはデフォルトのオプションです。
于 2013-07-02T08:55:44.157 に答える