javascript - Datatable showing only on row from jquery ajax response
Get the solution ↓↓↓I wrote two different functions using jquery, the first function(table()) loop through an object from JSON response in jquery ajax success. Then call the second function(column()) called column with a parameter an element of the array from the object in the first loop. to make it short i expect the result to be rows, with columns of data from the database.
search();
function search(query){
$.ajax({
type:'GET',
url:'/getmsg',
data:{
"_token":"{{ csrf_token() }}",
query:query,
},
success:function(response){
table = row(response);
$("#content").html(table);
console.log(response);
},
});
}
//ROWS
function row(response){
// LOOP TROUGH THE OBJECTS
// DISPLAY THE ROWS
columns = "";
for(i = 0; i<response.length; i++){
//columns = "<tr>";
object = response[i];
columns += column(object);
}
console.log(columns);
return columns;
}
//COLUMN
function column(object){
// return object["id"];
// output = "<td>"+object['id']+"</td><td>"+object['name']+"</td><td>"+object['email']+"</td>";
obj = Object.values(object);
output = "<tr>";
for(i=0; i<obj.length; i++){
output +="<td>"+obj[i]+"</td>";
}
output += "</tr>";
return output;
}
Answer
Solution:
This is how I was able to fix this error. STEP 1 1. I tried for figure out the where the logical error occurred by trying to display count for of loops in the first function table and it works correctly, which means the error is within the column() function 2. I tried the same way in the second function column() and I figured out it only loops once. this means I point of concentration. Still, it doesn't show any syntax error.
STEP 2 I started suspecting scoping issues I decided to copy the script in the column() function and paste it in the table() withing the loop. This way i'm exacuting the code directly, but you notice the outer loop and the inner loop are having a pointer variable with the same declaration ( i ) which will cause a syntax error. i changed the inner loop pointer declaration to ( j ) IT STARTED WORKING PROPERLY. The error i have been battling with was scoping error. unlike JAVA and PHP that i know, i believe js has the most complicated scoping logical errors, so watch out. CONCLUTION In JavaScript there are two types of scope: 1. Local scope 1. Global scope
According to https://www.w3schools.com/js/js_scope.asp Local JavaScript Variables
Variables declared within a JavaScript function, become LOCAL to the function.
Local variables have Function scope: They can only be accessed from within the function. Example
// code here can NOT use carName
function myFunction() {
var carName = "Volvo";
// code here CAN use carName
}
Share solution ↓
Additional Information:
Link To Answer People are also looking for solutions of the problem: filter_sanitize_string deprecated
Didn't find the answer?
Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.
Similar questions
Find the answer in similar questions on our website.
Write quick answer
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.
About the technologies asked in this question
PHP
PHP (from the English Hypertext Preprocessor - hypertext preprocessor) is a scripting programming language for developing web applications. Supported by most hosting providers, it is one of the most popular tools for creating dynamic websites.
The PHP scripting language has gained wide popularity due to its processing speed, simplicity, cross-platform, functionality and distribution of source codes under its own license.
https://www.php.net/
JavaScript
JavaScript is a multi-paradigm language that supports event-driven, functional, and mandatory (including object-oriented and prototype-based) programming types. Originally JavaScript was only used on the client side. JavaScript is now still used as a server-side programming language. To summarize, we can say that JavaScript is the language of the Internet.
https://www.javascript.com/
JQuery
JQuery is arguably the most popular JavaScript library with so many features for modern development. JQuery is a fast and concise JavaScript library created by John Resig in 2006. It is a cross-platform JavaScript library designed to simplify client-side HTML scripting. Over 19 million websites are currently using jQuery! Companies like WordPress, Facebook, Google, IBM and many more rely on jQuery to provide a kind of web browsing experience.
https://jquery.com/
HTML
HTML (English "hyper text markup language" - hypertext markup language) is a special markup language that is used to create sites on the Internet.
Browsers understand html perfectly and can interpret it in an understandable way. In general, any page on the site is html-code, which the browser translates into a user-friendly form. By the way, the code of any page is available to everyone.
https://www.w3.org/html/
Welcome to programmierfrage.com
programmierfrage.com is a question and answer site for professional web developers, programming enthusiasts and website builders. Site created and operated by the community. Together with you, we create a free library of detailed answers to any question on programming, web development, website creation and website administration.
Get answers to specific questions
Ask about the real problem you are facing. Describe in detail what you are doing and what you want to achieve.
Help Others Solve Their Issues
Our goal is to create a strong community in which everyone will support each other. If you find a question and know the answer to it, help others with your knowledge.