jQuery Ajax CRUD in ASP.NET Core MVC using Popup Dialog

Рет қаралды 175,159

4 жыл бұрын

All about jQuery Ajax CRUD in ASP.NET Core MVC using a Modal Popup Dialog
In this tutorial, we've implemented jQuery Ajax CRUD in ASP.NET Core MVC using Modal Popup dialog. Today, these types of user interface/ methods are used in enterprise applications so that we can avoid reloading the page to do operations on a single controller.
Context discussed :
- MVC Controller with CRUD Operations with EF Core.
- Open the form in the Modal Popup Dialog.
- Submit the form with the jQuery ajax post.
- Show loading spinner while waiting for request-response.
- etc
📂 GitHub Repository
► bit.ly/33KTJAu
💖 Buy me a Coffee
PayPal: bit.ly/3L36ut4
UPI/QR Code Scan: geni.us/ScanQRCode
🌀 Related Videos
bit.ly/36IA1cH : Asp.Net Core MVC CRUD Operations
bit.ly/3dYrVvi : Asp.Net Core User Authentication System
bit.ly/39B6xdh : Asp.Net Core MVC Image Upload
bit.ly/2t0op0W : Asp.Net Core Web API + React CRUD
🔗 Find me in
Udemy : bit.ly/3RtyQSB
Facebook : / codaffection
GitHub : github.com/codaffection
Discord : / discord
Twitter : / codaffection
#jQueryAjax #AspNetCore #CodAffection

Пікірлер: 195

@CodAffection 4 жыл бұрын

goo.gl/RFY5C2 : Subscribe to CodAffection goo.gl/bPcyXW : Buy me a Coffee bit.ly/2HcyCLD : Asp.Net Core MVC CRUD Operations bit.ly/3dYrVvi : Asp.Net Core User Authentication System bit.ly/39B6xdh : Asp.Net Core MVC Image Upload bit.ly/2t0op0W : Asp.Net Core Web API + React CRUD

@kaisonduncan7151 2 жыл бұрын

you all probably dont care but does someone know of a method to log back into an instagram account..? I was dumb lost my login password. I love any assistance you can offer me!

@emmitttroy8477 2 жыл бұрын

@Kaison Duncan Instablaster :)

@kaisonduncan7151 2 жыл бұрын

@Emmitt Troy thanks so much for your reply. I found the site through google and I'm in the hacking process now. Looks like it's gonna take quite some time so I will reply here later with my results.

@kaisonduncan7151 2 жыл бұрын

@Emmitt Troy It worked and I now got access to my account again. Im so happy! Thanks so much you really help me out!

@emmitttroy8477 2 жыл бұрын

@Kaison Duncan You are welcome :D

@waqasriaz30 2 жыл бұрын

Brilliant ! Covered the entire subject in a single video. Professional implemenation !

@bolajibello8917 4 жыл бұрын

Thanks for the job well done. your style of handling jQuery ajax is so superb, I have adopted that style from you long time ago. You are surely among the best tutors on youtube

@CodAffection 4 жыл бұрын

Thanks for your wonderful feedback. keep learning and sharing.

@omarayub1295 4 жыл бұрын

best tutorial I learned all basics of .net from your videos ... highly recommended........ please upload more

@ramchandrathakkar2022 4 жыл бұрын

Very Informative. Liked it a lot. During this lockdown will watch all the videos to update my knowledge.

@nursultanmamytbekov8180 3 жыл бұрын

This tutorial is just BOOOM! Thank you so much!

@mathewbal3990 2 жыл бұрын

көп уақытты айтады гой

@ulyakrasnopolskaya9542 3 жыл бұрын

Thank you for nice tutorial. It's exactly that I was searching for!

@Max1GameChannel Жыл бұрын

25:28 - ctrl+f5 - reloads the current page including the browser cache. It's called Hard reload. It means that the browser will not use the current cache but will be forced to download again all the files (js files, images, scripts, …). You will have the most fresh version of the page sent by the server.

@vadhadiyaabhishek1316 2 жыл бұрын

