Home>

There is php code that defines the #userfio, #phonenumber, #selectoperatorid variables and the #addnewuser button. By clicking the #addnewuser button, the data is sent using ajax to the server

$ (document) .ready (function () {
        console.log ('Inside addinfouser.js');
$ ('# addnewuser'). Click (function () {
    let data= {
            userfio: $ ("# userfio"). val (),
          //userfio: $ ("# userfio: selected"). text () -if you need text, not a value
            phonenumber: $ ("# phonenumber"). val (),
            selectoperatorid: $ ("# selectoperatorid"). val ()
          };
    if ($ data.userfio== '' || data.phonenumber== '') {
        return;
    }
    $ .post ("addinfouser.php", data, function (result) {
      let tr= `<
tr class= userlist # {result.phpuserid} >
<
td >
# {result.phpuserfio} <
/td >
<
td >
# {result.phpphonenmumer} <
/td >
<
td >
# {result.selectoperatorname} <
/td >
<
/tr >
`;
      $ (tr) .appendTo ("# alllistusers");
    });
});
    }
    ) 
<
! DOCTYPE html >
<
html >
<
head >
    <
meta charset= "utf-8" >
    <
meta name= "viewport" content= "width= device-width, initial-scale= 1.0" >
    <
meta http-equiv= "X-UA-Compatible" content= "ie= edge" >
    <
title >
Call log <
/title >
    <
link rel= "stylesheet" type= "text /css" href= "calllog.css" >
<
/link >
<
/head >
<
body >
    <
h1 class= "hstyle" >
Call log <
/h1 >
    <
div id= "btns" >
        <
! -<
input type= "button" id= "addoperator" value= "Add" >
<
/input >
->
        <
button id= "deleteoperator" >
Remove <
/button >
    <
/div >
    <
! -<
div class= "addinfooperators" >
Adding operators <
/div >
->
    <
div class= "centeredblock" >
Adding operators <
/div >
    <
div class= "wrapper" >
        <
form class= "leftmenu" >
            <
div >
Operator name <
/div >
            <
div >
<
input type= "text" placeholder= "Name" id= "operatorname" >
<
/input >
<
/div >
            <
div >
Tariff <
/div >
            <
div >
<
input type= "text" placeholder= "Cost of a minute of conversation" id= "ratevalue" >
<
/input >
<
/div >
            <
input type= "submit" id= "addoperator" value= "Add" >
<
/input >
        <
/form >
        <
div class= "tableblock" >
            <
table id= "alllistoperators" >
                <
tr >
                    <
td >
                        Operator
                    <
/td >
                    <
td >
                        Rate
                    <
/td >
                <
/tr >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ operatorslistconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ operatorslistconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ operatorslistresult= mysqli_query ($ operatorslistconn, "SELECT * FROM` operators` ");
                if ($ operatorslistresult) {
                    $ tableoperatorscontent= '';
                    while ($ dbrowoperator= mysqli_fetch_assoc ($ operatorslistresult)) {
                        //$ leftmenu= "";
                        //$ leftmenu= "";
                        $ tableoperatorscontent.= '<
tr class= operator '. $ dbrowoperator [' id '].' >
<
td >
'. $ dbrowoperator [' name '].' <
/td >
<
td >'. $ dbrowoperator [' rate '].' < /td >
<
/tr >
';
                    }
                    echo $ tableoperatorscontent;
            }
        mysqli_free_result ($ operatorslistresult);
        }
        mysqli_close ($ operatorslistconn);
? >
            <
/table >
        <
/div >
    <
/div >
    <
! -<
div class= "addinfousers" >
Adding users <
/div >
->
    <
div class= "centeredblock" >
Adding users <
/div >
    <
div class= "wrapperusers" >
        <
form class= "leftmenuusers" >
            <
div >
Username <
/div >
            <
div >
<
input type= "text" placeholder= "Full name" id= "userfio" >
<
/input >
<
/div >
            <
div >
Phone number <
/div >
            <
div >
<
input type= "text" placeholder= "Phone number" id= "phonenumber" >
<
/input >
<
/div >
            <
div >
Operator <
/div >
            <
