current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
stack overflow careers
Sign up ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free.
up vote 3 down vote favorite

I have a form (made using divs) that gets displayed when i select an option using dropdown menu. Am using ng-options for dropdown selections. My issue is I need to support IE8. I know IE8 does not support HTML5, and I can not use the 'required' tag. Thus, I am trying to use the "ng-required" option for form validation but it does not seem to work. I have looked at the jquery validator but I have many forms and each have different criteria. For example, I have a form which requires State/Country in input box which is required for a particular option. However, the same field is optional with the other option. To me, writing a validation for each is not the right approach since am trying to leverage angularjs. Please help. For example, one of the field is: 

<div style="float:left; width:290px;margin-bottom: 8px;">
  <div style="float:left; margin-right:8px; width: 113px; text-align: right;"> (*)Document Number: </div>
  <div style="float:left; margin-right:8px;width: 160px;">
  <input type="text" ng-model="customerData.docNmbr" placeholder=" Document Number" class="ng-pristine ng-valid" ng-required> </div>
</div>

and my submit button is: 

<button type="submit" id="submitButton" ng-disabled="userForm.$invalid" class="btn btn-primary">Register</button>
share|improve this question
    
Please define "does not seem to work" and show what you have tried so far... – Bun Aug 18 '14 at 19:16
    
What i meant is that "ng-required" does not work on IE8. the validation works fine on chrome/firefox. I have made submit button disabled till the form is valid but that does not work on IE8. It still submits. – newDevGeek Aug 18 '14 at 19:19
1  
I have to support IE8 at work, and I just went ahead and used require out of the box and it works just fine. Out of curiosity how are you testing it in IE8? If you're running your app locally IE8 renders with IE7 standards by default. – Matt Aug 18 '14 at 19:29
1  
@Matt It did help i guess. The fields do highlight now if it is not filled. I will test the form submission as well. Thanks – newDevGeek Aug 18 '14 at 20:06
1  
@Matt Thanks Matt. it worked. – newDevGeek Aug 20 '14 at 15:41

1 Answer 1

up vote 1 down vote

What you have to do is to use another library like modernizr. The main objective of this library is to standardize somehow old browser like IE8 with some of the new HTML5 Features. If you want to learn more about it this is a good article:

http://www.adobe.com/devnet/dreamweaver/articles/using-modernizr.html

share|improve this answer
    
Thanks for the answer Dalorzo. Alas, I can not use modernizr since the libraries/plugins i can use have already been restricted by the team. :( I tried to work around something similar to this ' <!--[if lte IE 8] > <script> document.createElement('ng-include'); document.createElement('ng-required'); ' but it does not work either. – newDevGeek Aug 18 '14 at 19:40
    
I can't fly because I am limited by gravity but if I have an issue and this has been solved by other team how I can put limits to that, just my thought :D – Dalorzo Aug 18 '14 at 19:42
    
:D I understand what you mean, but am helpless in this regard. – newDevGeek Aug 18 '14 at 19:44
    
I would vote-up for your suggestion but i can not because i dont have the reputation points. It needs 15! – newDevGeek Aug 18 '14 at 19:47
    
Modernizr doesn't actually polyfill HTML5 features into older browsers. It only provides feature detection, which you can use to determine whether or not polyfills are needed or to supply alternative script. – John Bledsoe Aug 18 '14 at 19:52

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.