Really amazing 😍, very very useful video 👍👍🎉 Very well explained 🤩🤩

@lokeshprajapat6449 3 жыл бұрын

result is BOOM! very nice.

@gholamsoori3595 Жыл бұрын

Comprehensive explanation. Thanks for knowledgeable sharing.

@faisalfiaz390 4 жыл бұрын

Just an update. It was my mistake as I wasn't referencing the jquery libraries correctly. It is working now. Thank you.

@ivandzurah7598 2 жыл бұрын

Thank you very much. This video help me a lot in creating my site for student grade. Especially in teachers part of site because teacher has to add , edit and sometime maybe delete grades.

@bravedeveloper 2 жыл бұрын

The project has a bug, after updating a record if you press New transaction button the modal loads the last edited record, but to solve it just update the for New transaction passing an Id=0 instead of null. The anchor could be like this: Nueva Transacción Regards. Good content btw!! congratulations CodAffection! 👍

@meysamghanavati5526 3 жыл бұрын

Thank you for this tutorial, please add pagination in table.. (without exist component for example datatable or etc..) - please implement 0-100 in this project. I hope you should so happy :)

@ronaldjohnson4470 4 жыл бұрын

Great tutorial, thanks again

@argeelearner3978 4 жыл бұрын

Thank you!! Please keep the ASP.NET Core tutorials coming!!! Amazing!!!

@CodAffection 4 жыл бұрын

Sure, Keep learning and sharing.

@rafysancheztilogica8587 3 жыл бұрын

Excellent as always !

@MALITAJ 4 жыл бұрын

Thankz for sharing.. This is what I was looking for 😚

@gabriellemos1124 3 жыл бұрын

Top Top, I work with ASP.NET Core, and create a favorable experience for the user that is being a headache for me, very good and very professional material, I will share a lot with my friends, guys BR thanks, good job !!

@gramozkrosa2497 2 жыл бұрын

Hi! By any chance do you have any project of Crud form with asp net core I have a project to make but i dont know how. Have a nice day

@aldrinalmia3665 3 жыл бұрын

Thank you for this video. It helps me.

@neameh.karineh 4 жыл бұрын

Thank you so much sir, It was very helpful

@kananshanmugam8711 4 жыл бұрын

Thank you very much. It helps me a lot..

@jkmalify 2 жыл бұрын

Thank you Sir ! Learnt a lot

@danielngandu2628 4 жыл бұрын

Great tutorial!

@ahmedmohamed-ti9mc 2 жыл бұрын

Thanks alot ,this is awesome tutorial

@SidCod3s Жыл бұрын

AWEEESOME..Post thax a lott

@user-uo9ov5jo8x 2 жыл бұрын

Лучший 🔥 Огромное спасибо 👍

@guoweing 3 жыл бұрын

Great tutorial.

@MdShuvo-ok6qe Жыл бұрын

very nice tutorial thanks

@Manithan123 19 күн бұрын

Excellent tutorial. Thank you!!

@CodAffection 19 күн бұрын

Glad you liked it.

@anildebata4949 3 жыл бұрын

Very good content man

@faizanhamza9339 4 жыл бұрын

great video

@kritikyorumer 2 жыл бұрын

Thanks!

@AbdulAziz-vh5ev 3 жыл бұрын

Thanks for this video. May Allah Bless you.

4 жыл бұрын

Gerçekten güzel bir örnek olmuş. Ellerine Sağlık.

@redachouiba4862 4 жыл бұрын

Boom .. Good job :)

@osamaaly9988 Жыл бұрын

thank you

@hitasas 3 жыл бұрын

Awesome!!!!

@nandakumar8515 2 жыл бұрын

Thank you

@cuongnguyenvan9997 3 жыл бұрын

thanks for sharing

@thanghoquoc7624 2 жыл бұрын

Nice, tks video help me

@codingislife6387 2 жыл бұрын

OutStanding Yaaar..

@ajayghosh499 4 жыл бұрын

Thanks, i came here for spinner code, when enter without values at "New Transaction". validation messages show with spinner simultaneously. help me with that.

