Suono di notifica in nuova riga

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
Buongiorno a tutti ragazzi,
ho un file index.php che legge semplicemente un database in modo tabellare e che ogni 2 minuti fa un refresh della situazione.

Il file è di sola visualizzazione, ma vorrei che quando effettua un refresh, se presente una nuova riga rispetto all'aggiornamento precedente, deve emettere un suono di notifica.

Ho visto anche questa discussione, ma ahimè mai conclusa:


Avete qualche idea su come impostare il codice? Che linguaggio usare?

Grazie in anticipo.
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.406
339
83
Hai aperto la discussione ieri non mi sembra molto! Devi avere pazienza qui nessuno è tenuto a rispondere!
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.406
339
83
ok.gif
ok.gif
bello (2).gif
ciao.gif
ciao.gif
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Che codice stai usando?
Penso che la miglior soluzione sia fare una funzione con una chiamata ajax e la richiami ogni 2 minuti, e se c'è un nuovo record con questa funzione viene emesso il suono
 

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
Che codice stai usando?
Penso che la miglior soluzione sia fare una funzione con una chiamata ajax e la richiami ogni 2 minuti, e se c'è un nuovo record con questa funzione viene emesso il suono
HTML:
?php
    include('dbconnection.php');
    session_start();
    $query = "SELECT `order`.* FROM admin LEFT JOIN `order` ON `admin`.`punto_vendita` = `order`.`punto_vendita` WHERE (((`order`.`stato`)=0))";
   
    $run_query = mysqli_query($connection, $query);
?>
<!DOCTYPE html>
<html lang="it">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
  <link href="css/style.css" rel="stylesheet" type="text/css">
  <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>
