{"action":"created","issue":{"url":"https://api.github.com/repos/Dogfalo/materialize/issues/4016","repository_url":"https://api.github.com/repos/Dogfalo/materialize","labels_url":"https://api.github.com/repos/Dogfalo/materialize/issues/4016/labels{/name}","comments_url":"https://api.github.com/repos/Dogfalo/materialize/issues/4016/comments","events_url":"https://api.github.com/repos/Dogfalo/materialize/issues/4016/events","html_url":"https://github.com/Dogfalo/materialize/issues/4016","id":196600804,"number":4016,"title":"Unable to access file field in materializecss framework","user":{"login":"greeninho","id":8948059,"avatar_url":"https://avatars.githubusercontent.com/u/8948059?v=3","gravatar_id":"","url":"https://api.github.com/users/greeninho","html_url":"https://github.com/greeninho","followers_url":"https://api.github.com/users/greeninho/followers","following_url":"https://api.github.com/users/greeninho/following{/other_user}","gists_url":"https://api.github.com/users/greeninho/gists{/gist_id}","starred_url":"https://api.github.com/users/greeninho/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/greeninho/subscriptions","organizations_url":"https://api.github.com/users/greeninho/orgs","repos_url":"https://api.github.com/users/greeninho/repos","events_url":"https://api.github.com/users/greeninho/events{/privacy}","received_events_url":"https://api.github.com/users/greeninho/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2016-12-20T07:02:23Z","updated_at":"2016-12-20T07:17:06Z","closed_at":null,"body":"I just started playing around with materializecss framework. After going through the form page. I decided to try a simple example shown below:\r\n\r\n    <!DOCTYPE html>\r\n    <html lang=\"en\">\r\n    <head>\r\n      <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"/>\r\n      <meta name=\"viewport\" content=\"width=device-width, initial-scale=1,     maximum-scale=1.0, user-scalable=no\"/>\r\n      <link rel=\"shortcut icon\" href=\"images/icon.png\" type=\"image/png\">\r\n      <title>form example</title>\r\n\r\n      <!-- CSS  -->\r\n      <link href=\"https://fonts.googleapis.com/icon?family=Material+Icons\"     rel=\"stylesheet\">\r\n      <link href=\"css/materialize.css\" type=\"text/css\" rel=\"stylesheet\" media=\"screen,projection\"/>\r\n      <link href=\"css/style.css\" type=\"text/css\" rel=\"stylesheet\" media=\"screen,projection\"/>\r\n    </head>\r\n    <body>\r\n    <div class=\"navbar-fixed\">\r\n      <nav class=\"blue darken-4\" role=\"navigation\">\r\n\t    <ul id=\"slide-out\" class=\"side-nav\">\r\n\t    <li><div class=\"userView\">\r\n\t\t\t    <div class=\"background blue darken-3\">\r\n\t\t\t\t    <!--<img src=\"images/background3.jpg\">-->\r\n\t\t\t    </div>\r\n\t\t    </div>\r\n\t    </li>\r\n        </ul>\r\n        <a href=\"#\" data-activates=\"slide-out\" class=\"button-collapse show-on-large\"><i class=\"material-icons\">menu</i></a>\r\n        <div class=\"nav-wrapper\">\r\n        <a id=\"logo-container\" href=\"index.php\" class=\"brand-logo\"><img src=\"images/icon.png\">Form</a>\r\n        <ul class=\"right hide-on-med-and-down\">\r\n\t\t<li><div class=\"right\"><a class=\"waves-effect waves-light btn  red modal-trigger tooltipped\" data-position=\"bottom\" data-delay=\"50\" data-tooltip=\"Click to login or register \" href=\"login.php\" >Login</a></div></li>\t\r\n\t</ul>\r\n\t\r\n    </div>\r\n      </nav>\r\n    </div>\r\n    \r\n    <form id=\"uploadimage\" class=\"col s12\" method=\"post\" action=\"\" enctype=\"multipart/form-data\"  >\r\n\t\t\t<div class=\"form-container\">\r\n\t\t\t\t<div class=\"row\">\r\n\t\t\t\t\t<div class=\"file-field input-field col s12\">\r\n\t\t\t\t\t\t<div class=\"btn waves-effect waves-light blue darken-3\">\r\n\t\t\t\t\t\t\t<span>browse</span>\r\n\t\t\t\t\t\t\t<input type=\"file\" id=\"image\" name=\"image\"  accept=\"image/x-png,image/jpeg, image/jpg\">\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t<div class=\"file-path-wrapper\">\r\n\t\t\t\t\t\t\t<input id=\"imagef1\" name=\"imagef1\" class=\"file-path validate\" placeholder=\"Image 1: Product Front View\" type=\"text\">\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t\t\r\n\t\t\t\t<center>\r\n\t\t\t\t\t<input type=\"button\" id=\"postform\" onclick=\"return check(this.form, this.form.image);\" class=\"btn waves-effect waves-light red\" value=\"Post Product\" name=\"postform\" />\r\n\t\t\t\t</center>\r\n\t\t\t</div>\r\n    </form>\r\n\r\n    <div id=\"modal5\" class=\"modal bottom-sheet\">\r\n\t\t\t<div class=\"modal-content\">\r\n\t\t\t\t<p align=\"center\">You must provide all the requested details. Please try again</p>\r\n\t\t\t    </div>\r\n    </div>\r\n\r\n    <script type=\"text/javascript\">\r\n    $(document).ready(function() {\r\n\t\r\n      $(\"#image\").change(function(){\r\n\t      alert(\"file upload changed\");\r\n      });\r\n  \r\n    });\r\n\r\n    function check(form, image) {\r\n         //Check each field has a value\r\n        if (image.value == '' ) {\r\n\t\t    $('#modal5').openModal();\r\n            //alert('You must provide all the requested details. Please try     again');\r\n            return false;\r\n        }\r\n    }\r\n\r\n    </script>\r\n    <script src=\"js/jquery-3.1.1.min.js\"></script>\r\n    <script src=\"js/materialize.min.js\"></script>\r\n    </body>\r\n    </html>\r\n\r\n\r\nAfter clicking on the browse button, the jquery code on change does not execute. What am i doing wrong here? I would also want to submit upload this file via ajax. But since the on change function isn't working am in doubt how to access the file value in ajax/jquery"},"comment":{"url":"https://api.github.com/repos/Dogfalo/materialize/issues/comments/268172435","html_url":"https://github.com/Dogfalo/materialize/issues/4016#issuecomment-268172435","issue_url":"https://api.github.com/repos/Dogfalo/materialize/issues/4016","id":268172435,"user":{"login":"wackychocolatefactory","id":20605661,"avatar_url":"https://avatars.githubusercontent.com/u/20605661?v=3","gravatar_id":"","url":"https://api.github.com/users/wackychocolatefactory","html_url":"https://github.com/wackychocolatefactory","followers_url":"https://api.github.com/users/wackychocolatefactory/followers","following_url":"https://api.github.com/users/wackychocolatefactory/following{/other_user}","gists_url":"https://api.github.com/users/wackychocolatefactory/gists{/gist_id}","starred_url":"https://api.github.com/users/wackychocolatefactory/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/wackychocolatefactory/subscriptions","organizations_url":"https://api.github.com/users/wackychocolatefactory/orgs","repos_url":"https://api.github.com/users/wackychocolatefactory/repos","events_url":"https://api.github.com/users/wackychocolatefactory/events{/privacy}","received_events_url":"https://api.github.com/users/wackychocolatefactory/received_events","type":"User","site_admin":false},"created_at":"2016-12-20T07:17:06Z","updated_at":"2016-12-20T07:17:06Z","body":"You need to include the jQuery file before `$(document).ready(function() {});`"}}
{"actor":{"display_login":"wackychocolatefactory"}}