{"id":10489,"date":"2023-04-07T17:56:46","date_gmt":"2023-04-07T12:26:46","guid":{"rendered":"https:\/\/selfimagination.in\/tips\/?p=10489"},"modified":"2023-04-07T17:56:50","modified_gmt":"2023-04-07T12:26:50","slug":"bootstrap-invoice-validation","status":"publish","type":"post","link":"https:\/\/selfimagination.in\/tips\/bootstrap-invoice-validation\/","title":{"rendered":"Bootstrap Invoice Validation: How to Validate Invoices using Bootstrap"},"content":{"rendered":"\n<p>Bootstrap Invoice Validation : Learn how to validate invoices using Bootstrap in this step-by-step guide. With Bootstrap, you can easily create an invoice validation form that checks for accuracy and completeness, ensuring that your invoices are error-free and professional-looking.<\/p>\n\n\n\n<p>\u0915\u094d\u092f\u093e \u0906\u092a \u0924\u094d\u0930\u0941\u091f\u093f\u092f\u094b\u0902 \u0914\u0930 \u0905\u0936\u0941\u0926\u094d\u0927\u093f\u092f\u094b\u0902 \u0915\u0947 \u0932\u093f\u090f \u092e\u0948\u0928\u094d\u092f\u0941\u0905\u0932 \u0930\u0942\u092a \u0938\u0947 \u0905\u092a\u0928\u0947 Invoice \u0915\u0940 Checking \u0915\u0930\u0924\u0947-\u0915\u0930\u0924\u0947 \u0925\u0915 \u0917\u090f \u0939\u0948\u0902? Bootstrap \u0915\u0947 \u0938\u093e\u0925, \u0906\u092a \u0907\u0938 Process \u0915\u094b Automate \u0915\u0930 \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u0914\u0930 \u0938\u092e\u092f \u092c\u091a\u093e \u0938\u0915\u0924\u0947 \u0939\u0948\u0902\u0964 \u0907\u0938 Article \u092e\u0947\u0902, \u0939\u092e \u0906\u092a\u0915\u094b Bootstrap \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930\u0915\u0947 Invoice \u0915\u094b Validate \u0915\u0930\u0928\u0947 \u0915\u0947 Steps \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947\u0902 \u092c\u0924\u093e\u090f\u0902\u0917\u0947, \u091c\u094b \u0906\u092a\u0915\u0947 Invoice \u0915\u094b \u091c\u0932\u094d\u0926\u0940 \u0914\u0930 \u0906\u0938\u093e\u0928\u0940 \u0938\u0947 Validation \u0915\u0930\u0928\u0947 \u092e\u0947\u0902 \u0906\u092a\u0915\u0940 \u092c\u0939\u0941\u0924 \u0938\u0939\u093e\u092f\u0924\u093e \u0915\u0930\u0947\u0917\u093e\u0964<\/p>\n\n\n\n<div class=\"wp-block-rank-math-toc-block\" id=\"rank-math-toc\"><h2>Table of Contents<\/h2><nav><ul><li><a href=\"#1-what-is-bootstrap\">1. What is Bootstrap?<\/a><\/li><li><a href=\"#2-why-use-bootstrap-for-invoice-validation\">2. Why use Bootstrap for Invoice Validation?<\/a><\/li><li><a href=\"#3-creating-an-invoice-validation-form-with-bootstrap\">3. Creating an Invoice Validation Form with Bootstrap<\/a><ul><li><a href=\"#3-1-add-bootstrap-form-validation-class\">3.1 Add Bootstrap form validation Class <\/a><\/li><li><a href=\"#3-2-add-validation\">3.2 Add Validation <\/a><\/li><\/ul><\/li><li><a href=\"#4-java-script-function-for-bootstrap-validation\">4. JavaScript Function for Bootstrap Validation <\/a><\/li><li><a href=\"#5-testing-the-bootstrap-invoice-validation-form\">5. Testing the Bootstrap Invoice Validation form<\/a><\/li><li><a href=\"#\u0939\u092e\u093e\u0930\u0947-\u0905\u0928\u094d\u092f-\u0906\u0930\u094d\u091f\u093f\u0915\u0932\">\u0939\u092e\u093e\u0930\u0947 \u0905\u0928\u094d\u092f \u0906\u0930\u094d\u091f\u093f\u0915\u0932<\/a><\/li><\/ul><\/nav><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"1-what-is-bootstrap\">1. What is Bootstrap?<\/h2>\n\n\n\n<p>Bootstrap \u090f\u0915 Open Source Framework \u0939\u0948,  \u092f\u0939 \u090f\u0915 Front-end Framework \u0939\u0948 \u091c\u094b Web Development \u0915\u0947 \u0932\u093f\u090f \u0909\u092a\u092f\u094b\u0917 \u0915\u093f\u092f\u093e \u091c\u093e\u0924\u093e \u0939\u0948\u0964 Bootstrap \u092e\u0947\u0902 \u092c\u0939\u0941\u0924 \u0938\u0947 Pre-built in  Component \u0914\u0930 Style Sheets \u0939\u094b\u0924\u0947 \u0939\u0948\u0902 \u091c\u094b Website Design \u0915\u094b \u0938\u0930\u0932 \u092c\u0928\u093e\u0924\u0947 \u0939\u0948\u0902\u0964 \u0938\u093e\u0925 \u0935\u0947\u092c\u0938\u093e\u0907\u091f \u0915\u094b Responsive Design \u092d\u0940 \u092c\u0939\u0941\u0924 \u0905\u091a\u094d\u091b\u0947 \u0938\u0947 \u0939\u094b\u0924\u0940 \u0939\u0948\u0902 \u0964<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"2-why-use-bootstrap-for-invoice-validation\">2. Why use Bootstrap for Invoice Validation?<\/h2>\n\n\n\n<p>Bootstrap \u0938\u0947 \u092c\u0928\u093e\u090f \u0917\u090f Number, Text \u0914\u0930 Form Component \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0906\u092a \u090f\u0915 Web Page \u092f\u093e HTML Invoice \u092c\u0928\u093e \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u091c\u094b \u0907\u0938 \u092c\u0928\u093e\u0908 \u0917\u0908 Invoice \u0915\u0947 Validation \u0915\u0947 \u0932\u093f\u090f \u0906\u0938\u093e\u0928\u0940 \u0938\u0947 \u0909\u092a\u092f\u094b\u0917 \u0915\u093f\u092f\u093e \u091c\u093e \u0938\u0915\u0924\u093e \u0939\u0948\u0964 Bootstrap Component \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0906\u092a\u0915\u094b \u092c\u0939\u0941\u0924 \u091c\u094d\u092f\u093e\u0926\u093e \u0915\u094b\u0921 \u0932\u093f\u0916\u0928\u0947 \u0915\u0940 \u0906\u0935\u0936\u094d\u092f\u0915\u0924\u093e \u0928\u0939\u0940\u0902 \u0939\u094b\u0924\u0940 \u0939\u0948\u0964<\/p>\n\n\n\n<p>Bootstrap \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930\u0928\u0947 \u0938\u0947 \u0906\u092a \u090f\u0915 Responsive Invoice Validation Form \u092c\u0928\u093e \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u091c\u094b \u0905\u0932\u0917-\u0905\u0932\u0917 \u0938\u093e\u0907\u091c \u0914\u0930 \u0938\u094d\u0915\u094d\u0930\u0940\u0928 \u0930\u093f\u091c\u093c\u0949\u0932\u094d\u092f\u0942\u0936\u0928 \u092a\u0930 \u0938\u0939\u0940 \u0924\u0930\u0940\u0915\u0947 \u0938\u0947 \u0926\u093f\u0916\u0924\u093e \u0939\u0948\u0964 \u0907\u0938\u0915\u0947 \u0905\u0932\u093e\u0935\u093e, Bootstrap \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930\u0915\u0947 \u0906\u092a \u092b\u0949\u0930\u094d\u092e \u092b\u0940\u0932\u094d\u0921\u094b\u0902 \u0915\u0947 \u0932\u093f\u090f Validation Logic \u092d\u0940 \u091c\u094b\u0921\u093c \u0938\u0915\u0924\u0947 \u0939\u0948\u0902\u0964 \u0907\u0938\u0938\u0947 \u0906\u092a Invoice \u0915\u0947 Column \u092e\u0947\u0902 \u0917\u0932\u0924\u093f\u092f\u094b\u0902 \u0915\u094b \u091a\u0947\u0915 \u0915\u0930 \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u0964 <\/p>\n\n\n\n<p><strong>Related Video :<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Bootstrap Invoice Validation Tutorial - Validate Multiple Items | Invoice Management\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/ILj7HUlhefI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"3-creating-an-invoice-validation-form-with-bootstrap\">3. Creating an Invoice Validation Form with Bootstrap<\/h2>\n\n\n\n<p>\u0939\u092e\u0928\u0947 \u0939\u092e\u093e\u0930\u0947 Previous Blog \u092e\u0947 Bootstrap Invoice \u092c\u0928\u093e\u0928\u093e \u092c\u0924\u093e\u0908 \u0925\u0940, \u0909\u0938\u0915\u0940 \u0915\u094b \u0906\u0917\u0947 Implement \u0915\u0930\u0924\u0947 \u0939\u0941\u0935\u0947 \u0939\u092e \u0909\u0938\u0940 Invoice \u092e\u0947 Bootstrap validation \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0930\u0939\u0947 \u0939\u0948\u0902\u0964 <a href=\"https:\/\/selfimagination.in\/tips\/complete-invoice-with-calculation\/\">Complete Bootstrap Invoice \u0915\u0947 \u0932\u093f\u090f \u092f\u0939 \u092a\u0922\u0947<\/a> <\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"3-1-add-bootstrap-form-validation-class\">3.1 Add Bootstrap form validation Class <\/h3>\n\n\n\n<p>\u0938\u092c\u0938\u0947 \u092a\u0939\u0932\u0947 \u0906\u092a\u0928\u0947 \u091c\u094b \u092d\u0940 Invoice \u092c\u0928\u093e\u0908 \u0939\u094b \u0909\u0938\u092e\u0947 Form Tag \u092a\u0930 need-validation class \u0915\u094b \u091c\u094b\u095c\u0947 , \u0938\u093e\u0925 \u0939\u0940 \u092e\u0947 \u090f\u0915 Attribute novalidate \u092d\u0940 \u0932\u093f\u0916\u0947, \u091c\u0948\u0938\u093e \u0915\u0940 \u0928\u093f\u092e\u094d\u0928 Example \u092e\u0947 \u092c\u0924\u093e\u092f\u093e \u0939\u0948\u0902  \u0964 \u0907\u0938\u0915\u0947 \u0905\u0932\u093e\u0935\u093e \u091c\u094b \u092d\u0940 action, method \u0906\u0926\u093f \u091c\u0948\u0938\u0947 \u0932\u093f\u0916\u0947 \u0939\u0948\u0902 \u0935\u0948\u0938\u0947 \u0939\u0940 \u0932\u093f\u0916\u0947 \u0930\u0939\u0928\u0947 \u0926\u0947\u0935\u0947 \u0964 <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup\"> &lt;form method=\"POST\" class=\"needs-validation\" novalidate     ....&gt;<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"3-2-add-validation\">3.2 Add Validation <\/h3>\n\n\n\n<p>\u0907\u0938\u092e\u0947 \u092c\u093e\u0926 \u0906\u092a\u0915\u094b \u091c\u093f\u0938 \u092d\u0940 Field \u0915\u094b Required \u0915\u0930\u0928\u093e \u0939\u0948\u0902 \u0909\u0938 \u092a\u0930 \u0906\u092a \u090f\u0915 Attribute required \u0932\u0917\u093e \u0926\u0947\u0935\u0947 \u0964 <\/p>\n\n\n\n<p>\u092f\u0926\u093f \u0906\u092a \u091a\u093e\u0939\u0924\u0947 \u0939\u0948\u0902 \u0915\u0940 \u0915\u092e \u0938\u0947 \u0915\u092e \u0907\u0938 Filed \u092a\u0930 4 character \u091f\u093e\u0907\u092a \u0939\u094b \u0909\u0938\u0915\u0947 \u092c\u093e\u0926 \u0939\u0940 Form submit \u0939\u094b \u0924\u094b \u0906\u092a minlength \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u0964 <\/p>\n\n\n\n<p><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"markup\" class=\"language-markup\">&lt;input type=\"text\" class=\"form-control\" placeholder=\"Customer\" name=\"cust_nm\" required minlength=\"4\"  &gt;\n&lt;div class=\"invalid-feedback\"&gt;Please Enter Customer Name &lt;\/div&gt;\n\n&lt;input type=\"text\" class=\"form-control\" placeholder=\"Inv. No\"  id=\"inv_no\" name=\"inv_no\" autocomplete=\"off\" required &gt;\n&lt;div class=\"valid-feedback\"&gt;Invoice No. is OK&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<p>\u0909\u092a\u0930\u094b\u0915\u094d\u0924 Example \u092e\u0947 \u0939\u092e\u0928\u0947 Attribute \u0914\u0930 Bootstrap Class \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u093f\u092f\u093e \u0939\u0948\u0902 \u0906\u0907\u090f \u0905\u092c \u0907\u0928 \u0938\u092d\u0940 \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947 \u0906\u092a\u0915\u094b \u0938\u092e\u091d\u093e \u0926\u0947\u0924\u0947 \u0939\u0948\u0902  \u0964 <\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Required :<\/strong> \u091c\u092c \u092d\u0940 \u0906\u092a\u0915\u0947 \u0926\u094d\u0935\u093e\u0930\u093e Required attribute \u0932\u0917\u093e\u092f\u093e \u091c\u093e\u0924\u093e \u0939\u0948\u0902, \u0924\u092c \u091c\u092c \u0924\u0915 \u090f\u0915 Filed \u092e\u0947 \u0935\u0948\u0932\u094d\u092f\u0942 Enter \u0928\u0939\u0940\u0902 \u0939\u094b\u0917\u0940 \u0906\u092a\u0915\u094b Form Submit \u0928\u0939\u0940\u0902 \u0915\u0930\u0928\u0947 \u0926\u0947\u0917\u093e\u0964 \u091c\u092c Value \u0932\u093f\u0916 \u0926\u0940 \u091c\u093e\u090f\u0917\u0940 \u0924\u092c \u0906\u092a Form \u0915\u094b Submit \u0915\u0930 \u092a\u093e\u090f\u0902\u0917\u0947\u0964 <\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"233\" height=\"43\" src=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image.png?resize=233%2C43&#038;ssl=1\" alt=\"Bootstrap Validation\" class=\"wp-image-10817\" srcset=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image.png?w=233&amp;ssl=1 233w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image.png?resize=150%2C28&amp;ssl=1 150w\" sizes=\"auto, (max-width: 233px) 100vw, 233px\" \/><\/figure>\n<\/div>\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Minlength :<\/strong> \u0907\u0938 attribute \u0915\u0947 \u092c\u093e\u0926 \u0906\u092a\u0915\u094b number of character \u0926\u0947\u0928\u093e \u0939\u094b\u0924\u0947 \u0939\u0948\u0902\u0964 \u0906\u092a \u091c\u094b \u092d\u0940 \u0935\u0948\u0932\u094d\u092f\u0942 \u0907\u0938\u092e\u0947 \u0926\u0947\u0902\u0917\u0947 \u0909\u0938\u0938\u0947 \u0915\u092e character \u091f\u093e\u0907\u092a \u0939\u094b\u0928\u0947 \u092a\u0930 Form Submit \u0928\u0939\u0940\u0902 \u0939\u094b\u0917\u093e\u0964 <\/li>\n\n\n\n<li><strong>Invalid-feedback : <\/strong>\u092f\u0926\u093f \u0906\u092a \u091a\u093e\u0939\u0924\u0947 \u0939\u0948\u0902 \u0915\u0940 \u091c\u092c Validation \u091a\u0947\u0915 \u0939\u094b \u0914\u0930 Input \u092e\u0947 \u0915\u094b\u0908 \u0917\u0932\u0924\u0940 \u0939\u094b \u0924\u094b \u0909\u0938\u0947 \u0915\u094b \u090f\u0915 message red colour \u092e\u0947 Field \u0915\u0947 \u0928\u0940\u091a\u0947 \u0939\u0940 \u0926\u093f\u0916\u093e\u0908 \u0926\u0947 \u0924\u094b \u0906\u092a Bootstrap Invalid-feedback Class \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0938\u0915\u0924\u0947 \u0939\u0948\u0902\u0964 \u092f\u0939 \u091c\u092c \u0939\u0940 \u0926\u093f\u0916\u093e\u0908 \u0926\u0947\u0917\u093e \u091c\u092c input \u092e\u0947 validation success \u0928\u0939\u0940\u0902 \u0939\u094b\u0917\u093e \u0964 <\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"59\" src=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-1.png?resize=640%2C59&#038;ssl=1\" alt=\"Bootstrap Customer Validation with invalid-feedback\" class=\"wp-image-10818\" srcset=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-1.png?w=678&amp;ssl=1 678w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-1.png?resize=300%2C27&amp;ssl=1 300w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-1.png?resize=150%2C14&amp;ssl=1 150w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n<\/div>\n\n\n<ul class=\"wp-block-list\">\n<li><strong>valid-feedback : <\/strong>\u092f\u0926\u093f \u0906\u092a \u091a\u093e\u0939\u0924\u0947 \u0939\u0948\u0902 \u0915\u0940 \u091c\u092c Validation Success \u0939\u094b \u0924\u092c \u092d\u0940 User  \u0915\u094b Message \u0926\u093f\u0916\u093e\u0908 \u0926\u0947 \u0924\u094b \u0906\u092a Bootstrap Valid-feedback Class \u0915\u093e \u0909\u092a\u092f\u094b\u0917 \u0915\u0930 \u0938\u0915\u0924\u0947 \u0939\u0948\u0902 \u0964 <\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"333\" height=\"62\" src=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-2.png?resize=333%2C62&#038;ssl=1\" alt=\"Bootstrap Invoice Validation with valid-feedback\" class=\"wp-image-10819\" srcset=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-2.png?w=333&amp;ssl=1 333w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-2.png?resize=300%2C56&amp;ssl=1 300w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-2.png?resize=150%2C28&amp;ssl=1 150w\" sizes=\"auto, (max-width: 333px) 100vw, 333px\" \/><\/figure>\n<\/div>\n\n\n<p>\u0909\u092a\u0930\u094b\u0915\u094d\u0924 \u0915\u0947 \u0905\u0932\u093e\u0935\u093e \u0914\u0930 \u092d\u0940 \u092c\u0939\u0941\u0924 \u0938\u0947 Validation \u0939\u0948\u0902 \u0939\u092e\u0928\u0947 \u0907\u0938\u092e\u0947 \u0915\u0947\u0935\u0932 \u0935\u0939\u0940 Validation \u0932\u093f\u090f \u0939\u0948\u0902 \u091c\u093f\u0928\u0915\u093e \u0939\u092e\u0928\u0947 \u0907\u0938 Invoice \u092e\u0947 \u0909\u092a\u092f\u094b\u0917 \u0915\u093f\u092f\u093e \u0939\u0948 \u0964 <\/p>\n\n\n\n<p><a href=\"https:\/\/www.youtube.com\/playlist?list=PLCWrLhzYkkf5earV5KmsY1mZBW1k__zQf\" target=\"_blank\" rel=\"noreferrer noopener\">Learn Google Apps Script Playlist Invoice Example<\/a><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"4-java-script-function-for-bootstrap-validation\">4. JavaScript Function for Bootstrap Validation <\/h2>\n\n\n\n<p>\u092f\u0939 Function \u091c\u092c Document Load \u0939\u094b\u0917\u093e \u091c\u092c Call \u0939\u094b\u0928\u093e \u091a\u093e\u0939\u093f\u090f , \u0906\u092a \u0907\u0938\u0947 As it is \u0905\u092a\u0928\u0947 HTML page \u0915\u0947 JavaScript page \u092a\u0930 \u0932\u0917\u093e\u090f  \u0964 \u092f\u0939 Call \u0939\u094b\u0924\u0947 \u0939\u0948\u0902 \u0939\u0940 \u0906\u092a\u0928\u0947 \u091c\u0940\u0924\u0928\u0947 \u092d\u0940 invalid \u0914\u0930 valid Feedback \u0932\u093f\u0916\u0947 \u0939\u0948\u0902 \u0938\u092d\u0940 \u0938\u094d\u0915\u094d\u0930\u0940\u0928 \u092a\u0930 \u0926\u093f\u0916\u093e\u0908 \u0926\u0947\u0902\u0917\u0947\u0964 <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">function FormValidation()\n{\n    \/\/ Example starter JavaScript for disabling form submissions if there are invalid fields\n(function () {\n    'use strict'\n  \n    \/\/ Fetch all the forms we want to apply custom Bootstrap validation styles to\n    var forms = document.querySelectorAll('.needs-validation')\n  \n    \/\/ Loop over them and prevent submission\n    Array.prototype.slice.call(forms)\n      .forEach(function (form) {\n        form.addEventListener('submit', function (event) {\n          if (!form.checkValidity()) {\n            event.preventDefault()\n            event.stopPropagation()\n          }\n  \n          form.classList.add('was-validated')\n        }, false)\n      })\n  })()\n}<\/code><\/pre>\n\n\n\n<p>\u0909\u092a\u0930\u094b\u0915\u094d\u0924 Function \u0915\u094b \u0939\u092e\u0928\u0947 \u0905\u092c Page Load \u092f\u093e Document Ready function \u092a\u0930 call \u0915\u0930\u0928\u093e \u0939\u0948\u0902 \u0964 <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">$(document).ready(function () {\n      FormValidation();\n});<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"5-testing-the-bootstrap-invoice-validation-form\">5. Testing the Bootstrap Invoice Validation form<\/h2>\n\n\n\n<p>\u0939\u092e\u0928\u0947 Customer Name \u0914\u0930 Invoice Number  \u0935\u093e\u0932\u0947 Columns \u092a\u0930 Validation \u0932\u0917\u093e\u092f\u093e \u0925\u093e \u0907\u0938\u0932\u093f\u090f \u091c\u0948\u0938\u0947 \u0939\u0940 \u0939\u092e\u0928\u0947 Submit \u0915\u093f\u092f\u093e \u0924\u094b Customer \u092e\u0947 Value Enter \u0928\u0939\u0940\u0902 \u0939\u094b\u0928\u0947 \u092a\u0930 \u0939\u092e\u0947 invalid-feedback \u091c\u094b \u0926\u0940 Red Colour \u092e\u0947 \u0926\u093f\u0916\u093e\u0908 \u0926\u0947\u0902\u0917\u0947 \u0932\u0917\u093e, \u0914\u0930 invoice number \u092a\u0930 Value \u0939\u094b\u0928\u0947 \u092a\u0930 \u0939\u092e\u0947 Valid-feedback \u0926\u093f\u0916\u093e\u0908 \u0926\u0947\u0902\u0917\u0947 \u0932\u0917\u093e, \u0905\u0928\u094d\u092f \u091c\u093f\u0928 Filed \u092f\u093e Columns \u092a\u0930 \u0939\u092e\u0928\u0947 Validation \u0928\u0939\u0940\u0902 \u0932\u0917\u093e\u090f \u0909\u0928\u094d\u0939\u0947 valid \u092e\u093e\u0928\u0915\u0930 Green Colour \u0938\u0947 \u0926\u093f\u0916\u093e\u092f\u093e \u0917\u092f\u093e \u0939\u0948\u0902 \u0964 <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"110\" src=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-3.png?resize=640%2C110&#038;ssl=1\" alt=\"\" class=\"wp-image-10823\" srcset=\"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-3.png?w=1017&amp;ssl=1 1017w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-3.png?resize=300%2C52&amp;ssl=1 300w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-3.png?resize=768%2C132&amp;ssl=1 768w, https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/image-3.png?resize=150%2C26&amp;ssl=1 150w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p>\u0907\u0938 Article \u092e\u0947 \u0939\u092e\u0928\u0947 \u0915\u093f\u0938\u0940 \u092d\u0940 Bootstrap Invoice Validation \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947 \u092c\u0924\u093e\u092f\u093e \u0939\u0948\u0902 \u0906\u0936\u093e \u0939\u0948\u0902 \u0915\u0940 \u0906\u092a\u0915\u094b \u092f\u0939 Article \u092c\u0939\u0941\u0924 \u0905\u091a\u094d\u091b\u0947 \u0938\u0947 \u0938\u092e\u091d \u092e\u0947 \u0906 \u0917\u092f\u093e \u0939\u094b\u0917\u093e\u0964<\/p>\n\n\n\n<p>\u0906\u092a\u0915\u094b \u092f\u0939 Article (Bootstrap Invoice Validation) \u0915\u0948\u0938\u093e \u0932\u0917\u093e ? \u092c\u0924\u093e\u0928\u093e \u0928 \u092d\u0942\u0932\u0947, \u092e\u093f\u0932\u0924\u0947 \u0939\u0948\u0902 Next Article \u092e\u0947 Thanks for Reading \u0964<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"\u0939\u092e\u093e\u0930\u0947-\u0905\u0928\u094d\u092f-\u0906\u0930\u094d\u091f\u093f\u0915\u0932\"><strong>\u0939\u092e\u093e\u0930\u0947 \u0905\u0928\u094d\u092f \u0906\u0930\u094d\u091f\u093f\u0915\u0932<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/selfimagination.in\/tips\/mysql-function\/\">MySQL Function<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/mysql-stored-procedure\/\">MySQL Stored Procedure<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/get-post-method\/\">PHP Get \/Post Method \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947\u0902 \u091c\u093e\u0928\u0947<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/php-math-function\/\">PHP Math Function \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947\u0902 \u091c\u093e\u0928\u0947<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/learn-cpp-from-c\/\">C \u0938\u0947 C ++ \u0938\u0940\u0916\u0947 \u0938\u0930\u0932 \u0936\u092c\u094d\u0926\u094b\u0902 \u092e\u0947\u0902<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/php-variables\/\">PHP Variable \u0915\u0947 \u092c\u093e\u0930\u0947 \u092e\u0947\u0902 \u091c\u093e\u0928\u0947<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/arduino-control-structure\/\">Arduino Control Structure<\/a>&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/c-union\/\">Union in C<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/c-pointer\/\">Declaration of Pointer in C<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/search-jquery\/\">jQuery Search Filter<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/mysql-table-create-alter-drop\/\">MySQL Create Table | Alter Table | Drop Table<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/api-using-node-react-express-mysql\/\">API Using NODE REACT EXPRESS MYSQL SEQUELIZE (For Backend OR Server Side)<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/selfimagination.in\/tips\/cpanel\/\">CPANEL In Hindi<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Bootstrap Invoice Validation : Learn how to validate invoices using Bootstrap in this step-by-step guide. With Bootstrap, you can easily create an invoice validation form that checks for accuracy and completeness, ensuring that your invoices are error-free and professional-looking. \u0915\u094d\u092f\u093e \u0906\u092a \u0924\u094d\u0930\u0941\u091f\u093f\u092f\u094b\u0902 \u0914\u0930 \u0905\u0936\u0941\u0926\u094d\u0927\u093f\u092f\u094b\u0902 \u0915\u0947 \u0932\u093f\u090f \u092e\u0948\u0928\u094d\u092f\u0941\u0905\u0932 \u0930\u0942\u092a \u0938\u0947 \u0905\u092a\u0928\u0947 Invoice \u0915\u0940 Checking \u0915\u0930\u0924\u0947-\u0915\u0930\u0924\u0947 \u0925\u0915 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":10816,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[14],"tags":[],"class_list":["post-10489","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bootstrap"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/i0.wp.com\/selfimagination.in\/tips\/wp-content\/uploads\/2023\/04\/bootstrap-invoice-validation.jpg?fit=1280%2C720&ssl=1","_links":{"self":[{"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/posts\/10489","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/comments?post=10489"}],"version-history":[{"count":69,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/posts\/10489\/revisions"}],"predecessor-version":[{"id":10827,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/posts\/10489\/revisions\/10827"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/media\/10816"}],"wp:attachment":[{"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/media?parent=10489"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/categories?post=10489"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/selfimagination.in\/tips\/wp-json\/wp\/v2\/tags?post=10489"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}