div >
<
select name= "selectoperator" id= "selectoperatorid" >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ selectoperatorsconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ selectoperatorsconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ selectoperatorsresult= mysqli_query ($ selectoperatorsconn, "SELECT * FROM` operators` ");
            if ($ selectoperatorsresult) {
                    while ($ dbrowselectoperator= mysqli_fetch_assoc ($ selectoperatorsresult)) {
                        echo '<
option value= selectid '. $ dbrowselectoperator [' id '].' >
'. $ dbrowselectoperator [' name '].' <
/option >
';
                    }
        }
    }
? >
            <
/select >
<
/div >
            <
button id= "addnewuser" >
Add <
/button >
        <
/form >
        <
div class= "tableblockusers" >
            <
table id= "alllistusers" >
                <
tr >
                    <
td >
                        Name
                    <
/td >
                    <
td >
                        Phone number
                    <
/td >
                    <
td >
                        Operator
                    <
/td >
                <
/tr >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ userslistconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ userslistconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ userslistresult= mysqli_query ($ userslistconn, "SELECT * FROM` users` ");
                if ($ userslistresult) {
                    $ tableuserscontent= '';
                    while ($ dbrowuser= mysqli_fetch_assoc ($ userslistresult)) {
                        $ sqlExtractNameOperator= 'SELECT name FROM operators WHERE operators.id='. $ dbrowuser ['operator'];
                        $ nameOperatorsListResult= mysqli_query ($ userslistconn, $ sqlExtractNameOperator);
                        if ($ nameOperatorsListResult) {
                            while ($ dbrowoperatorinstance= mysqli_fetch_assoc ($ nameOperatorsListResult)) {
                                //echo '<
option value= selectid '. $ dbrowselectoperator [' id '].' >
'. $ dbrowselectoperator [' name '].' <
/option >
';
                                $ operatornameforuser= $ dbrowoperatorinstance ['name'];
                            }
                        }
                        $ tableuserscontent.= '<
tr class= userlist '. $ dbrowuser [' id '].' >
<
td >
'. $ dbrowuser [' name '].' <
/td >
<
td >
'. $ dbrowuser [' phonenumber '].' <
/td >
<td > '. $ operatornameforuser.' <
/td >
<
/tr >
';
                    }
                    echo $ tableuserscontent;
            }
        mysqli_free_result ($ userslistresult);
        }
        mysqli_close ($ userslistconn);
? >
            <
/table >
        <
/div >
    <
/div >
    <
! -<
div class= "addinfocalls" >
Adding calls <
/div >
->
    <
div class= "centeredblock" >
Adding calls <
/div >
    <
div >
    <
/div >
    <
table class= "calltable" >
        <
tr >
            <
td >
                No.
            <
/td >
            <
td >
                Date Time
            <
/td >
            <
td >
                Incoming subscriber
            <
/td >
            <
td >
                Incoming subscriber phone
            <
/td >
            <
td >
                Outgoing subscriber
            <
/td >
            <
td >
                Outgoing subscriber phone
            <
/td >
            <
td >
                Duration
            <
/td >
            <
td >
                Subscriber operator
            <
/td >
            <
td >
                Call cost
            <
/td >
        <
