ohad Posted August 21, 2020 Share Posted August 21, 2020 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: <!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 <?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 <?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: $(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); }); } Quote Link to comment https://forums.phpfreaks.com/topic/311361-javascript-error/ Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.