<div id="visualizzaTabella">
<div class="container">
    <div class="top_header">
        <h2>
            ORDINI IN ARRIVO
            <?php
            if ($result=mysqli_query($connection,$query))
             {
              $rowcount=mysqli_num_rows($result);
              printf("( %d )\n",$rowcount);
              mysqli_free_result($result);
             }
            ?>
        </h2>
    </div>
    <br>        
      <div id="#">
      <table class="table table-bordered table table-hover">
        <thead>
          <tr>
            <th style="display:none;">Id</th>
            <th>Id</th>
            <th>Parthner</th>
            <th>Dettaglio Ordine</th>
            <th>Stato</th>
          </tr>
        </thead>
        <tbody>
       
         <?php
            while( $result = mysqli_fetch_assoc($run_query) )
            {
            if($result) {
         ?>
          <tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['id'] ?>" type="hidden" name="id">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr> <?php } } ?>
            </tbody>
        </table>
        </div>
    </div>
</div>
</body>
</html>
<?php
    if($_SERVER["REQUEST_METHOD"]=="POST")
    {
    }
    mysqli_close($connection);
?>

Ti posto il codice, in effetti mi piacerebbe avere anche l'aggiornamento automatico ogni 3 secondi senza doveri ricaricare la pagina ogni volta. Avevo letto comunque che anche con ajax si poteva fare.
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Un'altra info: ogni 3 secondi deve esserci solo il suono della notifica o devono anche aggiungersi automaticamente le nuove righe alla tabella?
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Si, devi procedere in questo modo:
1. aggiungi al tr un id, in modo da poter verificare qual'è l'ultima riga visualizzata dall'utente (per poter capire se ci sono notifiche nuove o no):
Quindi questo:
PHP:
         <?php
            while( $result = mysqli_fetch_assoc($run_query) )
{
if($result) {
         ?>
          <tr>
Diventa:
PHP:
<?php
            while( $result = mysqli_fetch_assoc($run_query) )
{
if($result) {
         ?>
          <tr id="<?php echo $result['id_order']; ?>">

2.poi aggiungi la chiamata ajax, che viene eseguita ogni 3 secondi (il 3000 nel codice è il numero di millisecondi):
HTML:
<script>
$(document).ready(function(){
setInterval(newNoti, 3000);
function newNoti(){
//questa riga prende l'ultimo id della tabella
var ultimo = $(".table tr").last().attr("id");
$.ajax({
type: "post",
url: "file2.php",
data:{'last_id':ultimo},
success:function(resp){
        if(resp != ""){
$("#audio").play();
$(".table").append(resp);
}
        },
        error:function(){
            alert('Some problem occured, please try again.');
        }
})
}
});
</script>

3. aggiungi un file audio a index cosi:
HTML:
<audio src="audio.mp3" id="audio"></audio>

4. crei un file chiamato file2.php in cui controlli se ci sono nuove righe (dovresti fornire più info sul database, in generale la struttura è questa, bisogna scrivere la query):
PHP:
<?php
//includi la connessione al db

$last_id = $_POST['last_id'];
//nella query devi selezionare con un where solo le righe con un id maggiore (più recente) di $last_id
$query = mysqli_query($conn, "SELECT ...");
while( $result = mysqli_fetch_assoc($query) ) {
?>
<tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['id'] ?>" type="hidden" name="id">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr>
<?php } ?>

Prova cosi, non so se è il metodo più veloce
 

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
Ti amo!
Si, devi procedere in questo modo:
1. aggiungi al tr un id, in modo da poter verificare qual'è l'ultima riga visualizzata dall'utente (per poter capire se ci sono notifiche nuove o no):
Quindi questo:
PHP:
         <?php
            while( $result = mysqli_fetch_assoc($run_query) )
{
if($result) {
         ?>
          <tr>
Diventa:
PHP:
<?php
            while( $result = mysqli_fetch_assoc($run_query) )
{
if($result) {
         ?>
          <tr id="<?php echo $result['id_order']; ?>">

2.poi aggiungi la chiamata ajax, che viene eseguita ogni 3 secondi (il 3000 nel codice è il numero di millisecondi):
HTML:
<script>
$(document).ready(function(){
setInterval(newNoti, 3000);
function newNoti(){
//questa riga prende l'ultimo id della tabella
var ultimo = $(".table tr").last().attr("id");
$.ajax({
type: "post",
url: "file2.php",
data:{'last_id':ultimo},
success:function(resp){
        if(resp != ""){
$("#audio").play();
$(".table").append(resp);
}
        },
        error:function(){
            alert('Some problem occured, please try again.');
        }
})
}
});
</script>

3. aggiungi un file audio a index cosi:
HTML:
<audio src="audio.mp3" id="audio"></audio>

4. crei un file chiamato file2.php in cui controlli se ci sono nuove righe (dovresti fornire più info sul database, in generale la struttura è questa, bisogna scrivere la query):
PHP:
<?php
//includi la connessione al db

$last_id = $_POST['last_id'];
//nella query devi selezionare con un where solo le righe con un id maggiore (più recente) di $last_id
$query = mysqli_query($conn, "SELECT ...");
while( $result = mysqli_fetch_assoc($query) ) {
?>
<tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['id'] ?>" type="hidden" name="id">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr>
<?php } ?>

Prova cosi, non so se è il metodo più veloce
Grazie! Domani mattina ti faccio sapere!!
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Il link è questo:
non mi si visualizzano i file, riesci a postare i codici direttamente qui (bastano il file principale e file2.php).
Intanto fai una prova, aggiungi:
HTML:
alert(ultimo);
subito prima di $.ajax({ ...
e dimmi se visualizzi o meno l'alert correttamente
 
Ultima modifica:

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
Ciao, i posto i codici:

il file o_arrivo.php (dove arrivano gli ordini):
PHP:
<?php
    include('dbconnection.php');
    session_start();
    $query = "SELECT `order`.* FROM admin LEFT JOIN `order` ON `admin`.`punto_vendita` = `order`.`punto_vendita` WHERE (((`order`.`stato`)=0))";
    
    $run_query = mysqli_query($connection, $query);
?>
<!DOCTYPE html>
<html lang="it">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
  <link href="css/style.css" rel="stylesheet" type="text/css">
  <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  <script language="javascript" type="text/javascript">
    function loadlink(){
    $('#links').load('o_arrivo.php',function () {
         $(this).unwrap();
    });
    }

    loadlink(); // This will run on page load
    setInterval(function(){
        loadlink() // this will run after every 5 seconds
    }, 5000);
  </script>
</head>
<body>
<div id="visualizzaTabella">
<div class="container">
    <div class="top_header">
        <h2>
            ORDINI IN ARRIVO
            <?php
            if ($result=mysqli_query($connection,$query))
             {
              $rowcount=mysqli_num_rows($result);
              printf("( %d )\n",$rowcount);
              mysqli_free_result($result);
             }
            ?>
        </h2>
    </div>
    <br>         
      <div id="links">
      <table class="table table-bordered table table-hover">
        <thead>
          <tr>
            <th style="display:none;">Id</th>
            <th>Id</th>
            <th>Parthner</th>
            <th>Dettaglio Ordine</th>
            <th>Stato</th>
          </tr>
        </thead>
        <tbody>
        
         <?php
            while( $result = mysqli_fetch_assoc($run_query) )
            {
            if($result) {
         ?>
          <tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr> <?php } } ?>
            </tbody>
        </table>
        </div>
    </div>
</div>
</body>
</html>
<?php
    if($_SERVER["REQUEST_METHOD"]=="POST")
    {   
        $url = "######";
        $ch = curl_init();

        curl_setopt($ch,CURLOPT_URL, $url);
        curl_setopt($ch,CURLOPT_POST, true);
        curl_setopt($ch,CURLOPT_HTTPHEADER, array(
            "Authorization: bWVtZW50byBhdWRlcmUgc2VtcGVy",
            "Azione: 1")
            );

        //So that curl_exec returns the contents of the cURL; rather than echoing it
        //curl_setopt($ch,CURLOPT_RETURNTRANSFER, true);

        $result = curl_exec($ch);
        
        $response = curl_getinfo($ch,CURLINFO_HTTP_CODE);
        
        curl_close($ch);
        echo $response ;
        
        
        }
        mysqli_close($connection);
        ?>

Qui il codice del file file2.php

PHP:
<?php
include('dbconnection.php');
session_start();

$last_id = $_POST['last_id'];
//nella query devi selezionare con un where solo le righe con un id maggiore (più recente) di $last_id
$query = mysqli_query($connection, "SELECT `order`.* FROM admin LEFT JOIN `order` ON `admin`.`punto_vendita` = `order`.`punto_vendita` WHERE (((`order`.`stato`)=0))");
while( $result = mysqli_fetch_assoc($query) ) {
?>
<tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['id'] ?>" type="hidden" name="id">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr>
<?php } ?>

Fammi sapere.

Grazie
 

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
non mi si visualizzano i file, riesci a postare i codici direttamente qui (bastano il file principale e file2.php).
Intanto fai una prova, aggiungi:
HTML:
alert(ultimo);
subito prima di $.ajax({ ...
e dimmi se visualizzi o meno l'alert correttamente
Mi risponde con una notifica pop-up: undefined
 

Samuele Ronzani

Utente Attivo
7 Ott 2016
42
0
6
Scusa, dagli un'occhiata

PHP:
<?php
    include('dbconnection.php');
    session_start();
    $query = 'SELECT `order`.* FROM `order` WHERE (`order`.`stato`= 0 and `order`.`punto_vendita`='.$_SESSION['id_pv'].')';   
    $run_query = mysqli_query($connection, $query);
?>
<!DOCTYPE html>
<html lang="it">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link href="css/style.css" rel="stylesheet" type="text/css">
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
    setInterval(newNoti, 3000);
    function newNoti(){
    var ultimo = $('table tr:last td:first').text();
    //var ultimo = $(".table tr").last().attr("punto_vendita");
    alert(ultimo)
    $.ajax({
    type: "post",
    url: "file2.php",
    data:{'last_id':ultimo},
    success:function(resp){
            if(resp != ""){
    document.querySelector('audio').play();
    $(".table").append(resp);
    }
            },
            error:function(){
                alert('Some problem occured, please try again.');
            }
    })
    }
    });
  </script>
</head>
<body>
<audio src="icq_sound_mp3.mp3" id="audio"></audio>
<div id="visualizzaTabella">
<div class="container">
    <div class="top_header">
        <h2>
            ORDINI IN ARRIVO
            <?php
            if ($result=mysqli_query($connection,$query))
             {
              $rowcount=mysqli_num_rows($result);
              printf("( %d )\n",$rowcount);
              mysqli_free_result($result);
             }
            ?>
        </h2>
    </div>
    <br>         
      <div id="links">
      <table class="table table-bordered table table-hover">
        <thead>
          <tr>
            <th style="display:none;">Id</th>
            <th>Id</th>
            <th>Parthner</th>
            <th>Dettaglio Ordine</th>
            <th>Stato</th>
          </tr>
        </thead>
        <tbody>
        <?php
            while( $result = mysqli_fetch_assoc($run_query) )
        {
        if($result) {
         ?>
          <tr id="<?php echo $result['id_order']; ?>">
          <tr>
           <td style="display:none;"><?php echo $result['id']; ?></td>
            <td><?php echo $result['id_order']; ?></td>
            <td><img  align="middle" src="<?php echo $result['parthner']?>" width="50%" ></td>
            <td><?php echo $result['json_ordine'] ?></td>
            <td>
                <form method="POST" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>">
                    <input value="<?php echo $result['stato'] ?>" type="submit" name="">
               </form>
           </td>
           </tr> <?php } } ?>
            </tbody>
        </table>
        </div>
    </div>
</div>
</body>
</html>
<?php
    if($_SERVER["REQUEST_METHOD"]=="POST")
    {   
        $id = ($_POST["id"]);
        $url = "####".$id;
        $ch = curl_init();

        curl_setopt($ch,CURLOPT_URL, $url);
        curl_setopt($ch,CURLOPT_POST, true);
        curl_setopt($ch,CURLOPT_HTTPHEADER, array(
            "Authorization: bWVtZW50byBhdWRlcmUgc2VtcGVy",
            "Azione: 1")
            );

        //So that curl_exec returns the contents of the cURL; rather than echoing it
        //curl_setopt($ch,CURLOPT_RETURNTRANSFER, true);

        $result = curl_exec($ch);
        
        $response = curl_getinfo($ch,CURLINFO_HTTP_CODE);
        
        curl_close($ch);
        if ($response == 200) {
        echo '<script type="text/javascript">';
        echo 'alert("COMUNICAZIONE ESEGUITA CORRETTAMENTE")';
        echo '</script>';
        exit;}
        else{
            echo '<script type="text/javascript">';
            echo 'alert("ERRORE DI COMUNICAZIONE, RIPROVA")';
            echo '</script>';
            exit;
        }
        }
        mysqli_close($connection);
        ?>
 

Tommy03

Utente Attivo
6 Giu 2018
614
58
28
18
Vicenza
Intanto metti un id alla tabella
HTML:
<table id="id_tabella" class="...">

Poi questa riga:
var ultimo = $('table tr:last td:first').text();
Cambiala cosi:
HTML:
var ultimo = $("#id_tabella tr").last().attr("id");

E poi dimmi se l'alert viene ancora undefined

P.S. nella console ci sono errori?
 
Discussioni simili
Autore Titolo Forum Risposte Data
A Scaturire suono di allarme Javascript 3
D Dreamweaver-attivazione di un suono-audio su rollover del mouse su un link Windows e Software 0
L Eliminare suono da iframe HTML e CSS 3
C Attivare un suono dello smartphone attraverso web app jQuery 5
V chat suono quando arriva una nuova scritta Javascript 3
N SUono di sottofondo HTML HTML e CSS 0
W Suono permanente su pagina web HTML e CSS 1
E problemi con il suono Flash 10
P Inserire suono in immagine di rollover Javascript 0
P Problemi caricamento suono su codice html HTML e CSS 1
D Suono MIDI Javascript 5
F suono di sottofondo nel sito HTML e CSS 32
P Suono di sottofondo HTML e CSS 15
M Creazione notifica sonora Javascript 1
otto9due [Javascript] Notification - Browser ( messaggio di notifica browser ). Javascript 0
C Pagina fb notifica modifica post Social Media Marketing 1
felino [WordPress] [WooCommerce] Ordine: aggiungere nuovi stati con notifica email al cliente WordPress 4
felino [Wordpress][WooCommerce] PayPal: nessun notifica email dopo il pagamento WordPress 1
felino [WordPress] Notifica nuovo commento: notifica email WordPress 0
felino Commenti: email di notifica, reply solo dall'admin e captcha WordPress 1
felino Disabilita la notifica via email quando viene postato un nuovo commento WordPress 2
novello88 Notifica via email quando un utente scrive un nuovo articolo WordPress 1
voldemort Defacciamento / hackeraggio sito aziendale, obbligo notifica ai clienti / autorità Leggi, Normative e Fisco 3
V e-commerce notifica istantanea E-Commerce 1
JellyBelly Problema Notifica Email PHP 1
zighy Prendere visione della notifica PHP 2
Web Designer Come eliminare la fastidiosa notifica in AVIRA FREE Windows e Software 0
V Invio E-Mail con la notifica degli ordini effettuati PHP 2
C Notifica via mail creazione ticket wordpress WordPress 5
A Notifica Mail inserimento file in directory remota PHP 2
N notifica email via sms Discussioni Varie 1
chatline notifica thread Supporto Mr.Webmaster 2
P notifica email Classic ASP 23
F Consigli passaggio a nuova piattaforma SEO e Posizionamento 3
S Apertura in una nuova pagina PHP 6
L proposta nuova sezione Python Comunicazioni dallo Staff 1
M Indesign nuova passione Presentati al Forum 0
G Nuova Idea su come trovare clienti per sviluppo web Discussioni Varie 6
Cosina Reindirizzare a nuova pagina dopo echo copy PHP 4
T [a pagamento] programmatore PHP che mi aiuti a migrare gli script da vecchia versione PHP a nuova Offerte e Richieste di Lavoro e/o Collaborazione 1
D Nuova ssd su mac Mac e Software 4
I [Javascript] window.location.href porta alla nuova pagina e ritorna incomprensibilmente. Javascript 0
E [PHP] problemi nuova riga con fwrite su piattaforma android PHP 5
B Nuova sul forum - Mi presento Presentati al Forum 2
D Installare nuova versione PHP PHP 1
J Cerco socio sviluppatore per nuova startup Offerte e Richieste di Lavoro e/o Collaborazione 0
P [Javascript] Inserire una nuova condizione in una funzione Javascript 3
B Nuova iscrizione Presentati al Forum 1
elpirata Confusione totale progetto nuova infrastruttura HW Reti LAN e Wireless 4
Antonio Nervi [Javascript] Nuova finestra Javascript 8

Discussioni simili