jqGrid besoin d'un champ modifiable sur la boîte de dialogue Ajouter mais pas de dialogue Modifier

Je suis d'essayer d'utiliser jqGrid dans mon ASP.Net l'application MVC et ont une exigence que certaines colonnes arre modifiable dans la boîte de dialogue Ajouter mais ne pas la boîte de dialogue d'Édition. Apparemment, la façon de le faire est d'utiliser le beforeShowForm d'événements javascript et définissez les propriétés sur le champ de saisie.

Jusqu'à présent, je n'arrive pas à obtenir le beforeShowForm cas d'incendie. Ci-dessous est un exemple que j'ai trouvé sur un autre DONC, la question mais jusqu'à présent, je n'ai pas réussi à le faire fonctionner. Est-il une astuce qui m'échappe? J'utilise la dernière version 3.8 de jqGrid.

Contrôleur:

 [Authorize]
 public ActionResult Index()
 {
      var gridModel = new MyGridModel();
      SetUpGrid(gridModel.MyGrid);
      return View(gridModel);
 }

 private void SetUpGrid(JQGrid grid)
 {
        grid.DataUrl = Url.Action("GridDataRequested");
        grid.EditUrl = Url.Action("EditRows");
        grid.ToolBarSettings.ShowSearchToolBar = false;

        grid.ToolBarSettings.ShowEditButton = true;
        grid.ToolBarSettings.ShowAddButton = true;
        grid.ToolBarSettings.ShowDeleteButton = true;
        grid.ToolBarSettings.ShowRefreshButton = true;
        grid.EditDialogSettings.CloseAfterEditing = true;
        grid.AddDialogSettings.CloseAfterAdding = true;

        grid.EditDialogSettings.Modal = false;
        grid.EditDialogSettings.Width = 500;
        grid.EditDialogSettings.Height = 300;

        grid.ClientSideEvents.GridInitialized = "initGrid";
 }

Modèle:

public class MyGridModel
{
    public JQGrid MyGrid { get; set; }

    public MyGridModel()
    {
      MyGrid = new JQGrid
      {
        Columns = new List<JQGridColumn>()
        {
            new JQGridColumn { DataField = "id", 
                               PrimaryKey = true,
                               Visible = false,
                               Editable = false },
            new JQGridColumn { DataField = "username", 
                               Editable = true,
                               EditFieldAttributes = new List<JQGridEditFieldAttribute>()
                               {
                                     new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
                                     new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
                                },
                                Width = 100},
            new JQGridColumn { DataField = "domain", 
                               Editable = true,
                               EditFieldAttributes = new List<JQGridEditFieldAttribute>()
                               {
                                    new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
                                    new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
                                },
                                Width = 100}
              }
          }
     }
}

Vue:

function initGrid() {

  jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
            { }, //options
            { //edit options
                beforeShowForm: function(frm) {
                    alert("beforeShowForm edit");
                }
            },
            { //add options
                beforeShowForm: function(frm) {
                    alert("beforeShowForm add");
                }
            },
            { }, //del options
            { } //search options
        );
}

<div>           
    <%= Html.Trirand().JQGrid(Model.MyGrid, "myGrid") %>
</div>

OriginalL'auteur sipwiz | 2010-10-16

asp.net-mvc jqgrid

Il me semble que la réponse à votre question, vous trouverez ici et ici (regardez l'exemple aussi).

Mis à JOUR: je ne sais pas commertial version de jqGrid. Si vous n'avez pas de régler vos prblem vous devriez poster votre question mieux dans le forum http://www.trirand.net/forum/default.aspx.

Si je comprends votre code correct, vous pouvez essayer de supprimer la définition des attributs readonly et disabled (JQGridEditFieldAttribute) à partir de la EditFieldAttributes. Au lieu de cela, vous pouvez essayer de faire la suite

Si vous voulez montrer readonly champs "nom d'utilisateur" et "domaine" dans la boîte de dialogue d'édition vous pouvez faire à la suite

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { recreateForm: true, //edit options
                           beforeShowForm: function(form) {
                               $('#username',form).attr('readonly','readonly');
                               $('#domain',form).attr('readonly','readonly');
                           }
                         });

ou sans l'utilisation de recreateForm: true option:

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { //edit options
                           beforeShowForm: function(form) {
                               $('#username',form).attr('readonly','readonly');
                               $('#domain',form).attr('readonly','readonly');
                           }
                         },
                         { //add options
                           beforeShowForm: function(frm) {
                               $('#username',form).removeAttr('readonly');
                               $('#domain',form).removeAttr('readonly');
                           }
                         });

Si vous voulez ne pas afficher les champs "nom d'utilisateur" et "domaine" dans la boîte de dialogue d'édition que vous pouvez faire

jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
                         { }, //options
                         { recreateForm: true, //edit options
                           beforeShowForm: function(form) {
                               $('#username',form).hide();
                               $('#domain',form).hide();
                           }
                         });