@carlosasanchez8297 2 жыл бұрын

Thank you for this job, it was amazing. Can you do another similiar without using the helpers?

@muhammadraza5108 2 жыл бұрын

Its very nice way of explanation . If you don't mind I have few question which make me confuse 1. is this a good practice to have interface for repository ? or the way you deal with EF please explain Regards

@abdullahfaruquearman1908 4 жыл бұрын

Please upload a video tutorial about server side processing of data table with ajax in asp.net core....keep uploading more videos on asp.net core.

@clealb76 3 жыл бұрын

Great

@lescinqlune 3 жыл бұрын

Hi, Thank You for these valuable tutorials. I have one issue in this tutorial, once I edit a form, clicking on New Transaction will pop up the data that I already have updated, Please how to fix

@engr.malikmuhammadmubashir6828 4 жыл бұрын

Super awesome video. I had been waiting for this for a long time. One request though. How can we implement jQuery DataTables in this?

@CodAffection 4 жыл бұрын

we've covered that in one previous tutorial, it should work. kzfaq.info/get/bejne/ldd5jKWYvLrQhKM.html kzfaq.info/get/bejne/q5dkarRhs7-agZs.html

@AriVenuth 3 жыл бұрын

Thanks for this great tutorial! tried to use in the mobile browser unfortunately do not open popups ...

@samqureshi9415 4 жыл бұрын

Bro . If I want to be a full stack web developer and I decide to build my first application on MERN stack . So React js is a libaray ! Is it necessary to learn (angular js ) a framework also . Or I can make web application without framework also . Library also works instead of framework. ???

@issaseckkane 10 ай бұрын

Hello sir, lot of thanx for this important tuto in Ajax, every things works normally but i have one Remark in my case After doing an update for one record the add new Buton Open The modal with the last One populated in the form instead of permiting to add new transaction. Thx

@pookaoza 4 жыл бұрын

Thank you so much my lord, I wish you all the best success and happiness.

@CodAffection 4 жыл бұрын

Thanks for your wonderful feedback.

@altravels7426 3 жыл бұрын

Lord?

@tsungik 4 жыл бұрын

Thanks for the video. Can you make a video on MVC. Net core using model view?

@lizahargoes778 2 жыл бұрын

Hello i want to query that if we have multiple selectbox in for how can we get value from that in comma seperated ways

@user-lt4ke2dk4b 4 жыл бұрын

Goood Like!!!!!!

@omedeido4855 2 жыл бұрын

Hello, the submit button updates table and brings it "inside" the modalpopup! I've tried to google and followed everything you did but it seems like I am missing something?? any help in this regard?

@luaikayyali Жыл бұрын

Great work and quick. There is a bug, when you add for the second time, it keeps the previous id

@followerofchrist1984 2 жыл бұрын

Thank you very much sir. at 36.38, what if I want to return to a different controller instead of "this", how do I put the controller in place of the "this" keyword

@erwin_jesus 2 жыл бұрын

¡Buen tutorial! Bien explicado. Muchas gracias

@CodAffection 2 жыл бұрын

Gracias por las palabras amables.

@dante85warrior41 2 жыл бұрын

@@CodAffection bro ene l helper a retornar sale error como que no lo reconoce como se genea ese archivo incluso lo pegue en mi proyecto yo hice el crud inmediato desde entity frmaework y solo queria agregarle esa ventna de dialogo que pone con json pero me vota error cuando retorna el json por el helper

@user-pc9rz4hg2y 11 ай бұрын

I just want to know if dapper was used in this video or not?

@anbuanbu6591 4 жыл бұрын

Hi your tutorials are very use full. I need your help. please let me know the mvc and web API based project solution architecture for hrms

@user-jp8uu5lv3s 4 жыл бұрын

Help, please, how to color the line in red if the value in the column is "No"?

@hadiboukdir386 4 жыл бұрын

Why does my Index page not showing the updated data after I submit the form. I always need to refresh the page then I can see the changes!?

@abubakaribrahim2676 2 жыл бұрын

Have you found the solution please?

