Full Stack Developer – Part 6 – JavaScript Validation

Git Code 1

For the final post in this series, I are going to add JavaScript. When it comes to web applications, JavaScript traditionally has been used for client side validation. Other uses can include animations and/or other user interactions that did not require a call back to the server.

While an animation is appealing, I think it is beyond the scope of this series. So, I am going to only validate the form for the create/update functionality.

There are generally two ways to handle JavaScript. Place it inline with the HyperText Markup Language (HTML) code or place it in a seperate file and import it. If you review the .NET 4.6 The Globe In My BucketList Application (TGIMBA), you can see multiple examples of JQuery JavaScript code in seperate files, imported into the HTML code and used.

With this web application, I will place the JavaScript inline on the Details.cshtml view. The method validateForm() is added in a script tag and then called using the onclick event handler on the submit button.
1

The function gets a reference to each text box and then tests to make sure each one has a value.
2

When submitting form, the user now will get an alert if one of the textboxes does not have a value in it.
3

4

That concludes this series.  I hope I was successful in showing some of the basics a .NET Full Stack Software Engineer needs.  More specifically, from the Database to the web client.

Stay tuned!

References

  1. https://stackoverflow.com/questions/16969262/how-to-set-id-to-html-textbox-item-on-mvc
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s