Il faut travailler dans la version gratuite de l'jqGrd, mais parce que vous utilisez SetUpGrid lequel le programme d'installation ome paramètres de jqGrid barre de navigation (comme grid.ToolBarSettings.ShowEditButton = true). Vous utilisez également

grid.ClientSideEvents.GridInitialized = "initGrid"

Je ne suis pas sûr de ce que vous pouvez faire à l'intérieur de initGrid fonction. Probablement, vous devez définir quelques autres callbackes au lieu de l'appeler de jQuery("#myGrid").jqGrid('navGrid', ...);. Regardez http://www.trirand.net/documentation/aspnet/_2s20v9uux.htm et http://www.trirand.com/blog/phpjqgrid/docs/jqGrid/jqGridRender.html#methodsetNavOptions

Ils sont les exemples que j'ai été d'essayer de se mettre au travail, mais en vain. Dans mon exemple ci-dessus, vous savez ce 'navGrid' et '#myGrid-pager"?
vous devez inclure le code (le code plus le mieux) qui définit votre jqGrid dans votre question et de décrire les champs que vous souhaitez exactement permettre d'être modifié dans la boîte de dialogue Ajouter.
J'ai étendus mon exemple de code. Le nom d'utilisateur et le domaine des champs sont ceux que je veux être en mesure de l'utiliser sur l'Ajout d'écran, mais pas l'écran de modification.

OriginalL'auteur Oleg

J'ai fini par acheter la version de payer pour de jqGrid - le temps que je économiser en étant en mesure d'utiliser un chiffon propre .Net modèle d'objet par rapport à javascript va payer pour lui-même en un rien de temps.

La réponse à cette question directement Trirand soutien est.

Vous pouvez utiliser les événements côté client AfterEditDialogShown et AfterAddDialogShown pour désactiver/activer les champs d'édition pour les deux boîtes de dialogue. Le domaine de l'édition/ajout auront le même ID est le champ de données (sensibles à la casse). Exemple:

Modèle:

JQGrid1.ClientSideEvents.AfterEditDialogShown="disableFields";
JQGrid1.ClientSideEvents.AfterEditDialogShown="enableFields";

Vue:

<script type="text/javascript">

    function disableFields() {
        //jQuery("#fieldname").attr("disabled", "disabled");
        $("#Source").attr("disabled", "true");
        $("#ProgramName").attr("disabled", "true");
        $("#Division").attr("disabled", "true");
        $("#Medium").attr("disabled", "true");
        $("#content").attr("disabled", "true");
    }

    function enableFields() {
        $("#Source").attr("disabled", "false");
        $("#ProgramName").attr("disabled", "false");
        $("#Division").attr("disabled", "false");
        $("#Medium").attr("disabled", "false");
        $("#content").attr("disabled", "false");
    }

</script>

OriginalL'auteur sipwiz

Solution actuelle: jqGrid 4.5.4 - jQuery Grille

Après ces lignes à editGridRow (ligne 7447)

if (rowid === "new") {
    rowid = "_empty";
    frmoper = "add";
    p.caption=rp_ge[$t.p.id].addCaption;
} else {
     p.caption=rp_ge[$t.p.id].editCaption;
     frmoper = "edit";
}

J'ai mis cette modification

$t.p.custom_frmoper = frmoper;

Alors je peux décider quoi faire avec les éléments de la Popup de MODIFIER et de Popup AJOUTER

$.ajax($.extend({
url: $.isFunction(options.dataUrl) ? options.dataUrl.call($t, rowid, vl, String(options.name)) :      options.dataUrl,
type : "GET",
dataType: "html",
data: $.isFunction(postData) ? postData.call($t, rowid, vl, String(options.name)) : postData,
context: {elem:elem, options:options, vl:vl},
success: function(data){
var ovm = [], elem = this.elem, vl = this.vl,
options = $.extend({},this.options),
msl = options.multiple===true,
a = $.isFunction(options.buildSelect) ? options.buildSelect.call($t,data) : data;
if(typeof a === 'string') {
a = $( $.trim( a ) ).html();
}
if(a) {
$(elem).append(a);
setAttributes(elem, options, postData ? ['postData'] : undefined);
//CUSTOM CODE
$.each($t.p.colModel, function (i, current) {
if (current.not_editable) {
if ($t.p.custom_frmoper == 'edit') {
$("#" + current.name).attr('readonly', 'readonly');
$("#" + current.name).attr('disabled', 'disabled');
}
else {
$("#" + current.name).removeAttr('readonly');
$("#" + current.name).removeAttr('disabled');
}
}
});

J'ai aussi ajouté une coutume not_editable attribut de la colonne modèle de décider qu'une colonne spécifique est modifiable lors de l'AJOUT et de la lecture seule lorsque MODIFIYING

{ name: 'ID', index: 'ID', not_editable: true }

J'espère que cela aide. J'ai créé cette modification car, SÉLECTIONNEZ les éléments ne fonctionne pas avec les solutions actuelles dans ce fil.

OriginalL'auteur Aquiles

Vous devez vous connecter pour publier un commentaire.