{"action":"created","issue":{"url":"https://api.github.com/repos/google/material-design-lite/issues/1502","repository_url":"https://api.github.com/repos/google/material-design-lite","labels_url":"https://api.github.com/repos/google/material-design-lite/issues/1502/labels{/name}","comments_url":"https://api.github.com/repos/google/material-design-lite/issues/1502/comments","events_url":"https://api.github.com/repos/google/material-design-lite/issues/1502/events","html_url":"https://github.com/google/material-design-lite/issues/1502","id":103886485,"number":1502,"title":"Required input fields should not be marked invalid (red) automatically.","user":{"login":"rzr999","id":6120806,"avatar_url":"https://avatars.githubusercontent.com/u/6120806?v=3","gravatar_id":"","url":"https://api.github.com/users/rzr999","html_url":"https://github.com/rzr999","followers_url":"https://api.github.com/users/rzr999/followers","following_url":"https://api.github.com/users/rzr999/following{/other_user}","gists_url":"https://api.github.com/users/rzr999/gists{/gist_id}","starred_url":"https://api.github.com/users/rzr999/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rzr999/subscriptions","organizations_url":"https://api.github.com/users/rzr999/orgs","repos_url":"https://api.github.com/users/rzr999/repos","events_url":"https://api.github.com/users/rzr999/events{/privacy}","received_events_url":"https://api.github.com/users/rzr999/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":10,"created_at":"2015-08-29T22:20:26Z","updated_at":"2016-02-09T23:04:46Z","closed_at":null,"body":"If an input field is required then it will automatically be marked as invalid. This should not happen on a page load, but once a user interacts with it. See solution below.\r\n\r\n```JS\r\n/**\r\n   * Check the validity state and update field accordingly.\r\n   *\r\n   * @public\r\n   */\r\nMaterialTextfield.prototype.checkValidity = function () {\r\n    if (this.input_.validity.valid) {\r\n        this.element_.classList.remove(this.CssClasses_.IS_INVALID);\r\n    } else {\r\n        if (this.element_.getElementsByTagName('input')[0].value.length > 0) {\r\n              this.element_.classList.add(this.CssClasses_.IS_INVALID);\r\n        }\r\n    }\r\n};\r\n```"},"comment":{"url":"https://api.github.com/repos/google/material-design-lite/issues/comments/182126541","html_url":"https://github.com/google/material-design-lite/issues/1502#issuecomment-182126541","issue_url":"https://api.github.com/repos/google/material-design-lite/issues/1502","id":182126541,"user":{"login":"dgrubelic","id":1304876,"avatar_url":"https://avatars.githubusercontent.com/u/1304876?v=3","gravatar_id":"","url":"https://api.github.com/users/dgrubelic","html_url":"https://github.com/dgrubelic","followers_url":"https://api.github.com/users/dgrubelic/followers","following_url":"https://api.github.com/users/dgrubelic/following{/other_user}","gists_url":"https://api.github.com/users/dgrubelic/gists{/gist_id}","starred_url":"https://api.github.com/users/dgrubelic/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dgrubelic/subscriptions","organizations_url":"https://api.github.com/users/dgrubelic/orgs","repos_url":"https://api.github.com/users/dgrubelic/repos","events_url":"https://api.github.com/users/dgrubelic/events{/privacy}","received_events_url":"https://api.github.com/users/dgrubelic/received_events","type":"User","site_admin":false},"created_at":"2016-02-09T23:04:46Z","updated_at":"2016-02-09T23:04:46Z","body":"Totally agree, if someone should put `is-invalid` class that should display error state, but in case where there is no error class and input is empty (we can consider this as a clean input by default) then we don't need error state. \r\n\r\nFor now, i solved this problem by hacking the css, but this is not long-term solution for me.\r\n\r\nI'll see what i can do about this one."}}