Complete CRUD Operations using JavaScript with CSS & Html

#learningzity#javascriptcrud#beginnertutorial
In this video I developed basic javascript crud operations help with the css and html. more than that I explained the javascript DOM manipulation methods including getElementById() and getElementBtTagName()
🔵Check out the code on my Github if you get stuck : github.com/osh...
🟠React Basics #1 | Learn the react basics in 5 minutes
• React Basics #1 | Lear...
🟠Student Registration Form Using React | Basic of Form Handling
• React Basics #1 | Lear...
Thanks For Watching ❤💻

[@lonthroop]

Excellent video and teaching. Helped me to remember how to code this. Question; is there a simple way to add a search function to find by Product code or Product name the contents already entered in to the storage? Thank you for your time. I subscribed.

[@learningzity]

Updated with search function in github search branch 👇👇👇 github.com/oshgodage/JavaScript-Crud-Operation.git

[@jayakumar2927]

@@learningzity how to grid operations

[@LinoManut-c5x]

😊😊😊😊😊😊😅😅😊😊

[@HamzaMoeed-n2e]

Mam this video is very very helpful thanks mam

[@AmeerHamza-gz6vp]

Dude you are the best. It is safe and 100% works

[@CelebrityNewsHunt]

Garrett Evans Wow thank you Garrett, you've made my day!

[@michelinfighter2010]

I love a lot your programming tutorial: your excelent explanation, the background music, your beautiful accent...

[@learningzity]

Thank you @Michel Amir Madrigal Torres !

[@Maharashtra_Volgs]

thanks for video i have seen many videos to learn it but you are the best😇

[@samuelsamm9297]

Excellent ...pls keeping more videos

[@mjpender9443]

Very well presented. very clear and helpful. Thanks. Mary

[@rhythmtouchessoul8584]

teaching technique is lovely❤️🤗

[@user.s.]

wonderful video,great content 👌🙌

[@azeemtariq3257]

Thank you, it helped but i had a little bit of problems. Good Tutorial

[@angelicatapeno4363]

This is essential for my practice, thank you

[@victoradler7518]

I from Brazil, thanks! I love yoooooou.

[@moulikumar9095]

tq so much for ur clearcut explanation...

[@prashantkumarsingh7238]

Thanks for this explanation.

[@emiliodaf]

hi there, whats up?...thanks for sharing this project....it's really helpful to put the main js concepts in practice...just keep it up!!

[@mackygetigan4512]

BROOO thankyou so much, this really helped and the tutorial was really easy to use as well :)

[@JonnakutiKiranBabuBVCE]

Best Video Ever❣❣❣❣❣❣

[@HemmingEducation]

Great! Works well and very helpful :)

[@Henry_Nunez]

Very good 👏👏

[@Daniel-2275]

tNice tutorials actually was, and I'm just starting myself, I have no idea what I'm doing but I have a ton of ideas in my head. Ti to figure tNice tutorials out

[@SongsetImage]

Thank you so much ma'am this video very useful

[@jawwad089]

using soft, can't wait to get my hands on it.

[@shaikasif3356]

best luck!

[@frontendhubs]

Nice Explanation

[@vanishrimorabad7478]

This is awesome demo... Thanks :)

[@ShahzaibNazar-p9r]

Thanks to share

[@franciscoadesousa4112]

Excelente aula!! obrigado por compartilhar conhecimento parabéns.

[@learningzity]

Thank you ! ❤

[@nethzkiecueto8567]

@@learningzity hello can i ask a question? i follow your codes but in my case the java script didn't working...please help me 😥

[@CLASSBEAT]

Good Explaination, But include Live Server....! People might confuse like Me Haha...😅😋

[@lerouxgame4249]

need the other half of the video!

[@jonathanabes9099]

Very helpful thanks!!

[@heavyfacts557]

that's awesome🥰

[@harmansingh8994]

Thank you for this video

[@imran-baitham]

nice work keep it Up

[@learningzity]

Thanks @imran baitham !!

[@user-dk8ej5kn1v]

hi, you need to add selectedRow = null; to the last line in function updateRecord(formData). thanks for your video

[@dhrumilpatel3988]

excilent

[@sylvainmounier7433]

Thank you ! Tutoriel intéressant et clair.

[@xfordnine7477]

Great Job thanks

[@zedmedia727]

Great tutorial, thank you so much, is it possible to request a video on some new topic?

[@learningzity]

Yes, soon

