Retrieving Form Data and Reseting Form | Angular Forms | Angular 13+

We are almost done with template driven form in Angular. The only thing which is left to learn is how to retrieve the form data from a template driven form and how to reset a form.
That's what we are going to learn in this lecture. The NgForm object has a value property which contains all the form control as its property and the value entered for those form controls as the value for thos properties.
So, to read the value entered in the form controls of a template driven form, we need to access the value property on NgForm and on that we can access the required property values.
We can also reset the form controls to their initial value and state using reset() method of NgForm. Let's learn these concepts with an example in this lecture.
DOWNLOAD SOURCE CODE FOR THIS SECTION HERE: drive.google.com/file/d/1g0FB...

Пікірлер: 16

  • @WebDev-hd8rg
    @WebDev-hd8rg10 ай бұрын

    followed the course from the starting now almost completed it . i must say this is the literally the detailed course one can get . please update the course with newly angular 16.

  • @user-ik7yk7ee6b
    @user-ik7yk7ee6b8 ай бұрын

    sir can you help me regarding form submition you havae extracted value on same page can you give solution of extracting value on other page

  • @sachinvarghese2223
    @sachinvarghese2223 Жыл бұрын

    How to retrive data from those check boxes? In ngForm in the console -> i am able to get the checkbox name(like hobby1, hobby2 ,...) and its boolean value. But how can i show / retrive it ?

  • @sachinvarghese2223

    @sachinvarghese2223

    Жыл бұрын

    also is there any way that i can group the check box as array in the ngForm.value object?

  • @icursealot
    @icursealot Жыл бұрын

    Hi sir, if we click the set default values button it shows the values before we click submit button , how can we fix it ? and also when we setdefaultvalues we dont see any values in the input text boxes.

  • @JuanHeribertoPoquiomaEsquivel

    @JuanHeribertoPoquiomaEsquivel

    9 ай бұрын

    the problem is that the 'set default values' button is working as a 'submit' button, to solve this you need to specify the type of the 'set' button to: type="button" Set Default Values

  • @lakshithakanchana6155
    @lakshithakanchana6155 Жыл бұрын

    @procademy How to submit these?? Hobbies: Sports   Movies   Music

  • @ranjanadeore2957
    @ranjanadeore29572 жыл бұрын

    Thank you sir great video. There is issue is video title.

  • @procademy

    @procademy

    2 жыл бұрын

    What is the issue??

  • @nilanjanroychoudhury3094
    @nilanjanroychoudhury3094 Жыл бұрын

    why you skip value retrieve of check box.

  • @niloferakb5106
    @niloferakb51062 жыл бұрын

    How to get the selected text from the dropdown without using ngModel?

  • @procademy

    @procademy

    2 жыл бұрын

    You mean to say in plain Javascript...how you can get the form values??

  • @niloferakb5106

    @niloferakb5106

    2 жыл бұрын

    @@procademy nope, I am asking in angular

  • @tolearn8063
    @tolearn8063 Жыл бұрын

    Hello Sir, in the previous lecture- we used this.form.value.personDetails.firstname to set the values and it did not work. So we used this.form.setValue and set them there. But in this lecture we are using - this.form.value.personDetails.firstname is used to retreive the values. Could you please clarify ?

  • @procademy

    @procademy

    Жыл бұрын

    Yes, we can retrieve the value of firstName field from value object using this.value.personDetails.firstName. But we cannot set the property values of value object in that way. So to set the value, we have to use setValue method. Explaining the reason is not possible in comment, so i will create a lecture on the same. For now i will say, that we need to use setValue or patchValue because we want to persist the data even when the form is submitted.

  • @tolearn8063

    @tolearn8063

    Жыл бұрын

    Thank you Sir.