14 messaggi dal 28 agosto 2019
Buongiorno,

devo importare una lista lunghissima di contatti all'interno di una una tabella creata con il componente DataTable. Se faccio la select dal database e poi carico la lista nella tabella ci mette troppo tempo, c'è per caso un modo per inserire i record nella tabella a mano a mano che li leggo (magari a gruppi di 10) e quindi renderli visibili?

I dati dal database li leggo tramite dei web services, mentre l'inserimento nella lista lo faccio da un controller e poi li passo alla vista.

L'azione nel controller è questa :

public async Task<IActionResult> GetContactsAsync()
{
List<ContactViewModel> c = new List<ContactViewModel>();

HttpResponseMessage response = await client.GetAsync("indirizzo");
if (response.IsSuccessStatusCode)
{
c = await response.Content.ReadAsAsync<List<ContactViewModel>>();
}
return PartialView("~/Views/Core/Contact/_ContactsResults.cshtml", c);
}


Grazie
11.792 messaggi dal 09 febbraio 2002
Contributi
Ciao,
il webservice ti permette di paginare i dati? Vedo che qui gli stai passando il parametro "indirizzo", ma ti consente di passargli anche il numero di pagina, in modo da ottenere solo pochi risultati alla volta?
await client.GetAsync("indirizzo");


Se non ti consente di fare paginazione, dovresti contattare lo sviluppatore del webservice e chiedergli di implementare la paginazione. Infatti, è inutile ottenere 10000 elementi se poi l'utente è interessato solo ai primi 10.

Se il webservice non può essere modificato, dovresti scaricarti gli elementi a intervalli regolari, in background, e salvarli nel tuo database locale. Poi, quando l'utente richiede la pagina, li estrai dal tuo database anziché prenderli dal webservice. In questo modo riuscirai a paginare i dati e il caricamento di pagina sarà enormemente più rapido. Lo svantaggio è che gli elementi potrebbero non essere il più aggiornati possibile, perché potrebbero essere stati modificati dall'ultima volta che li avevi ottenuti dal webservice.

ciao,
Moreno

Enjoy learning and just keep making
14 messaggi dal 28 agosto 2019
Ciao,

il web services è mio quindi posso modificarlo come voglio.
Ma come dovrei implementarla questa paginazione? Fare per esempio una select di pochi elementi e restituirli man mano? Ma poi come faccio a continuare a richiamare l'action finchè non ho tutti i valori?
Modificato da FiliBen il 02 settembre 2019 09:06 -
11.792 messaggi dal 09 febbraio 2002
Contributi
Ciao, sì, il webservice dovrà restituire solo pochi elementi, diciamo un massimo di 10 (o 20 o 50 o un numero che vuoi tu). Il client dovrà indicare il numero di pagina che vuole ottenere. Se indica pagina 2, il webservice gli restituirà gli elementi dall'undicesimo al ventesimo. Se indica pagina 3, gli restituirà dal ventunesimo al trentesimo, e così via.


Ma poi come faccio a continuare a richiamare l'action finchè non ho tutti i valori?

È effettivamente necessario che tu li ottenga tutti?
  • Se sì, quando l'utente carica la pagina, fai partire una richiesta ajax che recupera i primi 10 e li mostra nell'elenco. Subito dopo fai partire una seconda richiesta ajax che recupera i secondi 10, e li accodi all'elenco, e così via finché ce ne sono;
  • Se invece non è necessario, allora metti i classici link di paginazione. Mostri giusto 10 elementi, poi otterrai i secondi 10 elementi solo quando l'utente clicca il bottone per andare a pagina 2. Una variante di questo approccio consiste nell'usare l'infinite scroll al posto dei link di paginazione.


ciao,
Moreno
Modificato da BrightSoul il 02 settembre 2019 09:41 -

Enjoy learning and just keep making
14 messaggi dal 28 agosto 2019
Ok grazie mille.

Provo a chiamare più volte la richiesta ajax usando il setinterval,richiamando quindi la function più volte a intervalli :

$(document).ready(function() {
setInterval(ajaxd, 3000);
});

Quello che non riesco a capire come fare è che in questa datatable lavoro con un model che è una lista di object.

@model List<ContactViewModel>

<table id="tableContacts" class="uk-table uk-table-hover uk-table-striped" style="width:100%">
<thead>
<tr>
<th>Cognome</th>
<th>Nome</th>
<th>Nazione</th>
</tr>
</thead>
<tbody id="tt">
@if (Model != null)
{
try
{
@foreach (var contact in Model)
{


@if (contact.Surname != null)
{
<td>@contact.Surname</td>
}
else
{
<td></td>
}


@if (contact.Name != null)
{
<td>@contact.Name</td>
}
else
{
<td></td>
}

@if (contact.Address != null)
{
if (contact.Address.Country != null)
{
<td>@contact.Address.Country</td>
}
else
{
<td></td>
}

}
else
{
<td></td>
}
}
}
catch(Exception ex)
{

}
}