[@p.yogeshreddy2418]

Awesome lecture mam!!! Really it is very useful...

[@learningzity]

It's my pleasure 😊

[@PrefabStudios]

Having problems, It doesnt let me add a whole new Record, it replaces the first one when i put "function onEdit(){" Ut let's me make more than 1 record but not edit them but when i do "function onEdit(td){" it lets me edit the records but doesnt let me make a new record, only that same one

[@learningzity]

Updated the code.

[@girliesm]

Same problem, when i add the onEdit(this) in cell5.innerHTML it has a error

[@HamzaMoeed-n2e]

same problem

[@nandanikalansooriya9020]

❤

[@FMFT]

Suggestion: AddressBook JavaScript Vanilla

[@wp-elementorpro8599]

perfect video

[@haiderjaveed2343]

else to it. How do I do that? Your answer would be Nice tutorialghly helpful and appreciated.

[@khplus8091]

THANK YOU!! ✌

[@suyognagapurkar7088]

Thank you madam

[@rayyanabdulwajid7681]

Thanks❤

[@D_Nadeeshan]

In The setup hey bro i wanted to know how do u load your Sample guide into the packs in the browser?

[@somanyann]

i cant add dynamic table. you have done export default function in onFormSubmit but does not really tackle that

[@phamuyen9827]

I really like the way you do. Can you create a series about NodeJs and ReactJS full tutorial, and some ecommerce projects in fact? Thanks!!

[@learningzity]

It seems good idea 🙌

[@animevilla9432]

hey there Excellent video by the way watching this video i make an student form and i have a doubt that when i am entering the roll number it should be unique like if i make the 2nd entry with the same roll number there should be a pop up that roll number is present in the table. Like that can you help me for the same.

[@kndvideo734]

Hi I like your video but i was having trouble when I type product code product name qty and price nothing appeared

[@plofficial5258]

how to add multiple records? and after updating the records? how it posibble ?

[@madhuriausula4125]

Thank you 😊

[@ahemadshaikh5533]

Background music like - explaining movies

[@kaladrashid]

How we can make that program in two pages? One page for encoding And one page for saving table

[@Arunkumar-lw1pb]

why we passing the insertNewrecord(data) => data inside the function parametre can u help am a begineer

[@learningzity]

It uses to pass the formData values (var formData=readFormData();) such as Product code, Prodcut Name, Qty, Price to the insertNewRecord(data) as parameter

[@Rs-nh7zx]

Loved this! Can you do local storage with it?

[@makeasence1344]

Cookie perfect in local storage

[@patel5532]

Thanks for amazing tutorial, but event is deprecated what should I use instead of event in onFormSubmit() function?

[@rakeshdakua9875]

i think addEvent listener should add while click event happens

[@rajbannasa7662]

Thank you so much mam ❤️

[@learningzity]

Your most welcome 😊

[@baitullah381]

Mam valuable video

[@learningzity]

Glad its help ❤

[@obitohashirama6743]

Eeeeeeeeee thank u mam

[@prafulgayakwad3281]

can you made same video using node js on crud opration

[@muhammadfakirullah9986]

Thanks for the video. I just wondering does the data remain there if the tab was closed and open again? Does the data is fetch @ save from db?

[@learningzity]

Since there's no db connection connect with frontend, after refresh you won't get previous entered data

[@muhammadfakirullah9986]

@@learningzity thanks for the answer. Just a quick question...can javascript integrate with backend development?

[@learningzity]

@@muhammadfakirullah9986 for that you can use node.js, which allows the javascript code to be run on the server-side

[@muhammadfakirullah9986]

@@learningzity thanks...i hope you can do more video about coding...i support what you did, to me it gives motivational to others... also thanks a lot for the info 👍

[@saiminhtet8359]

I have a question please answer me My question is where id="storeList" you already used in "insertNewRecord() " how did you do that can you explain me 🥺

[@learningzity]

insertNewRecord() is a function where I call 'storeList' id (5:52 ) using document.getElementById(storeList) (15:12 )

[@tejakommineni2415]

when we refresh the page data has to visible ,but when you refresh data is gone can you solve that problem to me

[@learningzity]

One way is use window.localStorage . it can store data locally within your browser

[@madhuriausula4125]

Thank you

[@shambashibmajumdar1268]

Excellent Explaination mam! Looking forward to connect with you on LinkedIn!

[@miqbal7032]

JavaScript for delete data in localStorage by button on table rows