@carloskanika9466 4 жыл бұрын

Thank you for this wonderful tutorial, I applied these codes in one of my projects, it works correctly but in my views (creation, modification) which opens in modal, the javascript code does not work.

@donny1098 4 жыл бұрын

Make sure you have a reference to either the Bootstrap JS CDN or the downloaded local Bootstrap JS file in your _Layout view

@yalcinbilisim Ай бұрын

Hello, which version of Visual Studio 2019 gives errors?

@NoorASalam-ik1mt 4 жыл бұрын

Hi... I had a problem with update it's not work every time I try to update it's insert as new record ... I follow your steps and use your source code in your website article ... can you help please?

@assistantlabourcommissione4496 Жыл бұрын

I practice this project and i did not add anything new to it but when i click to submit or check the validation , it prints whole AddorEdit file and other information on the browser .... all the code is same as yours... What could be the issue , please help.

@sagarutwani4739 2 жыл бұрын

@CodAffection Kindly help me this out if you know about this, i am getting error when i am creating a controller as same you were creating Error There was an error running the selected code generator: 'Package restore failed. Rolling back package changes for 'CrudCoreWithAjax'.'

@CodeLuffix 4 жыл бұрын

Anyone know why he unchecks configure for https in the creation at the beginning?

@Aman-mt2kr 4 жыл бұрын

your an Amazing bro our country does not have any pay-pall so i cant... is there a source code for this

@syedsharfuddin3246 4 жыл бұрын

@codAffection First of all Great Video Sir !!! , There is a Small Bug in it After Editing a row ,It stores the Values Of the row which Edited , so if we Click New transaction its Opening with the filled Value in it of Edited row ... solution = >

@dustywright2021 4 жыл бұрын

I also had the same issue. The fix worked for me as well. Thank-you.

@CodAffection 4 жыл бұрын

Thanks for the update.

@ajaysingh0426 3 жыл бұрын

Great @Syed your solution fixes the bug.

@lescinqlune 3 жыл бұрын

Thank you Syed for the update, it works!

@OnlineZiggasa 4 жыл бұрын

Great. I need Web Api 2 Registration and Password Email Confirmation Tutorial!!!

@orlandojoaobita7876 Жыл бұрын

Thank you for this great tutorial! I really appreciate your approach to deal with jQuery Ajax CRUD using Popup Dialog in Asp.Net Core. I just have a question. How can I enable client side validation with this approach ?

@CodAffection Жыл бұрын

Glad it was helpful! I've discussed client side validation with same topic in one of my old video. here is the link : kzfaq.info/get/bejne/eq-PjNOh27LLemw.html you might need to make few adjustments inorder to adapt with latest versions. let me know how it goes. hopefully in future if I update the tutorial I will include client side validation.

@vib1336 3 жыл бұрын

Why contentType in the jquery post function is false? It shouldn't be - application/x-www-form-urlencoded?

@rosyanto6356 4 жыл бұрын

Hi i do follow your tutorials, It helps me a lot. i need a small help, can u post a video to call a web service get method with parameters in Angular 2+

@faisalfiaz390 4 жыл бұрын

Thank you for your video. It is very helpful. I am able to add record once however when I try to click second time on button it throw an error on line $('#form-modal').modal('show'); with error "Object doesn't support property or method modal". I am unable to sort it.

@edgarallanpoe18 Жыл бұрын

How to resolve this?

@k1army01 4 жыл бұрын

Hello, thanks for your contribution, I have a small inconvenience, the Json response is arriving empty, why is that problem. Helper.RenderRazorViewToString (this, "_ViewAll", _context.Processes.ToList ()). for this reason the index is empty, and I have to refresh the page to show the list.

@abubakaribrahim2676 2 жыл бұрын

Please have you found the solution yet?

@citro9541 3 жыл бұрын

Thank you for the tutorial. But I've got problem with adding transaction popup window. Every time I edit existing item and save it, next I open the "New Transaction" I have modal filled with last updated item. Is there anything I missed? I check this tutorial twice but can't find any problem

@riwisan5391 3 жыл бұрын

