Comment mettre à jour la colonne sur un autre changement de colonne dans l'édition en ligne

Question

Gratuit jqgrid contient 3 colonnes: Prix, Quantité et Somme.

Le type d'entrée html5 est utilisé.

Si la colonne Somme est modifiée en édition en ligne, la valeur de la colonne de prix doit calculé en utilisant la formule

Prix = Somme/Quantité;

J'ai essayé de mettre en œuvre ce modèle en utilisant jqGrid ci-dessous, mais il ne change pas la colonne des prix depuis input#Price et input#Quantity sont indéfinis.

Les ID d'élément sont créés à partir de l'ID de ligne et sont différents dans chaque ligne. Jqgrid ne transmet pas la valeur de l'ID de ligne pour changer l'événement.

Quelle est la meilleure pratique dans jqgrid libre pour implémenter de tels calculs?

var sumColumnTemplate = { 
    "editoptions": { 
     "type": "number", 
     "dataEvents":[{"type":"change","fn":function(e) { 
      $('input#Price').val(parseFloat(this.value)/parseFloat( 
       $('input#Quantity').val() )); 
     } 
     } 
}; 

élément inspectez Chrome montre que le balisage suivant est créé pour la ligne en mode d'édition en ligne:

<tr role="row" id="1383" tabindex="-1" class="ui-widget-content jqgrow ui-row-ltr" editable="1" aria-selected="false"> 
    ... lot of td s skipped 

    <td role="gridcell" style="text-align:right;" class="" title="4" aria-describedby="grid_Quantity"><input type="number" class="grid-decimal-edit editable" id="1383_Quantity" name="Quantity" cm="[object Object]" icol="5" role="textbox" style="width: 100%; box-sizing: border-box;"></td> 

    <td role="gridcell" style="text-align:right;" class="" 
    aria-describedby="grid_Price"><input type="number" title="" maxlength="15" class="grid-decimal-edit editable" id="1383_Price" name="Price" cm="[object Object]" icol="6" role="textbox" style="width: 100%; box-sizing: border-box;"></td> 

    <td role="gridcell" style="text-align:right;" title="" aria-describedby="grid_Sum"><input type="number" title="" maxlength="15" class="grid-decimal-edit editable" id="1383_Sum" name="Sum" cm="[object Object]" icol="7" role="textbox" style="width: 100%; box-sizing: border-box;"></td> 
    .... 
</tr> 

tableau

a plusieurs lignes et 1383 dans une partie de id est la ligne probablement nombre qui est différent pour chaque ligne .

Quelle est la meilleure façon d'obtenir des valeurs numériques de la ligne courante en mode édition en ligne?

Bootstrap 3, jquery, jquery-ui, ASP.NET MVC 4, vues rasoir, .NET 4.6 sont utilisés.

Mise à jour

définitions de colonne:

{"label":"Quantity","name":"Quantity","index":"Quantity","searchoptions":{"sopt":["eq","ne","lt","le","gt","ge"],"maxlength":12,"size":12},"template":"number","formatoptions":{"thousandsSeparator":"","decimalPlaces":4,"defaultValue":""},"align":"right","editoptions":{"type":"number","step":"any","min":-999999,"max":9999999,"title":"","maxlength":12,"dataEvents":[{"type":"change","fn":function(e) {dataChanged(e.target)} 
},{"type":"focus","fn":function(e) {if(typeof e.target.ischanged=='undefined') {e.target.ischanged=false}} 
},{"type":"blur","fn":function(e) {} 
}],"readonly":null,"class":"grid-decimal-edit","disabled":null},"editable":function(options){return getEditable(options,false);} 
,"width":68,"classes":"","hidden":false}, 

{"label":"OstuPrice","name":"Price","index":"Price","searchoptions":{"sopt":["eq","ne","lt","le","gt","ge"],"maxlength":15,"size":15},"template":"number","formatoptions":{"thousandsSeparator":"","decimalPlaces":5,"defaultValue":""},"align":"right","editoptions":{"type":"number","step":"any","min":-99999999,"max":999999999,"title":"","maxlength":15,"dataEvents":[{"type":"change","fn":function(e) {dataChanged(e.target)} 
},{"type":"focus","fn":function(e) {if(typeof e.target.ischanged=='undefined') {e.target.ischanged=false}} 
},{"type":"blur","fn":function(e) {} 
}],"readonly":null,"class":"grid-decimal-edit","disabled":null},"editable":function(options){return getEditable(options,false);} 
,"width":75,"classes":"","hidden":false,"tere":"1234"}, 

{"template":sumColumnTemplate 
,"label":"Sum","name":"Sum","width":80,"index":"Sum","hidden":false}, 

Answer 1

Le problème existe parce que vous utilisez template propriété avec l'objet en tant que valeur. À partir de jqGrid 4.7 (voir my old pull request), il est possible de définir des templates "standard" et de les utiliser comme des chaînes.

Un besoin d'utiliser le code suivant pour définir

$.jgrid = $.jgrid || {}; 
$.jgrid.cmTemplate = $.jgrid.cmTemplate || {}; 
$.jgrid.cmTemplate.mySum = { 
    editoptions: { 
     type: "number", 
     dataEvents: [{ 
      type: "change", 
      fn: function(e) { 
       // some code 
      } 
     }] 
    } 
}; 

On peut maintenant utiliser template: "mySum":

{"template":"mySum","label":"Sum","name":"Sum","width":80} 

au lieu de template: sumColumnTemplate:

{"template":sumColumnTemplate,"label":"Sum","name":"Sum","width":80, 
"index":"Sum","hidden":false}