[@ghorilemin3485]

Complete CRUD Operations using JavaScript with CSS & Html

[@bm_pug]

I get a TypeError: Cannot read properties of undefined (reading ' instertRow') on line 26: var newRow = table.insertRow(table.length); I really can't find my error, and I mimicked it pretty well. Any idea why it might happen?

[@learningzity]

It's difficult to guess the idea without looking at your code, but it seems you had missed something in below line var table = document.getElementById("storeList").getElementsByTagName('tbody')[0]; check the table id and are correctly assign in your code

[@Silent_XYZ]

uh, is there something that im missing? cause ive followed your steps and the table, when i submit it, it doesn't show up. 😅

[@learningzity]

I guess so..Plz check with the GitHub code I mentioned above

[@nagashreebhat5412]

In this project is it connecting to any database?

[@CodingProblemSolver]

afted editing it is giving new table data instead of updating old data

[@alisterteh6219]

need help my submit button does not work after apply javascript

[@learningzity]

Check whether you call the JS function(your submit function) correctly in the submit form. check the code in github

[@lacerdadenisson]

👏👏👏👏👏👏

[@md.kamaluddin5944]

It’s very difficult to understand the codes what you write there. They are to be zoomed out during making the videos.

[@sako4822]

Loved this :) Can you do json file with it?

[@ramramji5883]

How to get total price(auto calculate) in this sequence please update your video ...

[@NestorQuitaligIII]

Hello creator! We are having problems with the data not displaying once we pressed the Submit button.

[@learningzity]

It might be the case of not calling submit function correctly.

[@bhaveshkunbi2164]

How to retain previous value if i submitted once using html form? Example : if HTMl form has 3 input (name , age , Mob number) first i send all 3 data it saved in record successfully. Now if i want to send name (same name) with only updated number than i don't want to enter age again. means age should be there only.

[@learningzity]

If you want to update the mob number you can select the relevant row from the table and submit, the theoretical part starts here as you want -> 19:17 .Therefore No need to send the name again.

[@bhaveshkunbi2164]

@@learningzity actually i am sending data in Elasticsearch (to store data) where i can't select the row and update. Is it possible to get back particular name details from table on html page than i can edit it?

[@learningzity]

@@bhaveshkunbi2164 ​ If you're using ES then you need to know id of it to update, in your case it's similar to mob number id.

[@NileshSahani-e2h]

How can I integreate this to DB

[@intothedepth241]

How to add view function edit and delete is ok but view required

[@althea_ken45]

can I code this on my mobile phone?

[@remzliennon2809]

nice, but how to save the data if they have the data entered how to save that? they have no database!?

[@learningzity]

This is front-end development hence data only store temporary to console, for save data you might need back-end work stuff

[@loveken_code2255]

how about store data after refreshing page

[@mahamfatima1177]

can this work with my live website too? or just for local db?

[@learningzity]

Logic goes with the same way around for the website too

[@arshdeepsinghchhabra1671]

hello there, this video was really informative and helped me but I've a question : what if instead of delete and update btn in every row can we add checkboxes and as we checked a checkbox both delete and update btn should be enabled and we can delete multiple rows on a single click and the same with update

[@basscoversimulation3167]

Have you found the solution to your question, I have the code of what you are describing. I downloaded it from the internet very long time ago.

[@rahulujjawalsharma6503]

Write a program to continuously take a input for students details from the console or html ,the user should be able to add multiple students details once .the data should be saved in a database . Once the data is saved the user should be able to edit and delete option should allow for the bulk delete.plese code

[@janpoonthong]

how is this CRUD when there is no database?

[@W__Dev]

Hey there!! Nice video, but there's something wrong.. After I click on the edit button, I can't insert new lines of data, it appears on the same line that I clicked.

[@learningzity]

Thank you for pointing out that, I updated the code

[@ashoktechview2597]

After CRUD operation to connect DATA basic video

[@mwanakomboswalehi]

how i can i find stored data

[@wonderkidz9159]

I cannot place value in table there is no error

[@Aakash_0091]

How to save all recorded data into database

[@learningzity]

One way is using PHP(create sql connection) file with MySQL database(store data), for this you may need to modify above video code little bit ...

[@glam-jh9wz4mk7c]

I can't see coading

[@btsv4235]

Code not visible

[@pankajantil8349]

Dr mam this form js video very helpful for me but video quality is not good

[@pankajantil8349]

Thnx mam description ma sab details dena k liya