J'ai une simple modification en ligne dans ma grille, et je veux commettre le changement lorsque l'utilisateur onglets de la zone de texte. Le comportement par défaut de JQGRID oblige l'utilisateur à appuyer sur «Entrée» pour commettre la modification, mais cela n'est pas intuitif pour nos utilisateurs.
P>
onSelectRow: function(id) {
$(gridCoreGroups).editRow(id, true, undefined, function(response)
{
alert("hello world");
}
}
6 Réponses :
Ma solution consistait à utiliser des sélecteurs et des événements de base JQuery et des événements indépendamment de la grille pour détecter cet événement. J'utilise les événements en direct et flou sur les zones de texte de la grille pour capturer l'événement. Les deux événements ne sont pas pris en charge en combinaison les uns avec les autres. Ce piratage a donc fini par être la solution:
simuler "la mise au point" et "flou" dans JQuery .Live ( ) Méthode
Pour la modification en ligne, vous pouvez accomplir de plusieurs manières. Pour lier un événement Onblur dans le champ Entrée à l'aide de la gâchette ONSElectrow, éliminez la nécessité de modifier les boutons Modifier et d'enregistrer, faites quelque chose comme ceci:
$('#gridId').setGridParam({afterEditCell: function(id,name,val,iRow,iCol){
//Modify event handler to save on blur.
$("#"+iRow+"_"+name,"#gridId").bind('blur',function(){
$('#gridId').saveCell(iRow,iCol);
});
}});
Nice Exemple @jon toujours, il a des problèmes si la cellule est une date avec une date picker et ne reçoit pas le champ choisi dans le sélecteur et donne une erreur JavaScript
Dans le dernier exemple, '#uploadtable' devrait être '#gridid'?
Correct. Merci@morgar. Fixé.
Il y a encore une autre "#uploadtable" dans l'exemple;)
Ceci est assez horrible, mais c'est mon problème sur ce problème, et est prob un peu plus facile et plus générique - il appuie sur une presse saisie par programme lorsque l'article perd de la mise au point :)
afterEditCell: function() {
//This code saves the state of the box when focus is lost in a pretty horrible
//way, may be they will add support for this in the future
//set up horrible hack for pressing enter when leaving cell
e = jQuery.Event("keydown");
e.keyCode = $.ui.keyCode.ENTER;
//get the edited thing
edit = $(".edit-cell > *");
edit.blur(function() {
edit.trigger(e);
});
},
Ce n'est peut-être pas jolie - mais c'est générique - et cela fonctionne pour le texte et les déposées dans la même ligne. Merci de fournir généreusement votre réponse.
Je sais que cette question est ancienne si la réponse est obsolète.
Une variable globale appelée litiveel doit être créée et ajoutée au code JQGRID P>
onSelectRow: function (id) {
if (!status)//deselected
{
if ($("tr#" + lastsel).attr("editable") == 1) //editable=1 means row in edit mode
jQuery('#list1').jqGrid('saveRow', lastsel);
}
if (id && id !== lastsel) {
jQuery('#list1').jqGrid('restoreRow', lastsel);
jQuery('#list1').jqGrid('editRow', id, true);
lastsel = id;
}
},
J'ai eu le même problème et j'ai essayé les réponses ci-dessus. À la fin, je suis allé avec une solution qui insère une touche "ENTER" Appuyez sur lorsque l'utilisateur quitte l'onglet.
// Call this function to save and unfinished edit
// - If an input exists with the "edit-call" class then the edit has
// not been finished. Complete the edit by injecting an "Enter" key press
function saveEdits() {
var $input = $("#grid").find(".edit-cell input");
if ($input.length == 1) {
var e = $.Event("keydown");
e.which = 13;
e.keyCode = 13;
$input.trigger(e);
}
}
Au lieu d'utiliser onCellSelect: function (row, col, content, event) {
if (row != lastsel) {
grid.jqGrid('saveRow', lastsel);
lastsel = row;
}
var cm = grid.jqGrid("getGridParam", "colModel");
//keep it false bcoz i am calling an event on the enter keypress
grid.jqGrid('editRow', row, false);
var fieldName = cm[col].name;
//If input tag becomes blur then function called.
$("input[id^='"+row+"_"+fieldName+"']","#gridId").bind('blur',function(e){
grid.jqGrid('saveRow', row);
saveDataFromTable();
});
//Enter key press event.
$("input[id^='"+row+"_"+fieldName+"']","#gridId").bind('keypress',function(e){
var code = (e.keyCode ? e.keyCode : e.which);
//If enter key pressed then save particular row and validate.
if( code == 13 ){
grid.jqGrid('saveRow', row);
saveDataFromTable();
}
});
}