web-dev-qa-db-fra.com

Comment obtenir une valeur de cellule de ligne sélectionnée dans jqGrid

Est-ce que quelqu'un sait comment obtenir la valeur de cellule de la ligne sélectionnée de JQGrid? J'utilise mvc avec JQGrid, je veux accéder à la valeur de la colonne cachée de la ligne sélectionnée?

32
Saad

Tout d'abord, vous pouvez obtenir le rowid de la ligne sélectionnée en respectant la méthode getGridParam et 'selrow' comme paramètre, puis vous pouvez utiliser getCell pour obtenir la valeur de la cellule de la colonne correspondante:

var myGrid = $('#list'),
    selRowId = myGrid.jqGrid ('getGridParam', 'selrow'),
    celValue = myGrid.jqGrid ('getCell', selRowId, 'columnName');

Le 'columnName' devrait être le même nom que vous utilisez dans le 'name' propriété du colModel. Si vous avez besoin de valeurs provenant de nombreuses colonnes de la ligne sélectionnée, vous pouvez utiliser getRowData au lieu de getCell .

85
Oleg

Vous pouvez utiliser de cette manière aussi

var rowId =$("#list").jqGrid('getGridParam','selrow');  
var rowData = jQuery("#list").getRowData(rowId);
var colData = rowData['UserId'];   // perticuler Column name of jqgrid that you want to access
14
Mitul Maheshwari

Juste pour ajouter, vous pouvez également récupérer une valeur de cellule jqGrid, basée sur le rowID plus l'index de la colonne (plutôt que sur le nom de la colonne):

Ainsi, pour récupérer la valeur dans la quatrième colonne (index de colonne n ° 3) de la ligne avec la clé primaire 1234, nous pourrions utiliser ceci:

var rowID = 1234;
var columnIndex = 3;
var cellValue = $("#" + rowID).find('td').eq(columnIndex).text();

Btw, sur un sujet complètement sans rapport (mais s'il vous plaît ne me méprenez pas):

Je ne savais pas que vous pouviez assez facilement lier des zones de texte à votre jqGrid afin que vos utilisateurs puissent effectuer une recherche instantanée sans avoir à ouvrir la boîte de dialogue Rechercher.

enter image description here

Pour ce faire, vous avez besoin d’un peu de HTML comme ceci:

<input type="text" name="employeeName" id="employeeName" style="width:250px" />

<!--  This will be my jqGrid control and pager -->
<table id="tblEmployees"></table>
<div id="pager"></div>

Et un peu de JavaScript comme ça:

$("#employeeName").on('change keyup paste', function () {
    SearchByEmployeeName();
});

function SearchByEmployeeName()
{
    //  Fetch the text from our <input> control
    var searchString = $("#employeeName").val();

    //  Prepare to pass a new search filter to our jqGrid
    var f = { groupOp: "AND", rules: [] };

    //  Remember to change the following line to reflect the jqGrid column you want to search for your string in
    //  In this example, I'm searching through the UserName column.

    f.rules.Push({ field: "UserName", op: "cn", data: searchString });

    var grid = $('#tblEmployees');
    grid[0].p.search = f.rules.length > 0;
    $.extend(grid[0].p.postData, { filters: JSON.stringify(f) });
    grid.trigger("reloadGrid", [{ page: 1 }]);
}

Ceci change vraiment la donne pour moi ... cela rend vraiment jqGrid beaucoup plus convivial.

Les utilisateurs peuvent immédiatement commencer à taper dans leur chaîne de recherche, sans avoir à ouvrir la boîte de dialogue de recherche, n'oubliez pas de changer l'opérateur en "contient", puis commencez à taper et fermez à nouveau la boîte de dialogue de recherche.

4
Mike Gledhill

Utilisez "selrow" pour obtenir l'identifiant de la ligne sélectionnée

var myGrid = $('#myGridId');

var selectedRowId = myGrid.jqGrid("getGridParam", 'selrow');

puis utilisez getRowData pour obtenir la ligne sélectionnée à l'index selectedRowId.

var selectedRowData = myGrid.getRowData(selectedRowId);

Si multiselect est défini sur true sur jqGrid, utilisez "selarrrow" pour obtenir la liste des lignes sélectionnées:

var selectedRowIds = myGrid.jqGrid("getGridParam", 'selarrrow');

Utilisez loop pour parcourir la liste des lignes sélectionnées:

var selectedRowData;

for(selectedRowIndex = 0; selectedRowIndex < selectedRowIds .length;selectedRowIds ++) {

   selectedRowData = myGrid.getRowData(selectedRowIds[selectedRowIndex]);

}

3
Arun Garg

Just Checkout This:

Solution 1:

Dans la fonction de sous-réseau, vous devez écrire ce qui suit:

var selectid = $(this).jqGrid('getCell', row_id, 'id');
alert(selectid);

row_id est la variable que vous définissez dans la sous-grille en tant que paramètre. Et id est le nom de la colonne pour laquelle vous souhaitez obtenir la valeur de la cellule.

Solution 2:

Si vous obtenez l'ID de la ligne Jqgrid dans alert, définissez l'ID de votre clé principale sur key:true Dans ColModels. Donc, vous obtiendrez la valeur de votre identifiant de base de données en alerte. Comme ça :

{name:"id",index:"id",hidden:true, width:15,key:true, jsonmap:"id"},
1
Sachin Sanchaniya

vous devez déclarer de vars ...

var selectedRowId = $('#list').jqGrid ('getGridParam', 'selrow');
var columnName = $('#list').jqGrid('getCell', selectedRowId, 'columnName');

var nombre_img_articulo = $ ('# list'). jqGrid ('getCell', selectedRowId, 'img_articulo');

1
Sici