/tr >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ conn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ conn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ result= mysqli_query ($ conn, "SELECT * FROM` calls` ");
            //$ definingusername= mysqli_query ($ conn, "SELECT name FROM` users` WHERE id= '. $ row ["inputuser"] ");
            //$ usernamerow= mysqli_fetch_row ($ definingusername);
                if ($ result) {
                    //$ phptable= "";
                    while ($ row= mysqli_fetch_assoc ($ result)) {
                    //$ name= $ row ["$ yourfield"];
                    //echo "Name:". $ name. "br />
";
                    //var_dump ($ row);
                    //Read from the database and populate the table with them
                    $ phptable= "";
                    $ phptable.= "<
tr >
<
td >
". $ row [" id "]." <
/td >
";
                    $ phptable.= "<
td >
". $ row [" datetimecall "]." <
/td >
";
                    $ definingusernamequery= mysqli_query ($ conn, "SELECT name FROM` users` WHERE users.id= ". $ row [" inputuser "]);
                    //echo "SELECT name FROM` users` WHERE users.id= ". $ row [" inputuser "];
                    $ usernamerow= mysqli_fetch_row ($ definingusernamequery);
                    $ phptable.= "<
td >
". $ usernamerow [0]." <
/td >
";
                    //echo $ usernamerow [0];
                    $ phptable.= "<
td >
". $ row [" inputphonenumber "]." <
/td >
";
                    $ outputcallernamequery= mysqli_query ($ conn, "SELECT name FROM` users` WHERE users.id= ". $ row [" outputuser "]);
                    //echo "SELECT name FROM` users` WHERE users.id= ". $ row [" outputuser "];
                    $ outputcallerrow= mysqli_fetch_row ($ outputcallernamequery);
                    $ phptable.= "<
td >
". $ outputcallerrow [0]." <
/td >
";
                    //echo $ outputcallerrow [0];
                    $ phptable.= "<
td >
". $ row [" outputphonenumber "]." <
/td >
";
                    $ phptable.= "<
td >
". $ row [" duration "]." <
/td >
";
                    $ operatoridquery= mysqli_query ($ conn, "SELECT operator FROM` users` WHERE users.id= ". $ row [" outputuser "]);
                    //$ operatorid= $ outputcallerrow [0];
                    //echo $ operatoridquery;$ operatoridvalue= mysqli_fetch_row ($ operatoridquery); $ operatornamevaluequery= mysqli_query ($ conn, "SELECT name FROM` operators` WHERE operators.id= ". $ operatoridvalue [0]);
                    $ operatornamevaluerow= mysqli_fetch_row ($ operatornamevaluequery);
                    $ phptable.= "<
td >
". $ operatornamevaluerow [0]." <
/td >
";
                    $ durationquery= mysqli_query ($ conn, "SELECT TIME_TO_SEC (duration) /60 as dec_time FROM` calls` WHERE calls.id= ". $ row [" id "]);
                    $ durationvalue= mysqli_fetch_row ($ durationquery);
                    $ duration= $ durationvalue [0];
                    //echo $ duration;
                    /*
                    $ duration= TIME_TO_SEC ($ row ["duration"]);
                    echo $ duration;
                    * /
                    $ ratequery= mysqli_query ($ conn, "SELECT rate FROM` operators` WHERE operators.id= ". $ operatoridvalue [0]);
                    $ ratevalue= mysqli_fetch_row ($ ratequery);
                    $ rate= $ ratevalue [0];
                    //echo $ rate;
                    $ ratepennyvalue= "";
                    $ raterublesvalue= "";
                    $ rublescount= "";
                    $ rateprice= mb_substr ($ rate, 0, mb_strlen ($ rate) -7);
                    if (strpos ($ rateprice, 'kopecks')!= false) {
                        $ ratepennystr= mb_substr ($ rateprice, 0, mb_strlen ($ rateprice) -7);
                        //echo $ ratepennystr;
                        $ ratepennyvalue= mb_substr ($ ratepennystr, mb_strlen ($ ratepennystr) -2, 2);
                        //echo $ ratepennyvalue;
                        $ raterublesvalue= mb_substr ($ ratepennystr, 0, mb_strlen ($ ratepennystr) -2);
                        if (strpos ($ ratepennystr, 'ruble')!= false) {
                            $ raterublesvalue= mb_substr ($ raterublesvalue, 0, mb_strlen ($ raterublesvalue) -6);
                        }
                        else if (strpos ($ ratepennystr, 'ruble')!= false) {
                            $ raterublesvalue= mb_substr ($ raterublesvalue, 0, mb_strlen ($ raterublesvalue) -6);
                        }
                        else if (strpos ($ ratepennystr, 'rubles')!= false) {
                            $ raterublesvalue= mb_substr ($ raterublesvalue, 0, mb_strlen ($ raterublesvalue) -7);
                        }
                        else {
                        }
                    }
                    else {
                        if (strpos ($ rateprice, 'ruble')!= false) {
                            $ raterublesvalue= mb_substr ($ rateprice, 0, mb_strlen ($ rateprice) -6);
                        }
                        else if (strpos ($ rateprice, 'ruble')!= false) {
                            $ raterublesvalue= mb_substr ($ rateprice, 0, mb_strlen ($ rateprice) -6);
                        }
                        else if (strpos ($ rateprice, 'rubles')!= false) {
                            $ raterublesvalue= mb_substr ($ rateprice, 0, mb_strlen ($ rateprice) -7);
                        }
                        else {
                        }
                    };
                    $ ratecost= (int) ($ raterublesvalue) * 100 + (int) ($ ratepennyvalue);
                    $ callcost= $ ratecost * $ duration;
                    $ callcoststring= strval (intdiv ($ callcost, 100)). 'rub. '.strval ($ callcost% 100).' cop. ';
                    $ phptable.= "<
td >
". $ callcoststring." <
/td >
";
                    //echo $ rateprice;
                    /*
                    $ phptable.= "<
td >
". $ row [" outputphonenumber "]." <
/td >
";
                    $ phptable.= "<
td >
". $ row [" duration "]." <
/td >
";
                    $ phptable.= "<
td >
". $ row [" operator "]." <
/td >
";
                    * /
                    $ phptable.= '<
/tr >
';
                    echo $ phptable;
                }
                mysqli_free_result ($ operatornamevaluequery);
                mysqli_free_result ($ operatoridquery);
                mysqli_free_result ($ outputcallernamequery);mysqli_free_result ($ definingusernamequery); mysqli_free_result ($ result);
        }
        }
        //echo "Connection successfully established";
        mysqli_close ($ conn);
? >
    <
/table >
    <
div class= "secondandmore" >
<
h1 class= "hstyle" id= "second" >
Call statistics <
/h1 >
<
/div >
    <
div class= "centeredblock" >
Duration of user calls <
/div >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ usersconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ usersconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ usersresult= mysqli_query ($ usersconn, "SELECT * FROM` users` ");
                if ($ usersresult) {
                    //$ phptable= "";
                    $ MenuTableWrapper= '<
div class= '. "wrapper".' >
<
div class= '. "leftmenu".' >
';
                    $ leftmenu= "";
                    while ($ rowuser= mysqli_fetch_assoc ($ usersresult)) {
                        //$ leftmenu= "";
                        //$ leftmenu= "";
                        $ leftmenu.= '<
div class= "elemcheckbox" >
<
input class= "checkboxitemuserlist" type= "checkbox" name= '. $ rowuser ["name"].' value= '. $ rowuser ["id"].' >
<
div class= "elemuserlist" >
'. $ rowuser ["name"].' <
/div >
<
/input >
<
/div >
';
                        //echo '<
div >
<
input class= "checkboxitemuserlist" type= "checkbox" name= "users []" value= '. $ rowuser ["id"].' />
'. $ rowuser ["name"].' <
/div >
';
                        //echo $ leftmenu;
                    }
                    $ MenuTableWrapper.= $ Leftmenu;
                    $ MenuTableWrapper.= "<
/div >
";
                    echo $ MenuTableWrapper;
                    /*
                    $ durationtable= "";
                    $ durationtable.= '<
table id= "userdurationcalltable" >
';
                    $ durationtable.= '<
/table >
';
                    $ statisticacontent= $ leftmenu;
                    $ statisticacontent.= $ durationtable;
                    * /
                    //echo $ durationtable;
                    //echo $ statisticacontent;
            }
        mysqli_free_result ($ usersresult);
        }
        mysqli_close ($ usersconn);
? >
    <
div class= "tableblock" >
        <
table id= "userdurationcalltable" >
            <
tr >
                <
td >
                    Username
                <
/td >
                <
td >
                    Call duration
                <
/td >
            <
/tr >
        <
/table >
    <
/div >
    <
/div >
    <
div class= "centeredblock" >
Duration of calls by operators <
/div >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ operatorsconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ operatorsconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ operatorsresult= mysqli_query ($ operatorsconn, "SELECT * FROM` operators` ");
                if ($ operatorsresult) {
                    //$ phptable= "";
                    $ MenuTableOperatorsWrapper= '<
div class= '. "wrapper".' >
<
div class= '. "leftmenuoperators".' >
';
                    $ leftmenuoperators= "";
                    while ($ rowoperator= mysqli_fetch_assoc ($ operatorsresult)) {
                        $ leftmenuoperators.= '<
div class= "elemcheckbox" >
<
input class= "checkboxitemoperatorlist" type= "checkbox" name= '. $ rowoperator ["name"].' value= '. $ rowoperator ["id"].' >
<div class= "elemoperatorlist" > '. $ rowoperator ["name"].' <
/div >
<
/div >
';
                    }
                    $ MenuTableOperatorsWrapper.= $ Leftmenuoperators;
                    $ MenuTableOperatorsWrapper.= "<
/div >
";
                    echo $ MenuTableOperatorsWrapper;
            }
        mysqli_free_result ($ operatorsresult);
        }
        mysqli_close ($ operatorsconn);
? >
    <
div class= "tableblock" >
        <
table id= "operatorsdurationcalltable" >
            <
tr >
                <
td >
                    Operator
                <
/td >
                <
td >
                    Call duration
                <
/td >
            <
/tr >
        <
/table >
    <
/div >
    <
/div >
    <
div class= "centeredblock" >
Funds statistics for a period of time <
/div >
    <
div class= "chooseperiod" >
        <
div id= "labelchooseperiod" >
Select the time period <
/div >
        <
div class= "chooseperiodbegin" >
            <
div class= "labelperiodbegin" >
The beginning of the period <
/div >
            <
input type= "datetime-local" id= "beginlocaldate" name= "begindate" step= 1 >
<
/input >
        <
/div >
        <
div class= "chooseperiodend" >
            <
div class= "labelperiodend" >
End of the period <
/div >
            <
input type= "datetime-local" id= "endlocaldate" name= "enddate" step= 1 >
<
/input >
        <
/div >
    <
/div >
<
? php
        $ hostname= "localhost";
        $ username= "root";
        $ password= "";
        $ dbname= "dbcall";
        $ usersconn= mysqli_connect ($ hostname, $ username, $ password, $ dbname);
        if ($ usersconn=== false) {
            die ("Error:". mysqli_connect_error ());
        }
        else {
            $ usersresult= mysqli_query ($ usersconn, "SELECT * FROM` users` ");
                if ($ usersresult) {
                    //$ phptable= "";
                    $ MenuTableWrapper= '<
div class= '. "wrapper".' >
<
div class= '. "leftmenu".' >
';
                    $ leftmenu= "";
                    while ($ rowuser= mysqli_fetch_assoc ($ usersresult)) {
                        //$ leftmenu= "";
                        //$ leftmenu= "";
                        $ leftmenu.= '<
div >
<
input class= "checkboxitemuserlisttotalcost" type= "checkbox" name= '. $ rowuser ["name"].' value= '. $ rowuser ["id"].' >
'. $ rowuser ["name"].' <
/input >
<
/div >
';
                        //echo '<
div >
<
input class= "checkboxitemuserlist" type= "checkbox" name= "users []" value= '. $ rowuser ["id"].' />
'. $ rowuser ["name"].' <
/div >
';
                        //echo $ leftmenu;
                    }
                    $ MenuTableWrapper.= $ Leftmenu;
                    $ MenuTableWrapper.= "<
/div >
";
                    echo $ MenuTableWrapper;
            }
        mysqli_free_result ($ usersresult);
        }
        mysqli_close ($ usersconn);
? >
    <
div class= "tableblock" >
        <
table id= "stattable" >
            <
tr >
                <
td >
                    Username
                <
/td >
                <
td >
                    Total call cost
                <
/td >
            <
/tr >
        <
/table >
    <
/div >
    <
/div >
<
script src= "jquery-3.6.0.min.js" >
<
/script >
<
script src= "userdurationcall.js" >
<
/script >
<
script src= "operatordurationcall.js" >
<
/script >
<
script src= "totalcost.js" >
<
/script >
<
script src= "addinfooperator.js" >
<
/script >
<
script src= "addinfouser.js" >
<
/script >
<! -< script src= "addinfocall.js" >
<
/script >
->
<
/body >
<
/html >

Initially, I am on the page

After clicking on the Add button (#addnewuser)

is displayed at the top of the page, and an entry should be added to the #alllistusers table.

@teran help. I looked to see if all divs are closed on the page -everything seems to be closed. Help find the cause of the strange behavior.

beginner2021-10-08 14:55:29

You probably forgot to disable the standard action of the button, and in the end the button just sends your

and thus causes the page to reload?

andreymal2021-10-08 14:58:00

@andreymal how to disable standard button action?

beginner2021-10-08 15:00:18

@beginner