Javascript error

Javascript coding ..

Moderators: egami, macek, gesf

Post Reply
ohad
New php-forum User
New php-forum User
Posts: 8
Joined: Fri May 22, 2020 9:08 am

Fri Aug 21, 2020 11:00 pm

Hi all,



I try to populate html table by query and ajax.

The idea is that i have a textbox in which the user enter a code, the system get its description upon focusout event from the database. (This section works well)

After that, upon double click on the description that was retrived, the js should populate the table upon the code the user enterd. The problem is that in this case i get an error:

Uncaught TypeError: Cannot use 'in' operator to search for 'length' in

I tried to search the web. Most suggest to add JSON.parse. But the data is already on JSON format, so I dont need to do it. Does anyone see what do I miss in here?

Here are my codes files



Thank you

index:php

Code: Select all

<!DOCTYPE html>
<?php
    require_once("../xxx/Includes/GlDbOra.php");
    if ($_SERVER['REQUEST_METHOD'] == "POST" && !empty($_POST['CATALOG_ID']))
    {
       session_start();
       $_SESSION['CATALOG_ID'] =$_POST['CATALOG_ID']; 
    }
?>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Budget Items</title>
        <script type="text/javascript" src="../../php-ajax/jquery-3.5.1.js"></script>        
        <script src="../../bootstrap-4.5.0-dist/js/bootstrap.min.js"></script>
        <script type='text/javascript' src='js/item_funcs.js'></script>
        <link href="../xxx/css/global_style.css" type="text/css" rel="stylesheet" madia="all"/>
        <link href="../../bootstrap-4.5.0-dist/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
    </head>
    <body>
        <div id="page-wrap">
            <section id="main-content">
                <div id="guts">
                    <span style="clear: both; float: left; margin-left: 5%;">
                        <label for="catalog_id">Catalog Id</label>
                        <input type="text" name="catalog_id" class="catalog_id" value=" <?php echo htmlspecialchars($catalog_id, ENT_QUOTES); ?>" placeholder="<?php echo catalog_id; ?>"/>
                        <input type="text" name="catalog_id_desc" class="catalog_id_desc" readonly />
                    </span>
                    <br>
                    <div class="container">
                        <div class="row">
                            <div class="panel  panel-primary filterable">
                               <div class="panel-heading">
                                    <h3 class="panel-title">Items</h3>
                               </div>
                               <table class="table table-fixed">
                                   <thead>
                                        <tr class="filters">
                                            <th><input type="text" class="col-xs-2" placeholder="Item Id" disabled></th>
                                            <th><input type="text" class="col-xs-6" placeholder="Description" disabled></th>
                                            <th class="col-xs-2"></th>
                                            <th class="col-xs-2"></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        
                                    </tbody>
                                </table>
                            </div>
                            <form name="AddNewItem"  action="budget_items.php">
                                <button class="load_form" value="insert_with_predifined"><span class="glyphicon glyphicon-plus"></span> Add Item</button>
                            </form>
                        </div>
                    </div>
                </div>
            </section>
        </div>
     </body>
</html>
GlDbOra.php

Code: Select all

<?php
    class DBOracle 
    {
        private static $instance = null;
        private $OracleUser="xxx";
        private $OraclePwd="xxx";
        private $OracleDB="xxx";

        public static function getInstance() 
        {
            if (!self::$instance instanceof self) 
            {
                self::$instance = new self;
            }
            return self::$instance;
        }
        // The clone and wakeup methods prevents external instantiation of copies of the Singleton class,
        // thus eliminating the possibility of duplicate objects.
        public function __clone() 
        {
            trigger_error('Clone is not allowed.', E_USER_ERROR);
        }

        public function __wakeup() 
        {
            trigger_error('Deserializing is not allowed.', E_USER_ERROR);
        }

        public function __construct () 
        {
            $this->con = oci_connect($this->OracleUser, $this->OraclePwd, $this->OracleDB);
            if (!$this->con) {
                $m = oci_error();
                echo $m['message'], "\n";
                exit;
            }
        }

         public function get_general_codes_desc($table_code, $value_code) 
        {
            $query = "begin get_gcodes_desc(:table_code_bv, :value_code_bv, :value_desc_bv); end;";
            $stid = oci_parse($this->con, $query);
            oci_bind_by_name($stid, ':table_code_bv', $table_code);
            oci_bind_by_name($stid, ':value_code_bv', $value_code);
            oci_bind_by_name($stid, ':value_desc_bv', $value_desc,30);
            oci_execute($stid);
            oci_free_statement($stid);
            oci_close($this->con);
            return $value_desc;
        }

         public function get_items($catalog_id) 
        {
            $id=0;
            $query = "select * from items_catalog where catalog_id=:catalog_id_bv";
            $stid = oci_parse($this->con, $query);
            oci_bind_by_name($stid, ':catalog_id_bv', $catalog_id);
            oci_execute($stid);
            while($value = oci_fetch_assoc($stid))
            {
                $row1[$id]['item_id'] = $value['ITEM_ID'];
                $row1[$id]['item_name'] = $value['ITEM_NAME'];
                $id++;
            }
            return $row1;
        }
        
       }
?>
global_functions.php

Code: Select all

<?php
    require_once("Includes/GlDbOra.php");
    // function selector
    switch($_GET['method'])
    {
        case 'get_catalog_desc':
            get_catalog_desc();
            break;  
        case 'get_items':
            get_items();
            break;  
        default:
            echo "Unknown method";
            break;
    }

     function get_catalog_desc()
    {
        //get username from oracle DB
        $catalog_id=$_POST['catalog_id'];
        $data = (DBOracle::getInstance()->get_general_codes_desc("CATIND",$catalog_id));
        echo json_encode($data);
    }
    
    function get_items() 
    {
        $catalog_id=$_POST['catalog_id'];
        $data = (DBOracle::getInstance()->get_items($catalog_id));
        echo json_encode(array_values($data));
    }
?>
Here is the javascript file i use name item_funcs.js:

Code: Select all

$(document).on('focusout', '.catalog_id', function() 
{
    var catalog_id=$(this).val();
    catalog_id=$.trim(catalog_id);
    if (catalog_id!==' ') 
    {
        $.ajax
        ({
            method:"POST",
            url:"../xxx/global_functions.php?method=get_catalog_desc",
            data:
            {
                "catalog_id": catalog_id,
            },
            datatype:"JSON" ,
            success:function(data) 
            {
                data=data.replace(/['"]+/g, "");
                $('.catalog_id_desc').val(data);
//                load_items(catalog_id);
            },
            error: function(data)
            {
                alert(data.errorMsg);
            }
        });
    }
    else
    {
        alert("Please enter code");
    } 
});

$(document).on('dblclick', '.catalog_id_desc', function() 
//function load_items(catalog_id) 
{
    var catalog_id=$('input[name=catalog_id]').val();
    $.ajax
    ({
        method:"POST",
        url:"../xxx/global_functions.php?method=get_items",
        data:
        {
            "catalog_id": catalog_id,
        },
        datatype:"JSON" ,
        success:function(data)
        {
                load_items(data)
        },
        error: function(data)
        {
              alert(data.errorMsg);
        }
    });
});

function load_items(data)
{
    $.each(data, function(index, obj) 
    {
        var row = $('<tr>');
        row.append('<td>' + obj.item_id + '</td>');
        row.append('<td>' + obj.item_name + '</td>');
        $('tbody').append(row);
    });  
}
Post Reply