2011-12-17 22 views
2

「カスタム編集モード」でjqgridを使用する際に問題が発生しました。 私は各行の編集/保存/キャンセル/削除のボタンでグリッドを正しく構築しました。 ボタンごとに、各操作に関数をバインドします(保存、保存など) 私の問題は、フィールドが有効かどうかをチェックしようとすると、検証機能が実行され、エラーダイアログが表示されますが、データベースに送信され、その行は「編集モード」に保持されず、ユーザーはエラーを修正します。Jqgridカスタム編集モードと検証

また、組み込みのエラーダイアログを表示せずに、エラーのあるフィールドを強調表示することも可能かどうかと思います。エラーメッセージはdivに要約として表示されます。

はあなたがbeforeSubmit functionでフォームフィールドを検証することができ、関連するコードをあなたの注意

マイ例えば

// function to retrieve data to jqgrid 
getList(); 

// grid configuration 

$("#list").jqGrid({ 
    datatype: "local", 
    width: 465, 
    colNames: ["ID", "Descrição", ""], 
    colModel: [ 
      { name: "id", index: "id", sorttype: "int", hidden: true }, 
      { name: "descr", index: "descr", editable: true, edittype: "text", editrules: { custom: true, custom_func: checkvalid } 
      }, 
      { name: "action", index: "action", sortable: false, width: 90, search: false} // Botões 

     ], 
    loadtext: 'A carregar...', 
    rowNum: 20, 
    rowList: [20, 40, 80, 100, 200], 
    ignoreCase: true, 
    pager: "#pager", 
    sortname: "id", 
    viewrecords: true, 
    sortorder: "asc", 
    caption: "Gestão de tipos", 

    gridComplete: function() { 
     //load edit buttons 
     var ids = $("#list").jqGrid("getDataIDs"); 
     for (var k = 0; k < ids.length; k++) { 
      var id = ids[k]; 
      var html = ""; 
      html += "<input id=\"btnEdit" + id + "\" type=\"button\" class=\"JQbutton\" value=\"Editar\" onclick=\"jqGrid_editRow('" + id + "');\" />"; 
      html += "<input id=\"btnDelete" + id + "\" type=\"button\" class=\"JQbutton\" value=\"Apagar\" onclick=\"jqGrid_deleteRow('" + id + "');\" />"; 
      html += "<input id=\"btnSave" + id + "\" style=\"display: none;\" class=\"JQbutton\" type=\"submit\" value=\"Guardar\" onclick=\"jqGrid_doSave(" + id + ");\" />"; 
      html += "<input id=\"btnCancel" + id + "\" style=\"display: none;\" class=\"JQbutton\" type=\"button\" value=\"Cancelar\" onclick=\"jqGrid_restoreRow('" + id + "');\" />"; 
      $("#list").jqGrid("setRowData", id, { action: html }); 
     } 
    } 

}); 


function checkvalid(value, colname) { 
    //-... code to validate field 

    return [false, "testing validation"]; 

} 

答えて

6

、ありがとうございました。この関数では、フィールドを検証し、必要な要素にハイライトクラスを追加できます。次のようなことができます:

beforeSubmit: function(postdata, formid){ 
     //more validations 
     if ($('#exec').val()==""){ 
       $('#exec').addClass("ui-state-highlight"); 
       return [false,'ERROR MESSAGE']; //error 
     } 
     return [true,'']; // no error 
}, 
関連する問題