</tbody>
<tfoot>
<tr>
<th>Cognome</th>
<th>Nome</th>
<th>Nazione</th>
</tr>
</tfoot>
</table>

Come posso fare la richiesta AJAX per ricevere la lista e fare l'append alla datatable?
11.792 messaggi dal 09 febbraio 2002
Contributi
Ciao,
dovrai separare la tabella dal suo contenuto, che invece verrà recuperato tramite chiamata ajax.
Puoi seguire questi passi (a grandi linee).

Nella view attuale, quella di cui hai postato il codice, lascia soltanto questo.
<table id="tableContacts" class="uk-table uk-table-hover uk-table-striped" style="width:100%">
<thead>
<tr>
<th>Cognome</th>
<th>Nome</th>
<th>Nazione</th>
</tr>
</thead>
<tbody id="tt">
</tbody>
<tfoot>
<tr>
<th>Cognome</th>
<th>Nome</th>
<th>Nazione</th>
</tr>
</tfoot>
</table>
<script>
$(document).ready(function() {
setInterval(ajaxd, 3000); //Non è una soluzione ideale ma per ora ok
});

//Qui metti la definizione di ajaxd
</script>

Come vedi ho tolto anche la tipizzazione forte (cioè la direttiva @model). In pratica questa diventa una view che non visualizza nessun dato.

Ora sarà compito della funzione javascript ajaxd fare una richiesta ajax alla tua applicazione. A questa richiesta dovrà rispondere una nuova action che creerai nel tuo controller e che si occuperà di chiamare il webservice e restituire i primi 10 risultati formattati in HTML (o in JSON se lo preferisci).

Quindi, questa nuova action può generare HTML avvalendosi di una nuova view in cui inserirai questo, cioè le righe di dati.
@model List<ContactViewModel>
@{
  Layout = null;
}
@if (Model != null)
{
try
{
@foreach (var contact in Model)
{
<tr>
@if (contact.Surname != null)
{
<td>@contact.Surname</td>
}
else
{
<td></td>
}


@if (contact.Name != null)
{
<td>@contact.Name</td>
}
else
{
<td></td>
}

@if (contact.Address != null)
{
if (contact.Address.Country != null)
{
<td>@contact.Address.Country</td>
}
else
{
<td></td>
}

}
else
{
<td></td>
}
</tr>
}
}
catch(Exception ex)
{

}
}


Ora non resta che parlare della funzione javascript ajaxd. Come fa ad aggiungere queste righe alla tabella?
Puoi usare i metodi di jQuery. Ecco una soluzione rapida per accodare il contenuto ottenuto da una richiesta ajax.
var pagina = 1;
function ajaxd() {
  $.get('tuoController/tuaNuovaAction?pagina' + pagina, function(data){
      $('#tt').append(data);
  });
  //Ogni volta che ajaxd viene chiamata, la pagina si incrementa
  pagina++;
}


Attenzione perché questo non è codice che ho provato e perciò potrebbe non funzionare.
Inoltre, questo è solo per darti un'idea di come realizzarlo ed è lontano dall'essere il codice finale.
Per esempio non mi è chiaro perché vuoi caricare una pagina ogni 3 secondi e non mi hai detto se effettivamente è necessario che l'utente veda tutti i risultati in un'unica pagina.

ciao,
Moreno
Modificato da BrightSoul il 02 settembre 2019 13:49 -

Enjoy learning and just keep making
11.792 messaggi dal 09 febbraio 2002
Contributi
Se invece vuoi usare DataTables, segui questo esempio:
https://www.c-sharpcorner.com/article/using-datatables-grid-with-asp-net-mvc/

Comunque dovrai fare in modo che il webservice ti restituisca una pagina di risultati alla volta.

Enjoy learning and just keep making
14 messaggi dal 28 agosto 2019
Ok dò un occhio a questo link perchè io stavo usando il DataTable e le pagine le gestisce lui.
Comunque volevo rendere disponibili tutti gli elementi perchè se fanno una ricerca nella casella di jquery devono trovare il contatto che cercano.

Grazie mille intanto.

Torna al forum | Feed RSS

ASPItalia.com non è responsabile per il contenuto dei messaggi presenti su questo servizio, non avendo nessun controllo sui messaggi postati nei propri forum, che rappresentano l'espressione del pensiero degli autori.