Это видео недоступно.
Сожалеем об этом.
Retrive Data From Inputbox And Print In The Same Page On Table Using JavaScript
HTML-код
- Опубликовано: 27 авг 2018
- This video contains the tutorial of retrieving data from the input box and print them on a table on the same page where the table row will be increased dynamically. To learn this you need to know the basics of Html, CSS & JavaScript.
In this tutorial, we'll be handling the basics of data processing and display with Javascript. The inputs your user gives in the input text boxes should be processed by our Javascript code and displayed in the desired format in a table.
This video is made in the Bengali language. If you face any problems or have anything to say, let me know in the comment section.
Source code: github.com/sunnny4u/Retrive-u...
If this video helped you like this, comment and SUBSCRIBE..!
Also visit our Facebook page: / codespathshala
![[Javascript tutorials #2] Get details and display in a table JS Part 3 - Data processing & display](http://i.ytimg.com/vi/vaj2kAfPYys/mqdefault.jpg)
![[Javascript tutorials #2] Get details and display in a table JS Part 3 - Data processing & display](/img/tr.png)
![JavaScript - How To Add Edit Remove Selected Table Row From Input Text In Javascript [ with code ]](http://i.ytimg.com/vi/KnKMGCSPj3Y/mqdefault.jpg)
Very nice 👌👌
I searched this type of video so many days.
Glad that i could help, stay tuned for more videos like this.
Very helpful,
Very very thank you
Glad it was helpful!
Great initiative brother. Go ahead.
Thank you for your appreciation.
thank you brother it helped me a lot
You are welcome.
Hit like and Subscribe please.
Logical!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Yep.!
too good
Darun
Thank you.
To much helpfully love it , what if i want all the above after pressing add in one single cell , please suggest
all data in one cell?
how to modify it to add Total ,Average and Grade ??
Thanks mate...
Welcome 😊
Nice work
Thank you! Cheers!
By using this inputs :
Loan Amount,
Annual Interest Rate,
Loan Period
I want to calculate the Grid as :
Payment No
Payment Amount
Principal Amount Paid
Interest Amount Paid
Loan Outstanding Balance
From the Loan Period Grid rows want to add
if the Loan Period is 36 the grid want to calculate the 36 rows
is it possible in this.
Please reply this for me
Yes it's possible.
sir, can u add Date of birth with select option tag and gender radio button and it will excuted in like this only and
Pls how do I create a button that delete the input when clicked on.. thanks
Contact our facebook page please. Here is the link: www.fb.com/codespathshala
Thanks
You are welcome.
Hello sir I want to dynamically store image in the variable, Please suggest me some thing.
stackoverflow.com/questions/20561056/how-to-store-dynamic-image-at-client-side
Check this out
can you please create a video in which you create 2 separate web pages one having only table and other having only input box please
We will try to do that. Meanwhile, you can do this-Write the js code in a separate file, and link those 2 html file( 1 having input box ,another having table )
How to display corresponding row values like we have create button for each row when we click on that button corresponding row values should display
Could you please elaborate a little more
thanks da
Welcome da
good video
Glad you enjoyed
Suppose we have two tables; Teens and Adults. If the age is less than 20 then the data is entered onto teen table and if age is greater than 20, then the data is added to adults table,. How do we achieve this.?
Please contact our Facebook page, because we won't be able to share files here. Send us a message here : fb.com/codespathshala
Hii where do I get the explanation on English for script code written in this video.
Documentation of this script code is not available. If you can show it to script coder, then he/she can explain it. I could explain as well but it would become a long text.
Good
Thanks
Great work..... I want keep data after refresh the page or data will freeze after page refresh... please guide me for that... Thanks...
You need to you database for that. You can use your local storage, store your data there and fetch the data each time you refresh. Or you can use databases like SQL, MySQL or others.
goood yr
Thank you
sir please make video on how I can add & print data using crud method.🤔
Thank you for your comment. We will try to make a video on this.
is there anyway for me to save the data in the table and have it re appear every time you launch the webpage?
In that case, you need to use Database.
@@CodesPathshala DB are so hard I’ve been using them for a minute but thank you for the reply
i have to write all code on sublime but not showing the deails in table ......why ????? pleaze can You help me out ...please its urgent .....sir
did you follow the tutorial as it is..!
Same here
My question is its saved permanently after refresh or close and open again.
No, it's not saved permanently.
use localStorage property in javascript for that, it will store the user data permanently, unless you use the localStorage.removeItem method
I'm getting table entries as undefined whenever I hit the 'add' button. What can b done for this?
What did you use to declare the variables?
One more question i want to save submited form on server.
You have to write js for this, it's possible.
Ok clicking submit button it should get save in backend database table ,how to do this?.
Explain this, please help me?
watch how to add mySql to website
@@CodesPathshala okay I will
If we have to print any radio value or date value or checkbox value then how can we do it
First, you have to check each radio then you can get data by applying conditon.
Read this for more.
stackoverflow.com/questions/15839169/how-to-get-value-of-selected-radio-button
can we create its database to store values?
yes we can
Please do the video how to save that input given data in that same page
There is video linked at the end of this video. I have shown in the video, how to save the inputted data.
how do we use a 'for' loop to add unlimited user inputs and it keeps adding rows and displaying data in those cells?
I didn't get it, could you be more precise?
If it helps,
using this code you can add unlimited rows and inputs.
What can i do if we want to see that table on another page ?
Write the js code in a separate file, and link those 2 html file( 1 having input box ,another having table )
Hi can you show how to add a reset button along with the add button?
Just add this line, inside the form
showing uncaught type error insertCell is not a function..what to do sir
Contact our facebook, we will try our best to help
I am your 1st viwer and liker
Be with us like this, thank you
Plz tel me how to add edit or delete button for each row
It will be a long text if i describe those things.
all i can suggest is you can add edit or delete button by using HTML and css. And to make them work you need to add some functions to js file.
Lakin may jo name.... Add karne par show nahi ho raha hai
Please follow the video accordingly, i guess you are missing something.
Sir.. then how to retrieve data from one page to another page ??
Please sir make one video on this topic..
okay i will make a video on it soon.
@@CodesPathshala Thank you sir..
Sir.. can you upload a video on this topic tomorrow?
This step is included in my project but I don't know how to retrieve data and the project deadline is tomorrow night
I will try.
@@CodesPathshala Ok sir..
As soon as I do click on add, the data disappears ?
Watch and follow the video accordingly.
Yes mine too
in addEventListener fucntion add e.preventDefault() with e argument to fucntion
are you refresh the page if i refresh stored datas are removed
Yes, because we are not storing our data, this is just a demo of how you can take user input and retrive.
thank u sir...How to store array values in database using webmethod..?
There are functions to save js table values as xls file. Please search on google
Very Nice results, i did the same but it didn't work for me, couldn't store any data in table ( i copied every step u made ) , any idea what's going on !?
Contact our facebook page. We can recerive file there and analyze. Facebook page link: fb.com/codespathshala
this table information can convert in card if yes then how i need infinit cards
Yes, Table information can be converted into cards, but this will be a complicated process. If you still want to covert your information into cards, you can do that.
You can create cards sequentially as per your information.
You can read this: stackoverflow.com/questions/63216266/convert-rows-of-html-table-into-bootstrap-cards
@@CodesPathshala thank you for replying msg 😊👍🏻😊
Actually how can we control adding plain data to the table??
Follow the link to learn data validation.
www.w3schools.com/js/js_validation.asp
I have a question about how to make the same thing in the video but the difference how to the form is in another web page & table in another web page and how to add the form data to the table pls reaply
Write the js code in a separate file, and link those 2 html file( 1 having input box ,another having table )
@@CodesPathshala did you mean like linking from the header or the form action ?
No no, write the js code in a separate js file and link this js file to those two HTML files.
@@CodesPathshala will the data inserted will be stored permanently?
@@siddheshwarsarang2663 No. It's temporary.
Code is perfect,,,,, but After clicking add, I couldn't see entered details.....
Please follow the tutorial properly
Yes, but i don't know where I made mistake.... Ok thanks for your response
@@virudhusamayal7618 If you sill can't find any mistake, please DM on our facebook page or group.
Same problem
Also create this table using php
We will try, thank you.
How I do let the results print in a different template?
make a different table and connect with that table.
@@CodesPathshala Thanks!
Are you using local storage ??
No I am not using local storage.
how to make this input saved in table after because it does not get saved after refresh it changes again back to normal empty
If you want to save data then you need to use database.
@@CodesPathshala where can i find that can you help me brother ?
This is a whole different thing, you nee to have ideas about mysql and JavaScript framework. Try watching these tutorials.
@@CodesPathshala Thanks For The Help Much Appreciated
arey sunny bhai
Ji bhai.
ye django model se bhi kar sakte ho kya?
No..Not yet.
If i refresh browser, all data are vanished
Yes, we are not storing data here. That's why
Sir FIRST NAME + MIDDLE NAME + LAST NAME IN ONE LINE HOW TO JAVA CSRIPT WRITING ✍ HELP ME
Sorry for the late reply, please read this -
stackoverflow.com/questions/52544089/how-to-create-two-html-buttons-side-by-side
What use template
Template name
Please please please please please please please reply
Reply
Could you be more precise? I don't get it. Which template?
How to save this in local storage
User Access
There is a video in the end screen section. There I have shown, how to save the data in local storage.
@@CodesPathshala ok I will check this?🤗
Can make it stay there until i delete it
u Can, in that case you will have to save data in a file.
@@CodesPathshala Like a JSON File ??
can you please explain it in english or hindi?
Yes I can. DM us on instagram @codespathshala
Your javascript code is not working
It should work, could you tell us where it is not working?
how abaout on another page?
You can do it.
@@CodesPathshala how? can you teach me?
Contact our facebook page.
I cant run the codes i use notepad 😔
Just convert the file into a HTML file, it doesn't matter which text editor you use.
ভাই Nid কার্ডের তথ্য দিলে এরকম ভাবে টেমপ্লেটে অটোমেটিক বসে যাবে এটার একটা ভিডিও টিউটোরিয়াল দেন
Same vabei kore felano jabe, sudhu index change kore dite hobe.
@@CodesPathshala তারপরেও একটা টিউটোরিয়াল দিলে খুব ভালো শিখা যেত
Sorry bro, I wish amar haate enough time thakto. ami banaya ditam.@@zakariahossain2857
How to show data in another page
stackoverflow.com/questions/25987052/how-to-call-table-from-another-html-page
This might help
How to set 2 rows in single click of button
function AddRow(){
var AddRown = document.getElementById('show');
var NewRow = AddRown.insertRow(n++);
var NewRow_1 = AddRown.insertRow(n);
list1[x] = document.getElementById("fname").value;
list2[x] = document.getElementById("lname").value;
list3[x] = document.getElementById("email").value;
list4[x] = document.getElementById("age").value;
var cel1 = NewRow.insertCell(0);
var cel2 = NewRow.insertCell(1);
var cel3 = NewRow.insertCell(2);
var cel4 = NewRow.insertCell(3);
var cell_1 = NewRow_1.insertCell(0);
var cell_2 = NewRow_1.insertCell(1);
var cell_3 = NewRow_1.insertCell(2);
var cell_4 = NewRow_1.insertCell(3);
cel1.innerHTML = list1[x];
cel2.innerHTML = list2[x];
cel3.innerHTML = list3[x];
cel4.innerHTML = list4[x];
n++;
x++;
}
use this function, for further queries, contact our Facebook group with the same name as this channel
@@CodesPathshala Thank you very much Sir.
@@_India2047 You are welcome
Not show details
It should, please follow properly
How can we delete any entry here?
it's not possible to write whole thing in a comment.
Although you can search on Google, how to delete an array index. And also learn about OnClick() function.
@@CodesPathshala Can I contact you somehow? I want to discuss some things. I am using your code in my websites and i am facing some difficulties
contact our facebook page facebook.com/codespathshala
@@TahirAli-ms2rq Hey! Did you find the solution for it?
@@poojithareddy3318 nope
Is this possible to display the input as blank after clicking add...
Yes
doesnt work
It should work. If it doesn't work, you can contact us on our fb page.
link: facebook.com/codespathshala
Hi
Hello.
IMAGE NOT CLEAR
Which image?
mg sa hwa hi ni very sad
I didn't get it
Rhus video has no carity.
What do you mean.!
@@CodesPathshala this video is not clear to see. That's only sir. Ur explanation is clear.
May be because of dark theme it wasn't clear to see.
@@CodesPathshala u are right. Sir make video on user inputs stored in array of object then display on html.
Thank you for your suggestion, we will try to make a video on it.
your approach is not correct though so many bug
Thank you for your valuable opinion, could you please tell us about the bugs.!
@@CodesPathshala want to get the delete and edit link when the data is displayed on the table...how to get it
@@aditideshmukh2101 I will get back to you, meanwhile you can watch this-love2dev.com/blog/javascript-remove-from-array/