Javascript Girl
  1. Javascript Girl
  3. JqGrid showCol / hideCol ne fonctionne pas après le tri
Intereting Posts
L'orientation de Google Map suit les emplacements spécifiques Cordova: Pause événement sans tir Qu'est-ce que le signe $ signifie dans Jquery ou JavaScript? Vérifier si Internet et un site particulier sont en mode JavaScript / AJAX Trouver le 10001ème numéro premier – Projet Euler Bibliothèque de conversion de l'unité de mesure Existe-t-il une fonction comme IsNumeric en JavaScript pour valider les nombres? JQuery AJAX Call to PHP Script avec JSON Return Comment définir setter / getter sur le prototype Téléchargement de fichier javascript Redimensionner la hauteur du Iframe du domaine transversal Insérer du texte au curseur dans un div Méthodes WebView sur la même erreur de thread Le type de Javascript est «instable» – comment puis-je contourner cela? Détecter la version complète Internet Explorer avec javascript?

JqGrid showCol / hideCol ne fonctionne pas après le tri

Le code ci-dessous illustre ce que j'ai fait pour cacher / afficher. Il fonctionne sur la charge mais ne fonctionnerait pas après le tri 

grid.jqGrid({ url: "processing.php", datatype: "json", mtype: "POST", postData: { "sessionTicket": "<?php echo $sessionTicket; ?>" }, colNames: ["Details", "Name", "Address", "Date"], colModel: [ { id: "details", name: "Details", width: 200, classes: 'pointer wrap', formatter: function matterFormatter(cellvalue, options, rowObject) { if (rowObject.properties == undefined) { name = rowObject.name; address = rowObject.address; } else { name = rowObject.properties.name; address = rowObject.properties.address; } details = '<strong> ' + name + '</strong> </br><strong> ' + address + '</strong>'; return details; }, sorttype: function (cell, obj) { name = obj.name; return name; } }, { name: "name", jsonmap: "properties.name", width: 200, classes: 'pointer wrap', hidden: true }, { name: "address", jsonmap: "properties.address", width: 100, classes: 'wrap' }, { name: "date", jsonmap: "properties.3", width: 55, formatter: 'date', formatoptions: { srcformat: 'u', newformat: 'd MY' }, sortable: true, sorttype: 'date' } ], pager: "#pager", //rowNum: 20, rowNum: 100, rowList: [10, 20, 30], sortname: "matter", sortorder: 'asc', viewrecords: true, gridview: true, loadonce: true, autoencode: true, height: 'auto', hidegrid: false, caption: "Details", jsonReader: { repeatitems: false }, loadComplete: function () { $("#list").setCaption('Jqgrid <input type="button" id="chooseField" value="Select Fields" title="Click to Select Fields" />'); var $dialog = $('<div></div>') .html('<form id="myform" >' + '<input type="checkbox" id="selectAll" value="selectAll" onClick="allField()" /><strong><label for="selectAll">Select All</label></strong><br />' + '<input type="checkbox" id="details" value="details" checked /><label for="details">Details</label><br />' + '<input type="checkbox" id="name" value="name" checked /><label for="name">Name</label><br />' + '<input type="checkbox" id="address" value="address" checked/><label for="address" checked>Address</label><br />' + '<input type="checkbox" id="date" value="date" checked/><label for="date" checked>Date</label><br />' + '</form>') .dialog({ autoOpen: false, title: 'Select Fields ', height: 300, width: 350, position: [2, 28], buttons: { "OK": function () { field(); $(this).dialog("close"); }, "Cancel": function () { $(this).dialog("close"); } } }); $('#chooseField').click(function () { $dialog.dialog('open'); return false; }); $('form#myform').submit(function () { $(this).find('input[type="checkbox"]').each(function () { if ($(this).is(':checked') == true) { alert($(this).val()); } }) }); } }); function field() { if ($('#Details').is(':checked') == true) { $('#list').showCol('Details'); } else { $('#list').hideCol('Details'); } if ($('#name').is(':checked') == true) { $('#list').showCol('name'); } else { $('#list').hideCol('name'); } if ($('#address').is(':checked') == true) { $('#list').showCol('address'); } else { $('#list').hideCol('address'); } if ($('#date').is(':checked') == true) { $('#list').showCol('date'); } else { $('#list').hideCol('date'); } }

Toute aide est appréciée. J'espère que ce serait un réglage mineur serait excellent si quelqu'un pouvait m'aider dans ce merci à l'avance

Désolé mais ce que vous attendez avec l'affichage de ce code? Il semble que vous l'obtenez des ordures. Ce n'est pas poli pour les lecteurs!

Néanmoins, le code a clairement au moins deux problèmes:

  1. loadComplete de dialogue à l'intérieur de loadComplete qui sera exécuté à plusieurs reprises (par exemple, après le tri, la pagination, etc.) Il semble que vous deviez déplacer le code et le placer après la création de la grille. De la même manière, il faut lier $('#chooseField').click(...) et $('form#myform').submit(...) une fois et pas à chaque fois sur l'exécution de loadComplete .
  2. Vous utilisez les attributs d' id dans <form> qui sont identiques aux propriétés de name dans colModel . Cela pourrait suivre des problèmes avec des doublons d'identification si vous souhaitez utiliser l'édition de formulaire par exemple. Il me semble que vous pouvez réécrire le code de formulaire et la liaison à des cases à cocher sans utilisation et les attributs d' id du tout.