Same here, did you ever figured it out?

@omarbedoui5292 4 жыл бұрын

Thank you for this wonderful tutorial, download does not exists

@osamaaly9988 Жыл бұрын

how to make validation errors disappear after leaving the input (as normal ) without posting the form ?? also, if the form has a dropdownlist it lost it's function after posting the form with error

@richiebalagot4893 3 жыл бұрын

It would be nicer if you can add a search option within the transaction history.

@testingtesting400 3 жыл бұрын

I'm getting a problem when using helper class with "TagHelper". It's doesn't render the page to string and return empty html when a tag helper is present in the returning view . Did any one else encounter the problem ???

@trungtranhuu3544 3 жыл бұрын

i have same problem

@haseenap3592 2 жыл бұрын

In this method how can I use already created table from sql database?

@muhammadraza5108 Жыл бұрын

This is very helpful tutorial, Only thing we are not able to convert _viewall into data table ajax call, after save record view is unable to reload, its stuck and once we refresh its appears please advise. Otherwise this is a complete tutorial to implement in real life project. Its a humble request.

@VeasnaMUCH 3 жыл бұрын

That is a very great tutorial. I have learn alot from yours, by the way if I would like to add pagination feature in _ViewAll.chtml partial view, how could we do?

@tunghinh5954 3 жыл бұрын

I also want to ask???????????

@abdalrhmanadel1589 2 жыл бұрын

Thank you for this great effort ^_^ , but how to append a file in jQueryAjaxPost function?

@tunghinh5954 3 жыл бұрын

Sir, I use @using X.PagedList.Mvc.Core; @using X.PagedList; for project, But it doesn't work, there is a solution for paging.

@mclk.98 3 жыл бұрын

Buum! :D

@anilkorutla4600 4 жыл бұрын

Validations are not working In AddOrEdit.cshtml

@engr.malikmuhammadmubashir6828 4 жыл бұрын

Sir your website is down. What is the problem? "This Website's IP Has Been Changed"

@qhayiyamgudlwa1428 2 жыл бұрын

Thank you very much sir. Tell me, how do i make sure that my datatable does not go away after adding a new record with the popup?

@CodAffection 2 жыл бұрын

thanks for the comment. didn't understand your question. could you give the time in the video you are referring to.

@gamezblock7717 4 жыл бұрын

Is it gud idea to code in jquery in 2020

@imyours4733 4 жыл бұрын

pls reply can we do the same in asp.net ?????? or can you make video on asp.net using popup with jquery.......... pls reply

@oguzierembethel1629 3 жыл бұрын

Nice tutorial, why is the source code different from the vidoe?

@abdullahquhtani4247 4 жыл бұрын

Do you work as freelancer? Plz reply.

@andresviera-ecuador4984 4 жыл бұрын

Hi, I'm learning at the moment so I had a problem with Delete. When I push the button I go to the controller but the value that I have come null and jump and don't save the element I deleted. Sorry I dont Know which is the problem.

@CodAffection 4 жыл бұрын

did you pass asp-route-id ? try with breakpoints in Delete post action method ?

@andresviera-ecuador4984 4 жыл бұрын

@@CodAffection I had to put @Html.Hidden("id", @item.transactionId)attribute up and that is the solution for me. Thanks

@dante85warrior41 2 жыл бұрын

buen video bro lo malo esq se me hace muy dificil seguirte y entenderte completamente ya que hablo español pero gracias por compartir el codigo al menos podre modificarlo el mio haber si me sale algo parecido

@CodAffection 2 жыл бұрын

Thanks for your wonderful feedback.

@salimbozkurt9617 4 жыл бұрын

How to implement client side (unobtrusive) validation or best fluent validaiton ? I tried but i couldn't run, please help me ?

@CodAffection 4 жыл бұрын

I've discussed the same in one of my previous tutorial here - kzfaq.info/get/bejne/eq-PjNOh27LLemw.html Let me know if there is anything left explain.

@salimbozkurt9617 4 жыл бұрын

@@CodAffection thanks. i solved my problem. i implemented fluent validation.