Pulsante jQuery clic su aggiornamento di jqGrid che si attiva solo una volta

Question

Ho il seguente codice jQuery che sto usando per popolare un jqGrid. Funziona perfettamente la pubblicazione sulla mia pagina ASP.NET MVC al primo clic del pulsante. Il mio problema è
, qualsiasi altro clic oltre il primo sembra scorrere attraverso il codice jquery quando si fa clic sul pulsante, ma non lo fa mai alla pagina POST. Qualche idea, perché?

<script type="text/javascript"> 

     $(document).ready(function() { 
      $('#btnSubmit').click(function() { 

       /* Refreshes the grid */ 
       $("#list").jqGrid({ 
        /* The controller action to get the grid data from */ 
        url: '/CRA/AddPart', 
        data: { partNumber: "123"}, 
        datatype: 'json', 
        mtype: 'GET', 
        /* Define the headers on the grid */ 
        colNames: ['col1', 'col2', 'col3', 'col4'], 
        /* Define what fields the row columns come from */ 
        colModel: [ 
        { name: 'col1', index: 'invid', width: 290 }, 
        { name: 'col2', index: 'invdate', width: 290 }, 
        { name: 'col3', index: 'amount', width: 290, align: 'right' }, 
        { name: 'col4', index: 'tax', width: 290, align: 'right'}], 
        height: 'auto', 
        rowNum: 10, 
        rowList: [10, 20, 30], 
        sortname: 'id', 
        sortorder: "desc", 
        viewrecords: true, 
        imgpath: '../../Scripts/jgrid/themes/steel/images', 
        caption: 'Core Return Authorization Contents:', 
        cellEdit: true 
       }); 
      }); 
     }); 

    </script> 

Answer 1

Il motivo per cui la griglia non si sta ricaricando è che si sta chiamando il metodo sbagliato. Il metodo jqGrid fa approssimativamente questo:

1. Esaminare la tabella per vedere se è già una griglia; se è così, esci.
2. Trasforma il tavolo in una griglia.
3. Compila la prima pagina di dati.

Così la seconda volta che si chiama il metodo, non fa nulla, come da punto 1.

Invece, si dovrebbe essere chiamata $("#list").trigger("reloadGrid") al secondo e tutti i clic successivi.

Ora, a causa del tuo mtype nelle opzioni della griglia, la griglia eseguirà un GET, non un POST. Quindi se il POST proviene dal pulsante stesso (in altre parole, è un input di tipo submit), è necessario restituire true per indicare che l'invio dovrebbe continuare come al solito.

Answer 2

ecco la soluzione:

<script type="text/javascript"> 
     var firstClick = true; 
     $(document).ready(function() { 
      $('#btnSubmit').click(function() { 
       if (!firstClick) { 
        $("#list").trigger("reloadGrid"); 
       } 
       firstClick = false; 
       /* Refreshes the grid */ 
       $("#list").jqGrid({ 
        /* The controller action to get the grid data from */ 
        url: '/CRA/AddPart', 
        data: { partNumber: "123"}, 
        datatype: 'json', 
        mtype: 'GET', 
        /* Define the headers on the grid */ 
        colNames: ['col1', 'col2', 'col3', 'col4'], 
        /* Define what fields the row columns come from */ 
        colModel: [ 
        { name: 'col1', index: 'invid', width: 290 }, 
        { name: 'col2', index: 'invdate', width: 290 }, 
        { name: 'col3', index: 'amount', width: 290, align: 'right' }, 
        { name: 'col4', index: 'tax', width: 290, align: 'right'}], 
        height: 'auto', 
        rowNum: 10, 
        rowList: [10, 20, 30], 
        sortname: 'id', 
        sortorder: "desc", 
        viewrecords: true, 
        imgpath: '../../Scripts/jgrid/themes/steel/images', 
        caption: 'Core Return Authorization Contents:', 
        cellEdit: true 
       }); 
      }); 
     }); 

    </script> 

Answer 3

Perché ho bisogno di inserire nuovi valori alla dell'Azione per me non funziona "reloadGrid".

Mi basta rimuovere tutto il contenuto e creare nuovamente la tabella vuota.

Nel se controllo se la griglia è lì per nascondere il div "grafico vuoto" (mostra solo un messaggio). Nel resto, pulisco solo il div che circonda il tavolo e poi aggiungo di nuovo all'interno del tavolo. Quando il plugin trova la tabella vuota, carica nuovamente completamente la griglia.

LoadTableData è la funzione che ha la funzionalità comune per creare e caricare la griglia.

Probabilmente questa soluzione non è elegante, ma quando il tempo è affrettando ...

$("#btnDownloadsPerFile").click(function() { 
      if ($('#chartContainerDownloadsPerFile .ui-jqgrid').length == 0) { 
       $('#chartContainerDownloadsPerFile .emptyChart').hide(); 
      } 
      else { 
       $('#chartContainerDownloadsPerFile').empty(); 
       $('#chartContainerDownloadsPerFile').append('<table id="downloadsPerFileGrid"></table>'); 
      } 
      LoadTableData("downloadsPerFileGrid", $('#ddlportalOptionsDownloadsPerFile').val(), "downloadsPerFile", $('#ddlTimeOptionsDownloadsPerFile').val(), $('#ddlTimeValuesDownloadsPerFile').val(), $('#ddlCountries').val()); 
     });