├── .circleci └── config.yml ├── .editorconfig ├── .eslintrc.js ├── .github └── issue_template.md ├── .gitignore ├── .travis.yml ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── CONTRIBUTORS.md ├── Gruntfile.js ├── LICENSE ├── LICENSE-MIT ├── README.md ├── _config.yml ├── bower.json ├── composer.json ├── dist ├── jquery.form.min.js └── jquery.form.min.js.map ├── docs ├── .gitignore ├── Gemfile ├── _config.yml ├── _layouts │ └── default.html ├── _sass │ └── style.scss ├── api.md ├── assets │ └── css │ │ └── style.scss ├── examples.md ├── faq.md ├── form-fields.md ├── index.md └── options.md ├── form.jquery.json ├── install ├── pre-commit.sh └── template │ └── shell.hb ├── package-lock.json ├── package.json ├── src └── jquery.form.js └── test ├── .eslintrc.js ├── ajax ├── doc-with-scripts.html ├── json.json ├── json.txt ├── script.txt ├── test.xml └── text.html ├── img └── submit.gif ├── test.html └── test.js /.circleci/config.yml: -------------------------------------------------------------------------------- 1 | # Javascript Node CircleCI 2.0 configuration file 2 | # 3 | # Check https://circleci.com/docs/2.0/language-javascript/ for more details 4 | # 5 | version: 2 6 | jobs: 7 | build: 8 | docker: 9 | # specify the version you desire here 10 | - image: circleci/node:8 11 | 12 | # Specify service dependencies here if necessary 13 | # CircleCI maintains a library of pre-built images 14 | # documented at https://circleci.com/docs/2.0/circleci-images/ 15 | # - image: circleci/mongo:3.4.4 16 | 17 | working_directory: ~/repo 18 | 19 | steps: 20 | - checkout 21 | 22 | - run: 23 | name: "Checking Versions" 24 | command: | 25 | node --version 26 | npm --version 27 | 28 | - run: 29 | name: update-npm 30 | command: 'sudo npm install -g npm@latest' 31 | 32 | # Download and cache dependencies 33 | - restore_cache: 34 | key: dependency-cache-{{ checksum "package.json" }} 35 | 36 | - run: npm install 37 | 38 | - save_cache: 39 | key: dependency-cache-{{ checksum "package.json" }} 40 | paths: 41 | - ./node_modules 42 | 43 | - run: 44 | name: "Checking Versions" 45 | command: | 46 | node --version 47 | npm --version 48 | 49 | # run tests! 50 | - run: grunt test 51 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | 3 | # top-most EditorConfig file 4 | root = true 5 | 6 | # Unix-style newlines with a newline ending every file 7 | [*] 8 | end_of_line = lf 9 | insert_final_newline = true 10 | charset = utf-8 11 | indent_style = tab 12 | indent_size = 4 13 | trim_trailing_whitespace = true 14 | insert_final_newline = true 15 | 16 | [{*.md,*.scss,*.css,*.php,*.yml,package.json}] 17 | indent_style = space 18 | indent_size = 2 19 | 20 | [*.md] 21 | trim_trailing_whitespace = false 22 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | "env": { 3 | "browser": true, 4 | "jquery": true, 5 | "node": true, 6 | "amd": true 7 | }, 8 | "parserOptions": { 9 | "ecmaVersion": 5, 10 | "sourceType": "script" 11 | }, 12 | "extends": "eslint:recommended", 13 | "rules": { 14 | "array-bracket-spacing": [ 15 | "warn", 16 | "never" 17 | ], 18 | "array-callback-return": "warn", 19 | "arrow-body-style": "error", 20 | "arrow-parens": "error", 21 | "arrow-spacing": "error", 22 | "block-scoped-var": "warn", 23 | "block-spacing": [ 24 | "warn", 25 | "always" 26 | ], 27 | "brace-style": [ 28 | "error", 29 | "1tbs" 30 | ], 31 | "callback-return": "error", 32 | "camelcase": [ 33 | "warn", 34 | { "properties": "always" } 35 | ], 36 | "class-methods-use-this": "error", 37 | "comma-dangle": [ 38 | "error", 39 | "never" 40 | ], 41 | "comma-spacing": "error", 42 | "comma-style": "error", 43 | "complexity": [ 44 | "warn", 45 | 20 46 | ], 47 | "computed-property-spacing": "error", 48 | "consistent-return": "error", 49 | "consistent-this": [ 50 | "error", 51 | "that", 52 | "outerThis", 53 | "self" 54 | ], 55 | "curly": [ 56 | "error", 57 | "all" 58 | ], 59 | "default-case": "error", 60 | "dot-location": [ 61 | "error", 62 | "property" 63 | ], 64 | "dot-notation": "error", 65 | "eol-last": "error", 66 | "eqeqeq": "error", 67 | "func-call-spacing": "error", 68 | "func-name-matching": "error", 69 | "id-length": [ 70 | "warn", 71 | { "exceptions": ["$","e","i","j"] } 72 | ], 73 | "indent": [ 74 | "error", 75 | "tab" 76 | ], 77 | "key-spacing": [ 78 | "warn", { 79 | "singleLine": { 80 | "beforeColon": false, 81 | "afterColon": true 82 | }, 83 | "multiLine": { 84 | "beforeColon": true, 85 | "afterColon": true, 86 | "align": "colon" 87 | } 88 | } 89 | ], 90 | "keyword-spacing": "error", 91 | "linebreak-style": [ 92 | "warn", 93 | "unix" 94 | ], 95 | "max-depth": "warn", 96 | "max-nested-callbacks": "error", 97 | "max-params": [ 98 | "warn", 99 | { "max": 4 } 100 | ], 101 | "max-statements": [ 102 | "warn", 103 | { "max": 20 } 104 | ], 105 | "max-statements-per-line": [ 106 | "error", 107 | { "max": 2 } 108 | ], 109 | "multiline-ternary": [ 110 | "error", 111 | "never" 112 | ], 113 | "new-parens": "error", 114 | "newline-per-chained-call": [ 115 | "warn", 116 | { "ignoreChainWithDepth": 3 } 117 | ], 118 | "no-alert": "error", 119 | "no-array-constructor": "error", 120 | "no-await-in-loop": "error", 121 | "no-bitwise": "error", 122 | "no-caller": "error", 123 | "no-compare-neg-zero": "error", 124 | "no-confusing-arrow": "error", 125 | "no-continue": "warn", 126 | "no-div-regex": "error", 127 | "no-duplicate-imports": "error", 128 | "no-else-return": [ 129 | "error", 130 | { "allowElseIf": false } 131 | ], 132 | "no-empty": [ 133 | "error", 134 | { "allowEmptyCatch": true } 135 | ], 136 | "no-empty-function": [ 137 | "error", 138 | { "allow": ["functions"] } 139 | ], 140 | "no-eq-null": "error", 141 | "no-eval": [ 142 | "error", 143 | { "allowIndirect": true } 144 | ], 145 | "no-extend-native": "error", 146 | "no-extra-bind": "error", 147 | "no-extra-label": "error", 148 | "no-extra-parens": [ 149 | "warn", 150 | "all", 151 | { 152 | "returnAssign": false, 153 | "nestedBinaryExpressions": false 154 | } 155 | ], 156 | "no-floating-decimal": "error", 157 | "no-global-assign": "error", 158 | "no-implicit-globals": "error", 159 | "no-implied-eval": "error", 160 | "no-inner-declarations": [ 161 | "warn", 162 | "both" 163 | ], 164 | "no-invalid-this": "warn", 165 | "no-iterator": "error", 166 | "no-label-var": "error", 167 | "no-labels": "error", 168 | "no-lone-blocks": "error", 169 | "no-lonely-if": "error", 170 | "no-loop-func": "error", 171 | "no-magic-numbers": [ 172 | "warn", 173 | { 174 | "ignore": [0,1], 175 | "ignoreArrayIndexes": true 176 | } 177 | ], 178 | "no-mixed-operators": "error", 179 | "no-mixed-requires": "error", 180 | "no-multi-assign": "warn", 181 | "no-multi-spaces": "error", 182 | "no-multi-str": "error", 183 | "no-multiple-empty-lines": [ 184 | "error", 185 | { 186 | max: 2, 187 | maxEOF: 1, 188 | maxBOF: 0 189 | } 190 | ], 191 | "no-negated-condition": "warn", 192 | "no-nested-ternary": "error", 193 | "no-new": "error", 194 | "no-new-func": "error", 195 | "no-new-object": "error", 196 | "no-new-require": "error", 197 | "no-new-wrappers": "error", 198 | "no-octal-escape": "error", 199 | "no-path-concat": "error", 200 | "no-process-env": "error", 201 | "no-process-exit": "error", 202 | "no-proto": "error", 203 | "no-prototype-builtins": "warn", 204 | "no-restricted-globals": "error", 205 | "no-restricted-imports": "error", 206 | "no-restricted-modules": "error", 207 | "no-restricted-properties": "error", 208 | "no-restricted-syntax": "error", 209 | "no-return-assign": "error", 210 | "no-return-await": "error", 211 | "no-script-url": "error", 212 | "no-self-compare": "error", 213 | "no-sequences": "error", 214 | "no-shadow": "warn", 215 | "no-shadow-restricted-names": "error", 216 | "no-sync": "warn", 217 | "no-template-curly-in-string": "error", 218 | "no-ternary": "warn", 219 | "no-throw-literal": "warn", 220 | "no-trailing-spaces": "error", 221 | "no-undef-init": "error", 222 | "no-undefined": "warn", 223 | "no-underscore-dangle": "error", 224 | "no-unmodified-loop-condition": "error", 225 | "no-unneeded-ternary": "error", 226 | "no-unsafe-negation": "error", 227 | "no-unused-expressions": "error", 228 | "no-unused-vars": [ 229 | "warn", 230 | { 231 | "vars": "local", 232 | "args": "none" 233 | } 234 | ], 235 | "no-use-before-define": [ 236 | "error", 237 | { 238 | "functions": false 239 | } 240 | ], 241 | "no-useless-call": "error", 242 | "no-useless-computed-key": "error", 243 | "no-useless-concat": "error", 244 | "no-useless-constructor": "error", 245 | "no-useless-escape": "error", 246 | "no-useless-rename": "error", 247 | "no-useless-return": "error", 248 | "no-var": "warn", 249 | "no-void": "error", 250 | "no-warning-comments": "warn", 251 | "no-whitespace-before-property": "error", 252 | "no-with": "error", 253 | "nonblock-statement-body-position": "error", 254 | "object-curly-newline": "error", 255 | "object-curly-spacing": [ 256 | "error", 257 | "never", 258 | { 259 | "arraysInObjects": true, 260 | "objectsInObjects": true 261 | } 262 | ], 263 | "object-property-newline": [ 264 | "error", 265 | { 266 | "allowMultiplePropertiesPerLine": true 267 | } 268 | ], 269 | "object-shorthand": [ 270 | "warn", 271 | "consistent" 272 | ], 273 | "operator-assignment": [ 274 | "error", 275 | "always" 276 | ], 277 | "operator-linebreak": "error", 278 | "padding-line-between-statements": [ 279 | "warn", 280 | { "blankLine": "always", "prev": ["const", "let", "var"], "next": "*"}, 281 | { "blankLine": "any", "prev": ["const", "let", "var"], "next": ["const", "let", "var"]}, 282 | { "blankLine": "always", "prev": "directive", "next": "*" }, 283 | { "blankLine": "any", "prev": "directive", "next": "directive" }, 284 | { "blankLine": "always", "prev": "*", "next": "return" } 285 | ], 286 | "prefer-const": "error", 287 | "prefer-promise-reject-errors": "error", 288 | "quote-props": [ 289 | "warn", 290 | "consistent-as-needed" 291 | ], 292 | "quotes": [ 293 | "error", 294 | "single", 295 | { 296 | "avoidEscape": true, 297 | "allowTemplateLiterals": true 298 | } 299 | ], 300 | "radix": "error", 301 | "require-await": "error", 302 | "rest-spread-spacing": "error", 303 | "semi": [ 304 | "error", 305 | "always" 306 | ], 307 | "semi-spacing": "error", 308 | "sort-imports": "error", 309 | "sort-keys": "warn", 310 | "sort-vars": "warn", 311 | "space-before-blocks": "warn", 312 | "space-before-function-paren": [ 313 | "warn", 314 | { 315 | "anonymous": "ignore", 316 | "named": "never", 317 | "asyncArrow": "ignore" 318 | } 319 | ], 320 | "space-in-parens": "warn", 321 | "space-infix-ops": "error", 322 | "space-unary-ops": "error", 323 | "spaced-comment": ["error", "always", { 324 | "line": { 325 | "markers": ["/"], 326 | "exceptions": ["-", "+"] 327 | }, 328 | "block": { 329 | "markers": ["!"], 330 | "exceptions": ["*"], 331 | "balanced": true 332 | } 333 | }], 334 | "strict": [ 335 | "warn", 336 | "function" 337 | ], 338 | "template-curly-spacing": "error", 339 | "template-tag-spacing": "error", 340 | "unicode-bom": "error", 341 | "vars-on-top": "warn", 342 | "wrap-iife": "error", 343 | "yield-star-spacing": "error", 344 | "yoda": "error" 345 | } 346 | }; 347 | -------------------------------------------------------------------------------- /.github/issue_template.md: -------------------------------------------------------------------------------- 1 | Please review [Instructions for Reporting a Bug](https://github.com/jquery-form/form/blob/master/CONTRIBUTING.md#reporting-a-bug). 2 | 3 | ### Description: 4 | 5 | ### Expected Behavior: 6 | 7 | ### Actual behavior: 8 | 9 | ### Versions: 10 | **LoadJSON:** 11 | **jQuery:** 12 | **Browsers:** 13 | 14 | ### Demonstration 15 | Link to demonstration of issue in [JSFiddle](https://jsfiddle.net/) or [CodePen](https://codepen.io/): 16 | 17 | ### Steps to reproduce: 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by https://www.gitignore.io/api/composer,git,laravel,macos,node,phpstorm,pycharm,sublimetext,vim,visualstudiocode,webstorm,windows 2 | # Edit at https://www.gitignore.io/?templates=composer,git,laravel,macos,node,phpstorm,pycharm,sublimetext,vim,visualstudiocode,webstorm,windows 3 | 4 | ### Composer ### 5 | composer.phar 6 | .composer/auth.json 7 | vendor/ 8 | 9 | ### Git ### 10 | *.orig 11 | 12 | # Created by git when using merge tools for conflicts 13 | *.BACKUP.* 14 | *.BASE.* 15 | *.LOCAL.* 16 | *.REMOTE.* 17 | *_BACKUP_*.txt 18 | *_BASE_*.txt 19 | *_LOCAL_*.txt 20 | *_REMOTE_*.txt 21 | 22 | ### Laravel ### 23 | node_modules/ 24 | npm-debug.log 25 | _ide_helper.php 26 | 27 | # Laravel 4 specific 28 | bootstrap/compiled.php 29 | app/storage/ 30 | 31 | # Laravel 5 & Lumen specific 32 | public/storage 33 | public/hot 34 | storage/*.key 35 | .env 36 | Homestead.yaml 37 | Homestead.json 38 | config.cnf 39 | config_open_data.cnf 40 | /.vagrant 41 | Vagrantfile 42 | 43 | # Rocketeer PHP task runner and deployment package. https://github.com/rocketeers/rocketeer 44 | .rocketeer/ 45 | 46 | # PHPUnit 47 | *.cache 48 | /ci 49 | 50 | ### macOS ### 51 | # General 52 | .DS_Store 53 | .AppleDouble 54 | .LSOverride 55 | 56 | # Icon must end with two \r 57 | Icon 58 | 59 | # Thumbnails 60 | ._* 61 | 62 | # Files that might appear in the root of a volume 63 | .DocumentRevisions-V100 64 | .fseventsd 65 | .Spotlight-V100 66 | .TemporaryItems 67 | .Trashes 68 | .VolumeIcon.icns 69 | .com.apple.timemachine.donotpresent 70 | 71 | # Directories potentially created on remote AFP share 72 | .AppleDB 73 | .AppleDesktop 74 | Network Trash Folder 75 | Temporary Items 76 | .apdisk 77 | 78 | ### Node ### 79 | # Logs 80 | logs 81 | *.log 82 | npm-debug.log* 83 | 84 | # Runtime data 85 | pids 86 | *.pid 87 | *.seed 88 | *.pid.lock 89 | 90 | # Compiled binary addons (https://nodejs.org/api/addons.html) 91 | build/Release 92 | 93 | # Optional npm cache directory 94 | .npm 95 | 96 | # Optional eslint cache 97 | .eslintcache 98 | 99 | # Optional REPL history 100 | .node_repl_history 101 | 102 | # Output of 'npm pack' 103 | *.tgz 104 | 105 | ### PhpStorm ### 106 | # Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and WebStorm 107 | # Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839 108 | 109 | # User-specific stuff 110 | .idea/ 111 | 112 | # CMake 113 | cmake-build-*/ 114 | 115 | # File-based project format 116 | *.iws 117 | 118 | # IntelliJ 119 | out/ 120 | 121 | # mpeltonen/sbt-idea plugin 122 | .idea_modules/ 123 | 124 | # JIRA plugin 125 | atlassian-ide-plugin.xml 126 | 127 | # Crashlytics plugin (for Android Studio and IntelliJ) 128 | com_crashlytics_export_strings.xml 129 | crashlytics.properties 130 | crashlytics-build.properties 131 | fabric.properties 132 | 133 | ### PhpStorm Patch ### 134 | # Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721 135 | 136 | # *.iml 137 | # modules.xml 138 | # *.ipr 139 | 140 | ### PyCharm ### 141 | 142 | # Generated files 143 | /tools/*.pyc 144 | 145 | ### SublimeText ### 146 | # Cache files for Sublime Text 147 | *.tmlanguage.cache 148 | *.tmPreferences.cache 149 | *.stTheme.cache 150 | 151 | # Workspace files are user-specific 152 | *.sublime-workspace 153 | *.sublime-project 154 | 155 | # SFTP configuration file 156 | sftp-config.json 157 | 158 | # Package control specific files 159 | Package Control.last-run 160 | Package Control.ca-list 161 | Package Control.ca-bundle 162 | Package Control.system-ca-bundle 163 | Package Control.cache/ 164 | Package Control.ca-certs/ 165 | Package Control.merged-ca-bundle 166 | Package Control.user-ca-bundle 167 | oscrypto-ca-bundle.crt 168 | bh_unicode_properties.cache 169 | 170 | # Sublime-github package stores a github token in this file 171 | # https://packagecontrol.io/packages/sublime-github 172 | GitHub.sublime-settings 173 | 174 | ### Vim ### 175 | # Swap 176 | [._]*.s[a-v][a-z] 177 | [._]*.sw[a-p] 178 | [._]s[a-rt-v][a-z] 179 | [._]ss[a-gi-z] 180 | [._]sw[a-p] 181 | 182 | # Session 183 | Session.vim 184 | 185 | # Temporary 186 | .netrwhist 187 | *~ 188 | # Auto-generated tag files 189 | tags 190 | # Persistent undo 191 | [._]*.un~ 192 | 193 | ### VisualStudioCode ### 194 | .vscode/* 195 | !.vscode/settings.json 196 | !.vscode/tasks.json 197 | !.vscode/launch.json 198 | !.vscode/extensions.json 199 | 200 | ### VisualStudioCode Patch ### 201 | # Ignore all local history of files 202 | .history 203 | 204 | ### Windows ### 205 | # Windows thumbnail cache files 206 | Thumbs.db 207 | ehthumbs.db 208 | ehthumbs_vista.db 209 | 210 | # Dump file 211 | *.stackdump 212 | 213 | # Folder config file 214 | [Dd]esktop.ini 215 | 216 | # Recycle Bin used on file shares 217 | $RECYCLE.BIN/ 218 | 219 | # Windows Installer files 220 | *.cab 221 | *.msi 222 | *.msix 223 | *.msm 224 | *.msp 225 | 226 | # Windows shortcuts 227 | *.lnk 228 | 229 | # End of https://www.gitignore.io/api/composer,git,laravel,macos,node,phpstorm,pycharm,sublimetext,vim,visualstudiocode,webstorm,windows 230 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "10" 4 | script: 5 | - grunt test 6 | cache: 7 | bundler: true 8 | directories: 9 | - "node_modules" # NPM packages 10 | before_install: 11 | - if [[ `npm -v ` != 5* ]]; then npm i -g npm@5; fi 12 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as 6 | contributors and maintainers pledge to making participation in our project and 7 | our community a harassment-free experience for everyone, regardless of age, body 8 | size, disability, ethnicity, gender identity and expression, level of experience, 9 | nationality, personal appearance, race, religion, or sexual identity and 10 | orientation. 11 | 12 | ## Our Standards 13 | 14 | Examples of behavior that contributes to creating a positive environment 15 | include: 16 | 17 | * Using welcoming and inclusive language 18 | * Being respectful of differing viewpoints and experiences 19 | * Gracefully accepting constructive criticism 20 | * Focusing on what is best for the community 21 | * Showing empathy towards other community members 22 | 23 | Examples of unacceptable behavior by participants include: 24 | 25 | * The use of sexualized language or imagery and unwelcome sexual attention or 26 | advances 27 | * Trolling, insulting/derogatory comments, and personal or political attacks 28 | * Public or private harassment 29 | * Publishing others' private information, such as a physical or electronic 30 | address, without explicit permission 31 | * Other conduct which could reasonably be considered inappropriate in a 32 | professional setting 33 | 34 | ## Our Responsibilities 35 | 36 | Project maintainers are responsible for clarifying the standards of acceptable 37 | behavior and are expected to take appropriate and fair corrective action in 38 | response to any instances of unacceptable behavior. 39 | 40 | Project maintainers have the right and responsibility to remove, edit, or 41 | reject comments, commits, code, wiki edits, issues, and other contributions 42 | that are not aligned to this Code of Conduct, or to ban temporarily or 43 | permanently any contributor for other behaviors that they deem inappropriate, 44 | threatening, offensive, or harmful. 45 | 46 | ## Scope 47 | 48 | This Code of Conduct applies both within project spaces and in public spaces 49 | when an individual is representing the project or its community. Examples of 50 | representing a project or community include using an official project e-mail 51 | address, posting via an official social media account, or acting as an appointed 52 | representative at an online or offline event. Representation of a project may be 53 | further defined and clarified by project maintainers. 54 | 55 | ## Enforcement 56 | 57 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 58 | reported by contacting the project team. All 59 | complaints will be reviewed and investigated and will result in a response that 60 | is deemed necessary and appropriate to the circumstances. The project team is 61 | obligated to maintain confidentiality with regard to the reporter of an incident. 62 | Further details of specific enforcement policies may be posted separately. 63 | 64 | Project maintainers who do not follow or enforce the Code of Conduct in good 65 | faith may face temporary or permanent repercussions as determined by other 66 | members of the project's leadership. 67 | 68 | ## Attribution 69 | 70 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 71 | available at [http://contributor-covenant.org/version/1/4][version] 72 | 73 | [homepage]: http://contributor-covenant.org 74 | [version]: http://contributor-covenant.org/version/1/4/ 75 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing to jQuery Form 2 | 3 | Want to contribute to jQuery Form? That's great! Contributions are most welcome! 4 | Here are a couple of guidelines that will help you contribute. Before we get started: Please note that this project is released with a [Contributor Code of Conduct](CODE_OF_CONDUCT.md) to ensure that this project is a welcoming place for **everyone** to contribute to. By participating in this project you agree to abide by its terms. 5 | 6 | #### Overview 7 | 8 | * [Contribution workflow](#contribution-workflow) 9 | * [Testing](#testing) 10 | * [Reporting a bug](#reporting-a-bug) 11 | * [Contributing to an existing issue](#contributing-to-an-existing-issue) 12 | * [Feature Requests](#feature-requests) 13 | * [Additional info](#additional-info) 14 | 15 | ## Contribution workflow 16 | 17 | 1. Fork the repository in GitHub with the `Fork` button. 18 | 2. Switch to a new branch (ie. `new-feature`), and work from there: 19 | `git checkout -b new-feature` 20 | 3. Make your feature addition or bug fix. 21 | 4. After setting up your [testing enviroment](#testing), run the tests: 22 | 23 | ```shell 24 | grunt test 25 | ``` 26 | 27 | If the tests all pass, move on to step 5. 28 | 29 | 5. Send a pull request (PR). Bonus points for topic branches. 30 | * Please make sure all of your commits are atomic (one feature per commit). 31 | * Use sensible commit messages. 32 | * Always write a clear log message for your commits. One-line messages are fine for small changes, but bigger changes should look like this: 33 | ```shell 34 | $ git commit -m "A brief summary of the commit" 35 | > 36 | > A paragraph describing what changed and its impact." 37 | ``` 38 | * If your PR fixes a separate issue number, include it in the commit message. 39 | 40 | ### Things to keep in mind 41 | 42 | * Smaller PRs are likely to be merged more quickly than bigger changes. 43 | * If it is a useful PR, it **will** get merged in eventually. 44 | * This project is using [Semantic Versioning 2.0.0](http://semver.org/) 45 | 46 | ## Testing 47 | 48 | jQuery Form uses [Node.js](https://nodejs.org/), [Grunt](https://gruntjs.com/), [ESLint](http://eslint.org/), [Mocha](https://mochajs.org/), and [Chai](http://chaijs.com/) to automate the building and validation of source code. Here is how to set that up: 49 | 50 | 1. Get [Node.js](https://nodejs.org/) (includes [NPM](https://www.npmjs.com/), necessary for the next step) 51 | 2. Install Grunt CLI: 52 | 53 | ```shell 54 | npm install -g grunt-cli 55 | ``` 56 | 57 | 3. Install dependencies: 58 | 59 | ```shell 60 | npm install 61 | ``` 62 | 63 | 4. Run the tests by opening `test/test.html` in your web browser or using Grunt: 64 | 65 | ```shell 66 | grunt test 67 | ``` 68 | 69 | ## Reporting a bug 70 | 71 | So you've found a bug, and want to help us fix it? Before filing a bug report, please double-check the bug hasn't already been reported. You can do so [on our issue tracker](https://github.com/jquery-form/form/issues?q=is%3Aopen+is%3Aissue). If something hasn't been raised, you can go ahead and create a new issue with the following information: 72 | 73 | * Which version of the plugin are you using? 74 | * Which version of the jQuery library are you using? 75 | * What browsers (and versions) have you tested in? 76 | * How can the error be reproduced? 77 | * If possible, include a link to a [JSFiddle](https://jsfiddle.net/) or [CodePen](https://codepen.io/) example of the error. 78 | 79 | If you want to be really thorough, there is a great overview on Stack Overflow of [what you should consider when reporting a bug](https://stackoverflow.com/questions/240323/how-to-report-bugs-the-smart-way). 80 | 81 | It goes without saying that you're welcome to help investigate further and/or find a fix for the bug. If you want to do so, just mention it in your bug report and offer your help! 82 | 83 | ## Contributing to an existing issue 84 | 85 | ### Finding an issue to work on 86 | 87 | We've got a few open issues and are always glad to get help on that front. You can view the list of issues [here](https://github.com/jquery-form/form/issues). (Here's [a good article](https://medium.freecodecamp.com/finding-your-first-open-source-project-or-bug-to-work-on-1712f651e5ba) on how to find your first bug to fix). 88 | 89 | Before getting to work, take a look at the issue and at the conversation around it. Has someone already offered to work on the issue? Has someone been assigned to the issue? If so, you might want to check with them to see whether they're still actively working on it. 90 | 91 | If the issue is a few months old, it might be a good idea to write a short comment to double-check that the issue or feature is still a valid one to jump on. 92 | 93 | Feel free to ask for more detail on what is expected: are there any more details or specifications you need to know? 94 | And if at any point you get stuck: don't hesitate to ask for help. 95 | 96 | ### Making your contribution 97 | 98 | We've outlined the contribution workflow [here](#contribution-workflow). If you're a first-timer, don't worry! GitHub has a ton of guides to help you through your first pull request: You can find out more about pull requests [here](https://help.github.com/articles/about-pull-requests/) and about creating a pull request [here](https://help.github.com/articles/creating-a-pull-request/). 99 | 100 | ## Feature Requests 101 | 102 | * You can _request_ a new feature by [submitting an issue](https://github.com/jquery-form/form/issues). 103 | * If you would like to _implement_ a new feature: 104 | * For a **Major Feature**, first open an issue and outline your proposal so that it can be discussed. This will also allow us to better coordinate our efforts, prevent duplication of work, and help you to craft the change so that it is successfully accepted into the project. 105 | * **Small Features** can be crafted and directly [submitted as a Pull Request](#contribution-workflow). 106 | 107 | ## Additional info 108 | 109 | Especially if you're a newcomer to Open Source and you've found some little bumps along the way while contributing, we recommend you write about them. [Here](https://medium.freecodecamp.com/new-contributors-to-open-source-please-blog-more-920af14cffd)'s a great article about why writing about your experience is important; this will encourage other beginners to try their luck at Open Source, too! 110 | -------------------------------------------------------------------------------- /CONTRIBUTORS.md: -------------------------------------------------------------------------------- 1 | #Contributors 2 | 3 | ###Copyright 2017 Kevin Morris 4 | Continuing Work [jQuery Form](https://github.com/jquery-form/form/) by Kevin Morris 5 | Project Home: [github.com/jquery-form/form](https://github.com/jquery-form/form/) 6 | 7 | ###Copyright 2006-2014 Mike Alsup 8 | Original work [jQuery Form](https://github.com/malsup/form/) by Mike Alsup 9 | Project Home: [jquery.malsup.com/form](http://jquery.malsup.com/form/) 10 | The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. 11 | -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function(grunt) { 2 | grunt.initConfig({ 3 | pkg: grunt.file.readJSON('package.json'), 4 | meta: { 5 | banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd HH:MM:ss") %> */' 6 | }, 7 | 8 | githooks: { 9 | options: { 10 | hashbang: '#!/bin/sh', 11 | template: 'install/template/shell.hb', 12 | startMarker: '# GRUNT-GITHOOKS START', 13 | endMarker: '# GRUNT-GITHOOKS END' 14 | }, 15 | all: { 16 | 'pre-commit': 'pre-commit' 17 | } 18 | }, 19 | 20 | eslint: { 21 | options: { 22 | quiet: true 23 | }, 24 | target: ['src/**/*.js'] 25 | }, 26 | 27 | mocha: { 28 | all: { 29 | src: ['test/*.html'] 30 | }, 31 | options: { 32 | run: true, 33 | growlOnSuccess: false 34 | } 35 | }, 36 | 37 | // Minifies JS files 38 | uglify: { 39 | options: { 40 | output: { 41 | comments: /^!|@preserve|@license|@cc_on/i 42 | }, 43 | sourceMap: true, 44 | footer: '\n' 45 | }, 46 | dist: { 47 | files: [{ 48 | expand: true, 49 | cwd: 'src', 50 | src: ['*.js','!*.min.js'], 51 | dest: 'dist', 52 | ext: '.min.js', 53 | extDot: 'last' 54 | }] 55 | } 56 | } 57 | }); 58 | 59 | // Load tasks 60 | grunt.loadNpmTasks('grunt-contrib-uglify'); 61 | grunt.loadNpmTasks('grunt-mocha'); 62 | grunt.loadNpmTasks('grunt-eslint'); 63 | grunt.loadNpmTasks('grunt-githooks'); 64 | 65 | // Default task. 66 | grunt.registerTask('lint', [ 'eslint' ]); 67 | grunt.registerTask('test', [ 'lint', 'mocha' ]); 68 | grunt.registerTask('pre-commit', [ 'test' ]); 69 | grunt.registerTask('default', [ 'test', 'uglify' ]); 70 | }; 71 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | GNU LESSER GENERAL PUBLIC LICENSE 2 | Version 2.1, February 1999 3 | 4 | Copyright (C) 1991, 1999 Free Software Foundation, Inc. 5 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA 6 | Everyone is permitted to copy and distribute verbatim copies 7 | of this license document, but changing it is not allowed. 8 | 9 | (This is the first released version of the Lesser GPL. It also counts 10 | as the successor of the GNU Library Public License, version 2, hence 11 | the version number 2.1.) 12 | 13 | Preamble 14 | 15 | The licenses for most software are designed to take away your 16 | freedom to share and change it. By contrast, the GNU General Public 17 | Licenses are intended to guarantee your freedom to share and change 18 | free software--to make sure the software is free for all its users. 19 | 20 | This license, the Lesser General Public License, applies to some 21 | specially designated software packages--typically libraries--of the 22 | Free Software Foundation and other authors who decide to use it. You 23 | can use it too, but we suggest you first think carefully about whether 24 | this license or the ordinary General Public License is the better 25 | strategy to use in any particular case, based on the explanations below. 26 | 27 | When we speak of free software, we are referring to freedom of use, 28 | not price. Our General Public Licenses are designed to make sure that 29 | you have the freedom to distribute copies of free software (and charge 30 | for this service if you wish); that you receive source code or can get 31 | it if you want it; that you can change the software and use pieces of 32 | it in new free programs; and that you are informed that you can do 33 | these things. 34 | 35 | To protect your rights, we need to make restrictions that forbid 36 | distributors to deny you these rights or to ask you to surrender these 37 | rights. These restrictions translate to certain responsibilities for 38 | you if you distribute copies of the library or if you modify it. 39 | 40 | For example, if you distribute copies of the library, whether gratis 41 | or for a fee, you must give the recipients all the rights that we gave 42 | you. You must make sure that they, too, receive or can get the source 43 | code. If you link other code with the library, you must provide 44 | complete object files to the recipients, so that they can relink them 45 | with the library after making changes to the library and recompiling 46 | it. And you must show them these terms so they know their rights. 47 | 48 | We protect your rights with a two-step method: (1) we copyright the 49 | library, and (2) we offer you this license, which gives you legal 50 | permission to copy, distribute and/or modify the library. 51 | 52 | To protect each distributor, we want to make it very clear that 53 | there is no warranty for the free library. Also, if the library is 54 | modified by someone else and passed on, the recipients should know 55 | that what they have is not the original version, so that the original 56 | author's reputation will not be affected by problems that might be 57 | introduced by others. 58 | 59 | Finally, software patents pose a constant threat to the existence of 60 | any free program. We wish to make sure that a company cannot 61 | effectively restrict the users of a free program by obtaining a 62 | restrictive license from a patent holder. Therefore, we insist that 63 | any patent license obtained for a version of the library must be 64 | consistent with the full freedom of use specified in this license. 65 | 66 | Most GNU software, including some libraries, is covered by the 67 | ordinary GNU General Public License. This license, the GNU Lesser 68 | General Public License, applies to certain designated libraries, and 69 | is quite different from the ordinary General Public License. We use 70 | this license for certain libraries in order to permit linking those 71 | libraries into non-free programs. 72 | 73 | When a program is linked with a library, whether statically or using 74 | a shared library, the combination of the two is legally speaking a 75 | combined work, a derivative of the original library. The ordinary 76 | General Public License therefore permits such linking only if the 77 | entire combination fits its criteria of freedom. The Lesser General 78 | Public License permits more lax criteria for linking other code with 79 | the library. 80 | 81 | We call this license the "Lesser" General Public License because it 82 | does Less to protect the user's freedom than the ordinary General 83 | Public License. It also provides other free software developers Less 84 | of an advantage over competing non-free programs. These disadvantages 85 | are the reason we use the ordinary General Public License for many 86 | libraries. However, the Lesser license provides advantages in certain 87 | special circumstances. 88 | 89 | For example, on rare occasions, there may be a special need to 90 | encourage the widest possible use of a certain library, so that it becomes 91 | a de-facto standard. To achieve this, non-free programs must be 92 | allowed to use the library. A more frequent case is that a free 93 | library does the same job as widely used non-free libraries. In this 94 | case, there is little to gain by limiting the free library to free 95 | software only, so we use the Lesser General Public License. 96 | 97 | In other cases, permission to use a particular library in non-free 98 | programs enables a greater number of people to use a large body of 99 | free software. For example, permission to use the GNU C Library in 100 | non-free programs enables many more people to use the whole GNU 101 | operating system, as well as its variant, the GNU/Linux operating 102 | system. 103 | 104 | Although the Lesser General Public License is Less protective of the 105 | users' freedom, it does ensure that the user of a program that is 106 | linked with the Library has the freedom and the wherewithal to run 107 | that program using a modified version of the Library. 108 | 109 | The precise terms and conditions for copying, distribution and 110 | modification follow. Pay close attention to the difference between a 111 | "work based on the library" and a "work that uses the library". The 112 | former contains code derived from the library, whereas the latter must 113 | be combined with the library in order to run. 114 | 115 | GNU LESSER GENERAL PUBLIC LICENSE 116 | TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION 117 | 118 | 0. This License Agreement applies to any software library or other 119 | program which contains a notice placed by the copyright holder or 120 | other authorized party saying it may be distributed under the terms of 121 | this Lesser General Public License (also called "this License"). 122 | Each licensee is addressed as "you". 123 | 124 | A "library" means a collection of software functions and/or data 125 | prepared so as to be conveniently linked with application programs 126 | (which use some of those functions and data) to form executables. 127 | 128 | The "Library", below, refers to any such software library or work 129 | which has been distributed under these terms. A "work based on the 130 | Library" means either the Library or any derivative work under 131 | copyright law: that is to say, a work containing the Library or a 132 | portion of it, either verbatim or with modifications and/or translated 133 | straightforwardly into another language. (Hereinafter, translation is 134 | included without limitation in the term "modification".) 135 | 136 | "Source code" for a work means the preferred form of the work for 137 | making modifications to it. For a library, complete source code means 138 | all the source code for all modules it contains, plus any associated 139 | interface definition files, plus the scripts used to control compilation 140 | and installation of the library. 141 | 142 | Activities other than copying, distribution and modification are not 143 | covered by this License; they are outside its scope. The act of 144 | running a program using the Library is not restricted, and output from 145 | such a program is covered only if its contents constitute a work based 146 | on the Library (independent of the use of the Library in a tool for 147 | writing it). Whether that is true depends on what the Library does 148 | and what the program that uses the Library does. 149 | 150 | 1. You may copy and distribute verbatim copies of the Library's 151 | complete source code as you receive it, in any medium, provided that 152 | you conspicuously and appropriately publish on each copy an 153 | appropriate copyright notice and disclaimer of warranty; keep intact 154 | all the notices that refer to this License and to the absence of any 155 | warranty; and distribute a copy of this License along with the 156 | Library. 157 | 158 | You may charge a fee for the physical act of transferring a copy, 159 | and you may at your option offer warranty protection in exchange for a 160 | fee. 161 | 162 | 2. You may modify your copy or copies of the Library or any portion 163 | of it, thus forming a work based on the Library, and copy and 164 | distribute such modifications or work under the terms of Section 1 165 | above, provided that you also meet all of these conditions: 166 | 167 | a) The modified work must itself be a software library. 168 | 169 | b) You must cause the files modified to carry prominent notices 170 | stating that you changed the files and the date of any change. 171 | 172 | c) You must cause the whole of the work to be licensed at no 173 | charge to all third parties under the terms of this License. 174 | 175 | d) If a facility in the modified Library refers to a function or a 176 | table of data to be supplied by an application program that uses 177 | the facility, other than as an argument passed when the facility 178 | is invoked, then you must make a good faith effort to ensure that, 179 | in the event an application does not supply such function or 180 | table, the facility still operates, and performs whatever part of 181 | its purpose remains meaningful. 182 | 183 | (For example, a function in a library to compute square roots has 184 | a purpose that is entirely well-defined independent of the 185 | application. Therefore, Subsection 2d requires that any 186 | application-supplied function or table used by this function must 187 | be optional: if the application does not supply it, the square 188 | root function must still compute square roots.) 189 | 190 | These requirements apply to the modified work as a whole. If 191 | identifiable sections of that work are not derived from the Library, 192 | and can be reasonably considered independent and separate works in 193 | themselves, then this License, and its terms, do not apply to those 194 | sections when you distribute them as separate works. But when you 195 | distribute the same sections as part of a whole which is a work based 196 | on the Library, the distribution of the whole must be on the terms of 197 | this License, whose permissions for other licensees extend to the 198 | entire whole, and thus to each and every part regardless of who wrote 199 | it. 200 | 201 | Thus, it is not the intent of this section to claim rights or contest 202 | your rights to work written entirely by you; rather, the intent is to 203 | exercise the right to control the distribution of derivative or 204 | collective works based on the Library. 205 | 206 | In addition, mere aggregation of another work not based on the Library 207 | with the Library (or with a work based on the Library) on a volume of 208 | a storage or distribution medium does not bring the other work under 209 | the scope of this License. 210 | 211 | 3. You may opt to apply the terms of the ordinary GNU General Public 212 | License instead of this License to a given copy of the Library. To do 213 | this, you must alter all the notices that refer to this License, so 214 | that they refer to the ordinary GNU General Public License, version 2, 215 | instead of to this License. (If a newer version than version 2 of the 216 | ordinary GNU General Public License has appeared, then you can specify 217 | that version instead if you wish.) Do not make any other change in 218 | these notices. 219 | 220 | Once this change is made in a given copy, it is irreversible for 221 | that copy, so the ordinary GNU General Public License applies to all 222 | subsequent copies and derivative works made from that copy. 223 | 224 | This option is useful when you wish to copy part of the code of 225 | the Library into a program that is not a library. 226 | 227 | 4. You may copy and distribute the Library (or a portion or 228 | derivative of it, under Section 2) in object code or executable form 229 | under the terms of Sections 1 and 2 above provided that you accompany 230 | it with the complete corresponding machine-readable source code, which 231 | must be distributed under the terms of Sections 1 and 2 above on a 232 | medium customarily used for software interchange. 233 | 234 | If distribution of object code is made by offering access to copy 235 | from a designated place, then offering equivalent access to copy the 236 | source code from the same place satisfies the requirement to 237 | distribute the source code, even though third parties are not 238 | compelled to copy the source along with the object code. 239 | 240 | 5. A program that contains no derivative of any portion of the 241 | Library, but is designed to work with the Library by being compiled or 242 | linked with it, is called a "work that uses the Library". Such a 243 | work, in isolation, is not a derivative work of the Library, and 244 | therefore falls outside the scope of this License. 245 | 246 | However, linking a "work that uses the Library" with the Library 247 | creates an executable that is a derivative of the Library (because it 248 | contains portions of the Library), rather than a "work that uses the 249 | library". The executable is therefore covered by this License. 250 | Section 6 states terms for distribution of such executables. 251 | 252 | When a "work that uses the Library" uses material from a header file 253 | that is part of the Library, the object code for the work may be a 254 | derivative work of the Library even though the source code is not. 255 | Whether this is true is especially significant if the work can be 256 | linked without the Library, or if the work is itself a library. The 257 | threshold for this to be true is not precisely defined by law. 258 | 259 | If such an object file uses only numerical parameters, data 260 | structure layouts and accessors, and small macros and small inline 261 | functions (ten lines or less in length), then the use of the object 262 | file is unrestricted, regardless of whether it is legally a derivative 263 | work. (Executables containing this object code plus portions of the 264 | Library will still fall under Section 6.) 265 | 266 | Otherwise, if the work is a derivative of the Library, you may 267 | distribute the object code for the work under the terms of Section 6. 268 | Any executables containing that work also fall under Section 6, 269 | whether or not they are linked directly with the Library itself. 270 | 271 | 6. As an exception to the Sections above, you may also combine or 272 | link a "work that uses the Library" with the Library to produce a 273 | work containing portions of the Library, and distribute that work 274 | under terms of your choice, provided that the terms permit 275 | modification of the work for the customer's own use and reverse 276 | engineering for debugging such modifications. 277 | 278 | You must give prominent notice with each copy of the work that the 279 | Library is used in it and that the Library and its use are covered by 280 | this License. You must supply a copy of this License. If the work 281 | during execution displays copyright notices, you must include the 282 | copyright notice for the Library among them, as well as a reference 283 | directing the user to the copy of this License. Also, you must do one 284 | of these things: 285 | 286 | a) Accompany the work with the complete corresponding 287 | machine-readable source code for the Library including whatever 288 | changes were used in the work (which must be distributed under 289 | Sections 1 and 2 above); and, if the work is an executable linked 290 | with the Library, with the complete machine-readable "work that 291 | uses the Library", as object code and/or source code, so that the 292 | user can modify the Library and then relink to produce a modified 293 | executable containing the modified Library. (It is understood 294 | that the user who changes the contents of definitions files in the 295 | Library will not necessarily be able to recompile the application 296 | to use the modified definitions.) 297 | 298 | b) Use a suitable shared library mechanism for linking with the 299 | Library. A suitable mechanism is one that (1) uses at run time a 300 | copy of the library already present on the user's computer system, 301 | rather than copying library functions into the executable, and (2) 302 | will operate properly with a modified version of the library, if 303 | the user installs one, as long as the modified version is 304 | interface-compatible with the version that the work was made with. 305 | 306 | c) Accompany the work with a written offer, valid for at 307 | least three years, to give the same user the materials 308 | specified in Subsection 6a, above, for a charge no more 309 | than the cost of performing this distribution. 310 | 311 | d) If distribution of the work is made by offering access to copy 312 | from a designated place, offer equivalent access to copy the above 313 | specified materials from the same place. 314 | 315 | e) Verify that the user has already received a copy of these 316 | materials or that you have already sent this user a copy. 317 | 318 | For an executable, the required form of the "work that uses the 319 | Library" must include any data and utility programs needed for 320 | reproducing the executable from it. However, as a special exception, 321 | the materials to be distributed need not include anything that is 322 | normally distributed (in either source or binary form) with the major 323 | components (compiler, kernel, and so on) of the operating system on 324 | which the executable runs, unless that component itself accompanies 325 | the executable. 326 | 327 | It may happen that this requirement contradicts the license 328 | restrictions of other proprietary libraries that do not normally 329 | accompany the operating system. Such a contradiction means you cannot 330 | use both them and the Library together in an executable that you 331 | distribute. 332 | 333 | 7. You may place library facilities that are a work based on the 334 | Library side-by-side in a single library together with other library 335 | facilities not covered by this License, and distribute such a combined 336 | library, provided that the separate distribution of the work based on 337 | the Library and of the other library facilities is otherwise 338 | permitted, and provided that you do these two things: 339 | 340 | a) Accompany the combined library with a copy of the same work 341 | based on the Library, uncombined with any other library 342 | facilities. This must be distributed under the terms of the 343 | Sections above. 344 | 345 | b) Give prominent notice with the combined library of the fact 346 | that part of it is a work based on the Library, and explaining 347 | where to find the accompanying uncombined form of the same work. 348 | 349 | 8. You may not copy, modify, sublicense, link with, or distribute 350 | the Library except as expressly provided under this License. Any 351 | attempt otherwise to copy, modify, sublicense, link with, or 352 | distribute the Library is void, and will automatically terminate your 353 | rights under this License. However, parties who have received copies, 354 | or rights, from you under this License will not have their licenses 355 | terminated so long as such parties remain in full compliance. 356 | 357 | 9. You are not required to accept this License, since you have not 358 | signed it. However, nothing else grants you permission to modify or 359 | distribute the Library or its derivative works. These actions are 360 | prohibited by law if you do not accept this License. Therefore, by 361 | modifying or distributing the Library (or any work based on the 362 | Library), you indicate your acceptance of this License to do so, and 363 | all its terms and conditions for copying, distributing or modifying 364 | the Library or works based on it. 365 | 366 | 10. Each time you redistribute the Library (or any work based on the 367 | Library), the recipient automatically receives a license from the 368 | original licensor to copy, distribute, link with or modify the Library 369 | subject to these terms and conditions. You may not impose any further 370 | restrictions on the recipients' exercise of the rights granted herein. 371 | You are not responsible for enforcing compliance by third parties with 372 | this License. 373 | 374 | 11. If, as a consequence of a court judgment or allegation of patent 375 | infringement or for any other reason (not limited to patent issues), 376 | conditions are imposed on you (whether by court order, agreement or 377 | otherwise) that contradict the conditions of this License, they do not 378 | excuse you from the conditions of this License. If you cannot 379 | distribute so as to satisfy simultaneously your obligations under this 380 | License and any other pertinent obligations, then as a consequence you 381 | may not distribute the Library at all. For example, if a patent 382 | license would not permit royalty-free redistribution of the Library by 383 | all those who receive copies directly or indirectly through you, then 384 | the only way you could satisfy both it and this License would be to 385 | refrain entirely from distribution of the Library. 386 | 387 | If any portion of this section is held invalid or unenforceable under any 388 | particular circumstance, the balance of the section is intended to apply, 389 | and the section as a whole is intended to apply in other circumstances. 390 | 391 | It is not the purpose of this section to induce you to infringe any 392 | patents or other property right claims or to contest validity of any 393 | such claims; this section has the sole purpose of protecting the 394 | integrity of the free software distribution system which is 395 | implemented by public license practices. Many people have made 396 | generous contributions to the wide range of software distributed 397 | through that system in reliance on consistent application of that 398 | system; it is up to the author/donor to decide if he or she is willing 399 | to distribute software through any other system and a licensee cannot 400 | impose that choice. 401 | 402 | This section is intended to make thoroughly clear what is believed to 403 | be a consequence of the rest of this License. 404 | 405 | 12. If the distribution and/or use of the Library is restricted in 406 | certain countries either by patents or by copyrighted interfaces, the 407 | original copyright holder who places the Library under this License may add 408 | an explicit geographical distribution limitation excluding those countries, 409 | so that distribution is permitted only in or among countries not thus 410 | excluded. In such case, this License incorporates the limitation as if 411 | written in the body of this License. 412 | 413 | 13. The Free Software Foundation may publish revised and/or new 414 | versions of the Lesser General Public License from time to time. 415 | Such new versions will be similar in spirit to the present version, 416 | but may differ in detail to address new problems or concerns. 417 | 418 | Each version is given a distinguishing version number. If the Library 419 | specifies a version number of this License which applies to it and 420 | "any later version", you have the option of following the terms and 421 | conditions either of that version or of any later version published by 422 | the Free Software Foundation. If the Library does not specify a 423 | license version number, you may choose any version ever published by 424 | the Free Software Foundation. 425 | 426 | 14. If you wish to incorporate parts of the Library into other free 427 | programs whose distribution conditions are incompatible with these, 428 | write to the author to ask for permission. For software which is 429 | copyrighted by the Free Software Foundation, write to the Free 430 | Software Foundation; we sometimes make exceptions for this. Our 431 | decision will be guided by the two goals of preserving the free status 432 | of all derivatives of our free software and of promoting the sharing 433 | and reuse of software generally. 434 | 435 | NO WARRANTY 436 | 437 | 15. BECAUSE THE LIBRARY IS LICENSED FREE OF CHARGE, THERE IS NO 438 | WARRANTY FOR THE LIBRARY, TO THE EXTENT PERMITTED BY APPLICABLE LAW. 439 | EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR 440 | OTHER PARTIES PROVIDE THE LIBRARY "AS IS" WITHOUT WARRANTY OF ANY 441 | KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE 442 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 443 | PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE 444 | LIBRARY IS WITH YOU. SHOULD THE LIBRARY PROVE DEFECTIVE, YOU ASSUME 445 | THE COST OF ALL NECESSARY SERVICING, REPAIR OR CORRECTION. 446 | 447 | 16. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN 448 | WRITING WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY 449 | AND/OR REDISTRIBUTE THE LIBRARY AS PERMITTED ABOVE, BE LIABLE TO YOU 450 | FOR DAMAGES, INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR 451 | CONSEQUENTIAL DAMAGES ARISING OUT OF THE USE OR INABILITY TO USE THE 452 | LIBRARY (INCLUDING BUT NOT LIMITED TO LOSS OF DATA OR DATA BEING 453 | RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD PARTIES OR A 454 | FAILURE OF THE LIBRARY TO OPERATE WITH ANY OTHER SOFTWARE), EVEN IF 455 | SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH 456 | DAMAGES. 457 | 458 | END OF TERMS AND CONDITIONS 459 | 460 | How to Apply These Terms to Your New Libraries 461 | 462 | If you develop a new library, and you want it to be of the greatest 463 | possible use to the public, we recommend making it free software that 464 | everyone can redistribute and change. You can do so by permitting 465 | redistribution under these terms (or, alternatively, under the terms of the 466 | ordinary General Public License). 467 | 468 | To apply these terms, attach the following notices to the library. It is 469 | safest to attach them to the start of each source file to most effectively 470 | convey the exclusion of warranty; and each file should have at least the 471 | "copyright" line and a pointer to where the full notice is found. 472 | 473 | {description} 474 | Copyright (C) {year} {fullname} 475 | 476 | This library is free software; you can redistribute it and/or 477 | modify it under the terms of the GNU Lesser General Public 478 | License as published by the Free Software Foundation; either 479 | version 2.1 of the License, or (at your option) any later version. 480 | 481 | This library is distributed in the hope that it will be useful, 482 | but WITHOUT ANY WARRANTY; without even the implied warranty of 483 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU 484 | Lesser General Public License for more details. 485 | 486 | You should have received a copy of the GNU Lesser General Public 487 | License along with this library; if not, write to the Free Software 488 | Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 489 | USA 490 | 491 | Also add information on how to contact you by electronic and paper mail. 492 | 493 | You should also get your employer (if you work as a programmer) or your 494 | school, if any, to sign a "copyright disclaimer" for the library, if 495 | necessary. Here is a sample; alter the names: 496 | 497 | Yoyodyne, Inc., hereby disclaims all copyright interest in the 498 | library `Frob' (a library for tweaking knobs) written by James Random 499 | Hacker. 500 | 501 | {signature of Ty Coon}, 1 April 1990 502 | Ty Coon, President of Vice 503 | 504 | That's all there is to it! 505 | -------------------------------------------------------------------------------- /LICENSE-MIT: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 jquery-form 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # jQuery Form [![Build Status](https://travis-ci.org/jquery-form/form.svg?branch=master)](https://travis-ci.org/jquery-form/form) 2 | 3 | ## Overview 4 | The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. The main methods, ajaxForm and ajaxSubmit, gather information from the form element to determine how to manage the submit process. Both of these methods support numerous options which allow you to have full control over how the data is submitted. 5 | 6 | No special markup is needed, just a normal form. Submitting a form with AJAX doesn't get any easier than this! 7 | 8 | ## Community 9 | Want to contribute to jQuery Form? Awesome! See [CONTRIBUTING](CONTRIBUTING.md) for more information. 10 | 11 | ### Code of Conduct 12 | Please note that this project is released with a [Contributor Code of Conduct](CODE_OF_CONDUCT.md) to ensure that this project is a welcoming place for **everyone** to contribute to. By participating in this project you agree to abide by its terms. 13 | 14 | ### Pull Requests Needed 15 | #### Enhancements needed to to be fully compatible with jQuery 3 16 | jQuery 3 is removing a lot of features that have been deprecated for a long time. Some of these are still in use by jQuery Form. 17 | Pull requests and assistance in updating jQuery Form to be compatible with jQuery 3 are greatly appreciated. 18 | See [issue #544](https://github.com/jquery-form/form/issues/544) for more information. 19 | 20 | ## Compatibility 21 | * Requires jQuery 1.7.2 or later. 22 | * Compatible with jQuery 2. 23 | * Partially compatible with jQuery 3. 24 | * **Not** compatible with jQuery 3 Slim. ([issue #544](https://github.com/jquery-form/form/issues/544)) 25 | 26 | ## Download 27 | * **Development:** [src/jquery.form.js 28 | ](https://github.com/jquery-form/form/blob/master/src/jquery.form.js) 29 | * **Production/Minified:** [dist/jquery.form.min.js 30 | ](https://github.com/jquery-form/form/blob/master/dist/jquery.form.min.js) 31 | 32 | ### CDN 33 | ```html 34 | 35 | ``` 36 | or 37 | ```html 38 | 39 | ``` 40 | 41 | --- 42 | 43 | ## API 44 | 45 | ### jqXHR 46 | The jqXHR object is stored in element data-cache with the jqxhr key after each ajaxSubmit 47 | call. It can be accessed like this: 48 | 49 | ````javascript 50 | var form = $('#myForm').ajaxSubmit({ /* options */ }); 51 | var xhr = form.data('jqxhr'); 52 | 53 | xhr.done(function() { 54 | ... 55 | }); 56 | ```` 57 | 58 | ### ajaxForm( options ) 59 | Prepares a form to be submitted via AJAX by adding all of the necessary event listeners. It does **not** submit the form. Use `ajaxForm` in your document's `ready` function to prepare existing forms for AJAX submission, or with the `delegation` option to handle forms not yet added to the DOM. 60 | Use ajaxForm when you want the plugin to manage all the event binding for you. 61 | 62 | ````javascript 63 | // prepare all forms for ajax submission 64 | $('form').ajaxForm({ 65 | target: '#myResultsDiv' 66 | }); 67 | ```` 68 | 69 | ### ajaxSubmit( options ) 70 | Immediately submits the form via AJAX. In the most common use case this is invoked in response to the user clicking a submit button on the form. 71 | Use ajaxSubmit if you want to bind your own submit handler to the form. 72 | 73 | ````javascript 74 | // bind submit handler to form 75 | $('form').on('submit', function(e) { 76 | e.preventDefault(); // prevent native submit 77 | $(this).ajaxSubmit({ 78 | target: '#myResultsDiv' 79 | }) 80 | }); 81 | ```` 82 | 83 | --- 84 | 85 | ## Options 86 | **Note:** All standard [$.ajax](http://api.jquery.com/jQuery.ajax) options can be used. 87 | 88 | ### beforeSerialize 89 | Callback function invoked before form serialization. Provides an opportunity to manipulate the form before its values are retrieved. Returning `false` from the callback will prevent the form from being submitted. The callback is invoked with two arguments: the jQuery wrapped form object and the options object. 90 | 91 | ````javascript 92 | beforeSerialize: function($form, options) { 93 | // return false to cancel submit 94 | } 95 | ```` 96 | 97 | ### beforeSubmit 98 | Callback function invoked before form submission. Returning `false` from the callback will prevent the form from being submitted. The callback is invoked with three arguments: the form data in array format, the jQuery wrapped form object, and the options object. 99 | 100 | ````javascript 101 | beforeSubmit: function(arr, $form, options) { 102 | // form data array is an array of objects with name and value properties 103 | // [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ] 104 | // return false to cancel submit 105 | } 106 | ```` 107 | 108 | ### beforeFormUnbind 109 | Callback function invoked before form events unbind and bind again. Provides an opportunity to manipulate the form before events will be remounted. The callback is invoked with two arguments: the jQuery wrapped form object and the options object. 110 | 111 | ````javascript 112 | beforeFormUnbind: function($form, options) { 113 | // your callback code 114 | } 115 | ```` 116 | 117 | ### filtering 118 | Callback function invoked before processing fields. This provides a way to filter elements. 119 | 120 | ````javascript 121 | filtering: function(el, index) { 122 | if ( !$(el).hasClass('ignore') ) { 123 | return el; 124 | } 125 | } 126 | ```` 127 | 128 | ### clearForm 129 | Boolean flag indicating whether the form should be cleared if the submit is successful 130 | 131 | ### data 132 | An object containing extra data that should be submitted along with the form. 133 | 134 | ```` 135 | data: { key1: 'value1', key2: 'value2' } 136 | ```` 137 | 138 | ### dataType 139 | Expected data type of the response. One of: null, 'xml', 'script', or 'json'. The dataType option provides a means for specifying how the server response should be handled. This maps directly to jQuery's dataType method. The following values are supported: 140 | 141 | * 'xml': server response is treated as XML and the 'success' callback method, if specified, will be passed the responseXML value 142 | * 'json': server response will be evaluated and passed to the 'success' callback, if specified 143 | * 'script': server response is evaluated in the global context 144 | 145 | ### delegation 146 | true to enable support for event delegation 147 | *requires jQuery v1.7+* 148 | 149 | ````javascript 150 | // prepare all existing and future forms for ajax submission 151 | $('form').ajaxForm({ 152 | delegation: true 153 | }); 154 | ```` 155 | 156 | ### error 157 | **Deprecated** 158 | Callback function to be invoked upon error. 159 | 160 | ### forceSync 161 | Only applicable when explicity using the iframe option or when uploading files on browsers that don't support XHR2. 162 | Set to `true` to remove the short delay before posting form when uploading files. The delay is used to allow the browser to render DOM updates before performing a native form submit. This improves usability when displaying notifications to the user, such as "Please Wait..." 163 | 164 | ### iframe 165 | Boolean flag indicating whether the form should *always* target the server response to an iframe instead of leveraging XHR when possible. 166 | 167 | ### iframeSrc 168 | String value that should be used for the iframe's src attribute when an iframe is used. 169 | 170 | ### iframeTarget 171 | Identifies the iframe element to be used as the response target for file uploads. By default, the plugin will create a temporary iframe element to capture the response when uploading files. This option allows you to use an existing iframe if you wish. When using this option the plugin will not attempt handling the response from the server. 172 | 173 | ### method 174 | The HTTP method to use for the request (e.g. 'POST', 'GET', 'PUT'). 175 | 176 | ### replaceTarget 177 | Optionally used along with the target option. Set to true if the target should be replaced or false if only the target contents should be replaced. 178 | 179 | ### resetForm 180 | Boolean flag indicating whether the form should be reset if the submit is successful 181 | 182 | ### semantic 183 | Boolean flag indicating whether data must be submitted in strict semantic order (slower). Note that the normal form serialization is done in semantic order except for input elements of `type="image"`. You should only set the semantic option to true if your server has strict semantic requirements and your form contains an input element of `type="image"`. 184 | 185 | ### success 186 | **Deprecated** 187 | Callback function to be invoked after the form has been submitted. If a 'success' callback function is provided it is invoked after the response has been returned from the server. It is passed the following standard jQuery arguments: 188 | 189 | 1. `data`, formatted according to the dataType parameter or the dataFilter callback function, if specified 190 | 2. `textStatus`, string 191 | 3. `jqXHR`, object 192 | 4. `$form` jQuery object containing form element 193 | 194 | ### target 195 | Identifies the element(s) in the page to be updated with the server response. This value may be specified as a jQuery selection string, a jQuery object, or a DOM element. 196 | 197 | ### type 198 | The HTTP method to use for the request (e.g. 'POST', 'GET', 'PUT'). 199 | An alias for `method` option. Overridden by the `method` value if both are present. 200 | 201 | ### uploadProgress 202 | Callback function to be invoked with upload progress information (if supported by the browser). The callback is passed the following arguments: 203 | 204 | 1. event; the browser event 205 | 2. position (integer) 206 | 3. total (integer) 207 | 4. percentComplete (integer) 208 | 209 | ### url 210 | URL to which the form data will be submitted. 211 | 212 | --- 213 | 214 | ## Utility Methods 215 | ### formSerialize 216 | Serializes the form into a query string. This method will return a string in the format: `name1=value1&name2=value2` 217 | 218 | ````javascript 219 | var queryString = $('#myFormId').formSerialize(); 220 | ```` 221 | 222 | ### fieldSerialize 223 | Serializes field elements into a query string. This is handy when you need to serialize only part of a form. This method will return a string in the format: `name1=value1&name2=value2` 224 | 225 | ````javascript 226 | var queryString = $('#myFormId .specialFields').fieldSerialize(); 227 | ```` 228 | 229 | ### fieldValue 230 | Returns the value(s) of the element(s) in the matched set in an array. This method always returns an array. If no valid value can be determined the array will be empty, otherwise it will contain one or more values. 231 | 232 | ### resetForm 233 | Resets the form to its original state by invoking the form element's native DOM method. 234 | 235 | ### clearForm 236 | Clears the form elements. This method empties all of the text inputs, password inputs and textarea elements, clears the selection in any select elements, and unchecks all radio and checkbox inputs. It does *not* clear hidden field values. 237 | 238 | ### clearFields 239 | Clears selected field elements. This is handy when you need to clear only a part of the form. 240 | 241 | --- 242 | 243 | ## File Uploads 244 | The Form Plugin supports the use of [XMLHttpRequest Level 2]("http://www.w3.org/TR/XMLHttpRequest/") and [FormData](https://developer.mozilla.org/en/XMLHttpRequest/FormData) objects on browsers that support these features. As of today (March 2012) that includes Chrome, Safari, and Firefox. On these browsers (and future Opera and IE10) files uploads will occur seamlessly through the XHR object and progress updates are available as the upload proceeds. For older browsers, a fallback technology is used which involves iframes. [More Info](http://malsup.com/jquery/form/#file-upload) 245 | 246 | --- 247 | 248 | ## Contributors 249 | This project has transferred from [github.com/malsup/form](https://github.com/malsup/form/), courtesy of [Mike Alsup](https://github.com/malsup). 250 | See [CONTRIBUTORS](CONTRIBUTORS.md) for details. 251 | 252 | ## License 253 | 254 | This project is dual-licensed under the LGPLv2.1 (or later) or MIT licenses: 255 | 256 | * [GNU Lesser General Public License v2.1](LICENSE) 257 | * [MIT](LICENSE-MIT) 258 | 259 | --- 260 | 261 | Additional documentation and examples for version 3.51- at: [http://malsup.com/jquery/form/](http://malsup.com/jquery/form/) 262 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | theme: jekyll-theme-tactile -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-form", 3 | "description": "The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX.", 4 | "main": "src/jquery.form.js", 5 | "moduleType": [ "globals", "amd", "node" ], 6 | "license": "(LGPL-2.1+ OR MIT)", 7 | "ignore": [ 8 | "README.md", 9 | "composer.json", 10 | "package.json" 11 | ], 12 | "keywords": [ "jquery", "ajax", "jquery-plugin", "json", "json-form", "html-form", "form", "jquery-form" ], 13 | "authors": [ 14 | { "name": "Kevin Morris" }, 15 | { "name": "Mike Alsup" } 16 | ], 17 | "homepage": "https://github.com/jquery-form/form", 18 | "repository": { 19 | "type": "git", 20 | "url": "https://github.com/jquery-form/form.git" 21 | }, 22 | "dependencies": { 23 | "jquery": ">=1.7.2" 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /composer.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-form/form", 3 | "description": "The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX.", 4 | "keywords": [ "jquery", "ajax", "jquery-plugin", "json", "json-form", "html-form", "form", "jquery-form" ], 5 | "homepage": "https://github.com/jquery-form/form", 6 | "license": "(LGPL-2.1+ OR MIT)", 7 | "authors": [ 8 | { "name": "Kevin Morris" }, 9 | { "name": "Mike Alsup" } 10 | ], 11 | "support": { 12 | "issues": "https://github.com/jquery-form/form/issues" 13 | }, 14 | "require": { 15 | "components/jquery": ">=1.7.2" 16 | }, 17 | "extra": { 18 | "component": { 19 | "scripts": [ 20 | "src/jquery.form.js" 21 | ], 22 | "shim": { 23 | "deps": [ 24 | "jquery" 25 | ] 26 | } 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /dist/jquery.form.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * jQuery Form Plugin 3 | * version: 4.3.0 4 | * Requires jQuery v1.7.2 or later 5 | * Project repository: https://github.com/jquery-form/form 6 | 7 | * Copyright 2017 Kevin Morris 8 | * Copyright 2006 M. Alsup 9 | 10 | * Dual licensed under the LGPL-2.1+ or MIT licenses 11 | * https://github.com/jquery-form/form#license 12 | 13 | * This library is free software; you can redistribute it and/or 14 | * modify it under the terms of the GNU Lesser General Public 15 | * License as published by the Free Software Foundation; either 16 | * version 2.1 of the License, or (at your option) any later version. 17 | * This library is distributed in the hope that it will be useful, 18 | * but WITHOUT ANY WARRANTY; without even the implied warranty of 19 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU 20 | * Lesser General Public License for more details. 21 | */ 22 | !function(r){"function"==typeof define&&define.amd?define(["jquery"],r):"object"==typeof module&&module.exports?module.exports=function(e,t){return void 0===t&&(t="undefined"!=typeof window?require("jquery"):require("jquery")(e)),r(t),t}:r(jQuery)}(function(q){"use strict";var m=/\r?\n/g,S={};S.fileapi=void 0!==q('').get(0).files,S.formdata=void 0!==window.FormData;var _=!!q.fn.prop;function o(e){var t=e.data;e.isDefaultPrevented()||(e.preventDefault(),q(e.target).closest("form").ajaxSubmit(t))}function i(e){var t=e.target,r=q(t);if(!r.is("[type=submit],[type=image]")){var a=r.closest("[type=submit]");if(0===a.length)return;t=a[0]}var n,o=t.form;"image"===(o.clk=t).type&&(void 0!==e.offsetX?(o.clk_x=e.offsetX,o.clk_y=e.offsetY):"function"==typeof q.fn.offset?(n=r.offset(),o.clk_x=e.pageX-n.left,o.clk_y=e.pageY-n.top):(o.clk_x=e.pageX-t.offsetLeft,o.clk_y=e.pageY-t.offsetTop)),setTimeout(function(){o.clk=o.clk_x=o.clk_y=null},100)}function N(){var e;q.fn.ajaxSubmit.debug&&(e="[jquery.form] "+Array.prototype.join.call(arguments,""),window.console&&window.console.log?window.console.log(e):window.opera&&window.opera.postError&&window.opera.postError(e))}q.fn.attr2=function(){if(!_)return this.attr.apply(this,arguments);var e=this.prop.apply(this,arguments);return e&&e.jquery||"string"==typeof e?e:this.attr.apply(this,arguments)},q.fn.ajaxSubmit=function(M,e,t,r){if(!this.length)return N("ajaxSubmit: skipping submit process - no element selected"),this;var O,a,n,o,X=this;"function"==typeof M?M={success:M}:"string"==typeof M||!1===M&&0',s)).css({position:"absolute",top:"-1000px",left:"-1000px"}),m=d[0],p={aborted:0,responseText:null,responseXML:null,status:0,statusText:"n/a",getAllResponseHeaders:function(){},getResponseHeader:function(){},setRequestHeader:function(){},abort:function(e){var t="timeout"===e?"timeout":"aborted";N("aborting upload... "+t),this.aborted=1;try{m.contentWindow.document.execCommand&&m.contentWindow.document.execCommand("Stop")}catch(e){}d.attr("src",l.iframeSrc),p.error=t,l.error&&l.error.call(l.context,p,t,e),f&&q.event.trigger("ajaxError",[p,l,t]),l.complete&&l.complete.call(l.context,p,t)}},(f=l.global)&&0==q.active++&&q.event.trigger("ajaxStart"),f&&q.event.trigger("ajaxSend",[p,l]),l.beforeSend&&!1===l.beforeSend.call(l.context,p,l))return l.global&&q.active--,g.reject(),g;if(p.aborted)return g.reject(),g;(a=i.clk)&&(n=a.name)&&!a.disabled&&(l.extraData=l.extraData||{},l.extraData[n]=a.value,"image"===a.type&&(l.extraData[n+".x"]=i.clk_x,l.extraData[n+".y"]=i.clk_y));var x=1,y=2;function b(t){var r=null;try{t.contentWindow&&(r=t.contentWindow.document)}catch(e){N("cannot get iframe.contentWindow document: "+e)}if(r)return r;try{r=t.contentDocument?t.contentDocument:t.document}catch(e){N("cannot get iframe.contentDocument: "+e),r=t.document}return r}var c=q("meta[name=csrf-token]").attr("content"),T=q("meta[name=csrf-param]").attr("content");function j(){var e=X.attr2("target"),t=X.attr2("action"),r=X.attr("enctype")||X.attr("encoding")||"multipart/form-data";i.setAttribute("target",o),O&&!/post/i.test(O)||i.setAttribute("method","POST"),t!==l.url&&i.setAttribute("action",l.url),l.skipEncodingOverride||O&&!/post/i.test(O)||X.attr({encoding:"multipart/form-data",enctype:"multipart/form-data"}),l.timeout&&(v=setTimeout(function(){h=!0,A(x)},l.timeout));var a=[];try{if(l.extraData)for(var n in l.extraData)l.extraData.hasOwnProperty(n)&&(q.isPlainObject(l.extraData[n])&&l.extraData[n].hasOwnProperty("name")&&l.extraData[n].hasOwnProperty("value")?a.push(q('',s).val(l.extraData[n].value).appendTo(i)[0]):a.push(q('',s).val(l.extraData[n]).appendTo(i)[0]));l.iframeTarget||d.appendTo(u),m.attachEvent?m.attachEvent("onload",A):m.addEventListener("load",A,!1),setTimeout(function e(){try{var t=b(m).readyState;N("state = "+t),t&&"uninitialized"===t.toLowerCase()&&setTimeout(e,50)}catch(e){N("Server abort: ",e," (",e.name,")"),A(y),v&&clearTimeout(v),v=void 0}},15);try{i.submit()}catch(e){document.createElement("form").submit.apply(i)}}finally{i.setAttribute("action",t),i.setAttribute("enctype",r),e?i.setAttribute("target",e):X.removeAttr("target"),q(a).remove()}}T&&c&&(l.extraData=l.extraData||{},l.extraData[T]=c),l.forceSync?j():setTimeout(j,10);var w,S,k,D=50;function A(e){if(!p.aborted&&!k){if((S=b(m))||(N("cannot access response document"),e=y),e===x&&p)return p.abort("timeout"),void g.reject(p,"timeout");if(e===y&&p)return p.abort("server abort"),void g.reject(p,"error","server abort");if(S&&S.location.href!==l.iframeSrc||h){m.detachEvent?m.detachEvent("onload",A):m.removeEventListener("load",A,!1);var t,r="success";try{if(h)throw"timeout";var a="xml"===l.dataType||S.XMLDocument||q.isXMLDoc(S);if(N("isXml="+a),!a&&window.opera&&(null===S.body||!S.body.innerHTML)&&--D)return N("requeing onLoad callback, DOM not available"),void setTimeout(A,250);var n=S.body?S.body:S.documentElement;p.responseText=n?n.innerHTML:null,p.responseXML=S.XMLDocument?S.XMLDocument:S,a&&(l.dataType="xml"),p.getResponseHeader=function(e){return{"content-type":l.dataType}[e.toLowerCase()]},n&&(p.status=Number(n.getAttribute("status"))||p.status,p.statusText=n.getAttribute("statusText")||p.statusText);var o,i,s,u=(l.dataType||"").toLowerCase(),c=/(json|script|text)/.test(u);c||l.textarea?(o=S.getElementsByTagName("textarea")[0])?(p.responseText=o.value,p.status=Number(o.getAttribute("status"))||p.status,p.statusText=o.getAttribute("statusText")||p.statusText):c&&(i=S.getElementsByTagName("pre")[0],s=S.getElementsByTagName("body")[0],i?p.responseText=i.textContent?i.textContent:i.innerText:s&&(p.responseText=s.textContent?s.textContent:s.innerText)):"xml"===u&&!p.responseXML&&p.responseText&&(p.responseXML=F(p.responseText));try{w=E(p,u,l)}catch(e){r="parsererror",p.error=t=e||r}}catch(e){N("error caught: ",e),r="error",p.error=t=e||r}p.aborted&&(N("upload aborted"),r=null),p.status&&(r=200<=p.status&&p.status<300||304===p.status?"success":"error"),"success"===r?(l.success&&l.success.call(l.context,w,"success",p),g.resolve(p.responseText,"success",p),f&&q.event.trigger("ajaxSuccess",[p,l])):r&&(void 0===t&&(t=p.statusText),l.error&&l.error.call(l.context,p,r,t),g.reject(p,"error",t),f&&q.event.trigger("ajaxError",[p,l,t])),f&&q.event.trigger("ajaxComplete",[p,l]),f&&!--q.active&&q.event.trigger("ajaxStop"),l.complete&&l.complete.call(l.context,p,r),k=!0,l.timeout&&clearTimeout(v),setTimeout(function(){l.iframeTarget?d.attr("src",l.iframeSrc):d.remove(),p.responseXML=null},100)}}}var F=q.parseXML||function(e,t){return window.ActiveXObject?((t=new ActiveXObject("Microsoft.XMLDOM")).async="false",t.loadXML(e)):t=(new DOMParser).parseFromString(e,"text/xml"),t&&t.documentElement&&"parsererror"!==t.documentElement.nodeName?t:null},L=q.parseJSON||function(e){return window.eval("("+e+")")},E=function(e,t,r){var a=e.getResponseHeader("content-type")||"",n=("xml"===t||!t)&&0<=a.indexOf("xml"),o=n?e.responseXML:e.responseText;return n&&"parsererror"===o.documentElement.nodeName&&q.error&&q.error("parsererror"),r&&r.dataFilter&&(o=r.dataFilter(o,t)),"string"==typeof o&&(("json"===t||!t)&&0<=a.indexOf("json")?o=L(o):("script"===t||!t)&&0<=a.indexOf("javascript")&&q.globalEval(o)),o};return g}},q.fn.ajaxForm=function(e,t,r,a){if(("string"==typeof e||!1===e&&0 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 12 | {{ site.title | default: site.github.repository_name }} by {{ site.github.owner_name }} 13 | 14 | 15 | 16 |
17 |
18 | 19 |
20 |

{{ site.title | default: site.github.repository_name }}

21 |

{{ site.description | default: site.github.project_tagline }}

22 |
23 | 24 |
25 | {% if site.show_downloads %} 26 | Download .zip 27 | Download .tar.gz 28 | {% endif %} 29 | View on GitHub 30 |
31 | 32 |
33 | 34 | 45 | 46 |
47 | 48 |
49 | {{ content }} 50 |
51 | 52 | 58 | 59 |
60 |
61 | 62 | {% if site.google_analytics %} 63 | 71 | {% endif %} 72 | 73 | 74 | -------------------------------------------------------------------------------- /docs/_sass/style.scss: -------------------------------------------------------------------------------- 1 | .inner { 2 | width: 700px; 3 | } 4 | nav { 5 | margin: 0; 6 | padding: 0; 7 | text-align: center; 8 | } 9 | nav ul { 10 | list-style: none; 11 | } 12 | nav li { 13 | display: inline; 14 | } 15 | nav li.active { 16 | font-weight: bold; 17 | } 18 | nav a { 19 | display: inline-block; 20 | padding: 2px 5px; 21 | } 22 | -------------------------------------------------------------------------------- /docs/api.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## API 5 | The Form Plugin API provides several methods that allow you to easily manage form data and form submission. 6 | 7 | ### ajaxForm 8 | Prepares a form to be submitted via AJAX by adding all of the necessary event listeners. It does **not** submit the form. Use `ajaxForm` in your document's `ready` function to prepare your form(s) for AJAX submission. `ajaxForm` takes zero or one argument. The single argument can be either a callback function or an [Options Object](http://malsup.com/jquery/form/#options-object). 9 | Chainable: Yes. 10 | 11 | **Note:** You can pass any of the standard [$.ajax settings](https://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings) to ajaxForm 12 | 13 | ```javascript 14 | $(function() { 15 | $('#myFormId').ajaxForm(); 16 | }); 17 | ``` 18 | 19 | 20 | ### ajaxSubmit 21 | Immediately submits the form via AJAX. In the most common use case this is invoked in response to the user clicking a submit button on the form. `ajaxSubmit` takes zero or one argument. The single argument can be either a callback function or an [Options Object](http://malsup.com/jquery/form/#options-object). 22 | Chainable: Yes. 23 | 24 | **Note:** You can pass any of the standard [$.ajax settings](https://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings) to ajaxSubmit. 25 | 26 | ```javascript 27 | // attach handler to form's submit event 28 | $('#myFormId').submit(function() { 29 | // submit the form 30 | $(this).ajaxSubmit(); 31 | // return false to prevent normal browser submit and page navigation 32 | return false; 33 | }); 34 | ``` 35 | 36 | 37 | ### formSerialize 38 | Serializes the form into a query string. This method will return a string in the format: `name1=value1&name2=value2` 39 | Chainable: No, this method returns a String. 40 | 41 | ```javascript 42 | var queryString = $('#myFormId').formSerialize(); 43 | // the data could now be submitted using $.get, $.post, $.ajax, etc 44 | $.post('myscript.php', queryString); 45 | ``` 46 | 47 | 48 | ### fieldSerialize 49 | Serializes field elements into a query string. This is handy when you need to serialize only part of a form. This method will return a string in the format: `name1=value1&name2=value2` 50 | Chainable: No, this method returns a String. 51 | 52 | ```javascript 53 | var queryString = $('#myFormId .specialFields').fieldSerialize(); 54 | ``` 55 | 56 | 57 | ### fieldValue 58 | Returns the value(s) of the element(s) in the matched set in an array. As of version .91, this method **always** returns an array. If no valid value can be determined the array will be empty, otherwise it will contain one or more values. 59 | Chainable: No, this method returns an array. 60 | 61 | ```javascript 62 | // get the value of the password input 63 | var value = $('#myFormId :password').fieldValue(); 64 | alert('The password is: ' + value[0]); 65 | ``` 66 | 67 | 68 | ### resetForm 69 | Resets the form to its original state by invoking the form element's native DOM method. 70 | Chainable: Yes. 71 | 72 | ```javascript 73 | $('#myFormId').resetForm(); 74 | ``` 75 | 76 | 77 | ### clearForm 78 | Clears the form elements. This method emptys all of the text inputs, password inputs and textarea elements, clears the selection in any select elements, and unchecks all radio and checkbox inputs. 79 | Chainable: Yes. 80 | 81 | ```javascript 82 | $('#myFormId').clearForm(); 83 | ``` 84 | 85 | 86 | ### clearFields 87 | Clears field elements. This is handy when you need to clear only a part of the form. 88 | Chainable: Yes. 89 | 90 | ```javascript 91 | $('#myFormId .specialFields').clearFields(); 92 | ``` 93 | -------------------------------------------------------------------------------- /docs/assets/css/style.scss: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | @import "jekyll-theme-tactile"; 5 | @import "style"; 6 | -------------------------------------------------------------------------------- /docs/examples.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## Examples 5 | 6 | ### ajaxForm 7 | 8 | The following code controls the HTML form beneath it. It uses `ajaxForm` to bind the form and demonstrates how to use pre- and post-submit callbacks. 9 | 10 | ```javascript 11 | // prepare the form when the DOM is ready 12 | $(document).ready(function() { 13 | var options = { 14 | target: '#output1', // target element(s) to be updated with server response 15 | beforeSubmit: showRequest, // pre-submit callback 16 | success: showResponse // post-submit callback 17 | 18 | // other available options: 19 | //url: url // override for form's 'action' attribute 20 | //type: type // 'get' or 'post', override for form's 'method' attribute 21 | //dataType: null // 'xml', 'script', or 'json' (expected server response type) 22 | //clearForm: true // clear all form fields after successful submit 23 | //resetForm: true // reset the form after successful submit 24 | 25 | // $.ajax options can be used here too, for example: 26 | //timeout: 3000 27 | }; 28 | 29 | // bind form using 'ajaxForm' 30 | $('#myForm1').ajaxForm(options); 31 | }); 32 | 33 | // pre-submit callback 34 | function showRequest(formData, jqForm, options) { 35 | // formData is an array; here we use $.param to convert it to a string to display it 36 | // but the form plugin does this for you automatically when it submits the data 37 | var queryString = $.param(formData); 38 | 39 | // jqForm is a jQuery object encapsulating the form element. To access the 40 | // DOM element for the form do this: 41 | // var formElement = jqForm[0]; 42 | 43 | alert('About to submit: \n\n' + queryString); 44 | 45 | // here we could return false to prevent the form from being submitted; 46 | // returning anything other than false will allow the form submit to continue 47 | return true; 48 | } 49 | 50 | // post-submit callback 51 | function showResponse(responseText, statusText, xhr, $form) { 52 | // for normal html responses, the first argument to the success callback 53 | // is the XMLHttpRequest object's responseText property 54 | 55 | // if the ajaxForm method was passed an Options Object with the dataType 56 | // property set to 'xml' then the first argument to the success callback 57 | // is the XMLHttpRequest object's responseXML property 58 | 59 | // if the ajaxForm method was passed an Options Object with the dataType 60 | // property set to 'json' then the first argument to the success callback 61 | // is the json data object returned by the server 62 | 63 | alert('status: ' + statusText + '\n\nresponseText: \n' + responseText + 64 | '\n\nThe output div should have already been updated with the responseText.'); 65 | } 66 | ``` 67 | 68 |
69 | 70 | 71 | 72 | 73 | 85 | 90 | 102 | 107 | 112 | 113 |
Name:
Password:
Multiple:
Single:
Single2:
Check: 103 | 104 | 105 | 106 |
Radio: 108 | 109 | 110 | 111 |
Text:
114 | 115 | 116 | 117 | 118 | 119 | 120 |
121 | 122 | #### Output Div (#output1): 123 |
AJAX response will replace this content.
124 | 125 | --- 126 | 127 | ### ajaxSubmit 128 | 129 | The following code controls the HTML form beneath it. It uses `ajaxSubmit` to submit the form. 130 | ```javascript 131 | // prepare the form when the DOM is ready 132 | $(document).ready(function() { 133 | var options = { 134 | target: '#output2', // target element(s) to be updated with server response 135 | beforeSubmit: showRequest, // pre-submit callback 136 | success: showResponse // post-submit callback 137 | 138 | // other available options: 139 | //url: url // override for form's 'action' attribute 140 | //type: type // 'get' or 'post', override for form's 'method' attribute 141 | //dataType: null // 'xml', 'script', or 'json' (expected server response type) 142 | //clearForm: true // clear all form fields after successful submit 143 | //resetForm: true // reset the form after successful submit 144 | 145 | // $.ajax options can be used here too, for example: 146 | //timeout: 3000 147 | }; 148 | 149 | // bind to the form's submit event 150 | $('#myForm2').submit(function() { 151 | // inside event callbacks 'this' is the DOM element so we first 152 | // wrap it in a jQuery object and then invoke ajaxSubmit 153 | $(this).ajaxSubmit(options); 154 | 155 | // !!! Important !!! 156 | // always return false to prevent standard browser submit and page navigation 157 | return false; 158 | }); 159 | }); 160 | 161 | // pre-submit callback 162 | function showRequest(formData, jqForm, options) { 163 | // formData is an array; here we use $.param to convert it to a string to display it 164 | // but the form plugin does this for you automatically when it submits the data 165 | var queryString = $.param(formData); 166 | 167 | // jqForm is a jQuery object encapsulating the form element. To access the 168 | // DOM element for the form do this: 169 | // var formElement = jqForm[0]; 170 | 171 | alert('About to submit: \n\n' + queryString); 172 | 173 | // here we could return false to prevent the form from being submitted; 174 | // returning anything other than false will allow the form submit to continue 175 | return true; 176 | } 177 | 178 | // post-submit callback 179 | function showResponse(responseText, statusText, xhr, $form) { 180 | // for normal html responses, the first argument to the success callback 181 | // is the XMLHttpRequest object's responseText property 182 | 183 | // if the ajaxSubmit method was passed an Options Object with the dataType 184 | // property set to 'xml' then the first argument to the success callback 185 | // is the XMLHttpRequest object's responseXML property 186 | 187 | // if the ajaxSubmit method was passed an Options Object with the dataType 188 | // property set to 'json' then the first argument to the success callback 189 | // is the json data object returned by the server 190 | 191 | alert('status: ' + statusText + '\n\nresponseText: \n' + responseText + 192 | '\n\nThe output div should have already been updated with the responseText.'); 193 | } 194 | ``` 195 | 196 |
197 | 198 | 199 | 200 | 201 | 213 | 218 | 230 | 235 | 240 | 241 |
Name:
Password:
Multiple:
Single:
Single2:
Check: 231 | 232 | 233 | 234 |
Radio: 236 | 237 | 238 | 239 |
Text:
242 | 243 | 244 | 245 |
246 | 247 | #### Output Div (#output2): 248 |
AJAX response will replace this content.
249 | 250 | 251 | --- 252 | 253 | ### Validation 254 | This section gives several examples of how form data can be validated before it is sent to the server. The secret is in the `beforeSubmit` option. If this pre-submit callback returns false, the submit process is aborted. 255 | 256 | The following login form is used for each of the examples that follow. Each example will validate that both the *username* and *password* fields have been filled in by the user. 257 | 258 | #### Form Markup: 259 | 260 | ```html 261 |
262 | Username: 263 | Password: 264 | 265 |
266 | ``` 267 | 268 | First, we initialize the form and give it a `beforeSubmit` callback function - this is the validation function. 269 | 270 | ```javascript 271 | // prepare the form when the DOM is ready 272 | $(document).ready(function() { 273 | // bind form using ajaxForm 274 | $('#myForm2').ajaxForm( { beforeSubmit: validate } ); 275 | }); 276 | ``` 277 | 278 | #### Validate Using the `formData` Argument 279 |
280 | Username: 281 | Password: 282 | 283 |
284 | 285 | ```javascript 286 | function validate(formData, jqForm, options) { 287 | // formData is an array of objects representing the name and value of each field 288 | // that will be sent to the server; it takes the following form: 289 | // 290 | // [ 291 | // { name: username, value: valueOfUsernameInput }, 292 | // { name: password, value: valueOfPasswordInput } 293 | // ] 294 | // 295 | // To validate, we can examine the contents of this array to see if the 296 | // username and password fields have values. If either value evaluates 297 | // to false then we return false from this method. 298 | 299 | for (var i=0; i < formData.length; i++) { 300 | if (!formData[i].value) { 301 | alert('Please enter a value for both Username and Password'); 302 | return false; 303 | } 304 | } 305 | alert('Both fields contain values.'); 306 | } 307 | ``` 308 | 309 | #### Validate Using the `jqForm` Argument 310 |
311 | Username: 312 | Password: 313 | 314 |
315 | 316 | ```javascript 317 | function validate(formData, jqForm, options) { 318 | // jqForm is a jQuery object which wraps the form DOM element 319 | // 320 | // To validate, we can access the DOM elements directly and return true 321 | // only if the values of both the username and password fields evaluate 322 | // to true 323 | 324 | var form = jqForm[0]; 325 | if (!form.username.value || !form.password.value) { 326 | alert('Please enter a value for both Username and Password'); 327 | return false; 328 | } 329 | alert('Both fields contain values.'); 330 | } 331 | ``` 332 | 333 | #### Validate Using the `fieldValue` Method 334 |
335 | Username: 336 | Password: 337 | 338 |
339 | 340 | ```javascript 341 | function validate(formData, jqForm, options) { 342 | // fieldValue is a Form Plugin method that can be invoked to find the 343 | // current value of a field 344 | // 345 | // To validate, we can capture the values of both the username and password 346 | // fields and return true only if both evaluate to true 347 | 348 | var usernameValue = $('input[name=username]').fieldValue(); 349 | var passwordValue = $('input[name=password]').fieldValue(); 350 | 351 | // usernameValue and passwordValue are arrays but we can do simple 352 | // "not" tests to see if the arrays are empty 353 | if (!usernameValue[0] || !passwordValue[0]) { 354 | alert('Please enter a value for both Username and Password'); 355 | return false; 356 | } 357 | alert('Both fields contain values.'); 358 | } 359 | ``` 360 | 361 | #### Note 362 | You can find jQuery plugins that deal specifically with field validation on the [jQuery Plugins Page](http://docs.jquery.com/Plugins#Forms). 363 | 364 | 365 | --- 366 | 367 | ### JSON 368 | 369 | This page shows how to handle JSON data returned from the server. The form below submits a message to the server and the server echos it back in JSON format. 370 | 371 | #### Form markup: 372 | 373 | ```html 374 |
375 | Message: 376 | 377 |
378 | ``` 379 | 380 |
381 | Message: 382 | 383 |
384 | 385 | #### Server code in `json-echo.php`: 386 | ```php 387 | 388 | ``` 389 | 390 | #### JavaScript: 391 | 392 | ```javascript 393 | // prepare the form when the DOM is ready 394 | $(document).ready(function() { 395 | // bind form using ajaxForm 396 | $('#jsonForm').ajaxForm({ 397 | // dataType identifies the expected content type of the server response 398 | dataType: 'json', 399 | 400 | // success identifies the function to invoke when the server response 401 | // has been received 402 | success: processJson 403 | }); 404 | }); 405 | ``` 406 | 407 | #### Callback function 408 | 409 | ```javascript 410 | function processJson(data) { 411 | // 'data' is the json object returned from the server 412 | alert(data.message); 413 | } 414 | ``` 415 | 416 | --- 417 | 418 | ### XML 419 | This page shows how to handle XML data returned from the server. The form below submits a message to the server and the server echos it back in XML format. 420 | 421 | #### Form markup: 422 | 423 | ```html 424 |
425 | Message: 426 | 427 |
428 | ``` 429 | 430 |
431 | Message: 432 | 433 |
434 | 435 | #### Server code in `xml-echo.php`: 436 | 437 | ```php 438 | ' . $_POST['message'] . ''; 442 | ?> 443 | ``` 444 | 445 | #### JavaScript: 446 | 447 | ```javascript 448 | // prepare the form when the DOM is ready 449 | $(document).ready(function() { 450 | // bind form using ajaxForm 451 | $('#xmlForm').ajaxForm({ 452 | // dataType identifies the expected content type of the server response 453 | dataType: 'xml', 454 | 455 | // success identifies the function to invoke when the server response 456 | // has been received 457 | success: processXml 458 | }); 459 | }); 460 | ``` 461 | 462 | #### Callback function 463 | 464 | ```javascript 465 | function processXml(responseXML) { 466 | // 'responseXML' is the XML document returned by the server; we use 467 | // jQuery to extract the content of the message node from the XML doc 468 | var message = $('message', responseXML).text(); 469 | alert(message); 470 | } 471 | ``` 472 | 473 | --- 474 | 475 | ### HTML 476 | This page shows how to handle HTML data returned from the server. The form below submits a message to the server and the server echos it back in an HTML div. The response is added to this page in the `htmlExampleTarget` div below. 477 | 478 | #### Form markup: 479 | 480 | ```html 481 |
482 | Message: 483 | 484 |
485 | ``` 486 | 487 |
488 | Message: 489 | 490 |
491 | 492 | #### Server code in `html-echo.php`: 493 | 494 | ```php 495 | ' . $_POST['message'] . ''; 497 | ?> 498 | ``` 499 | 500 | #### JavaScript: 501 | 502 | ```javascript 503 | // prepare the form when the DOM is ready 504 | $(document).ready(function() { 505 | // bind form using ajaxForm 506 | $('#htmlForm').ajaxForm({ 507 | // target identifies the element(s) to update with the server response 508 | target: '#htmlExampleTarget', 509 | 510 | // success identifies the function to invoke when the server response 511 | // has been received; here we apply a fade-in effect to the new content 512 | success: function() { 513 | $('#htmlExampleTarget').fadeIn('slow'); 514 | } 515 | }); 516 | }); 517 | ``` 518 | 519 | #### htmlExampleTarget (output will be added below): 520 |
521 | 522 | --- 523 | 524 | ### File Upload 525 | This page demonstrates the Form Plugin's file upload capabilities. There is no special coding required to handle file uploads. File input elements are automatically detected and processed for you. 526 | 527 | Browsers that support the [XMLHttpRequest Level 2](http://www.w3.org/TR/XMLHttpRequest/) will be able to upload files seamlessly and even get progress updates as the upload proceeds. For older browsers, a fallback technology is used which involves iframes since it is not possible to upload files using the level 1 implmenentation of the XMLHttpRequest object. This is a common fallback technique, but it has inherent limitations. The iframe element is used as the target of the form's submit operation which means that the server response is written to the iframe. This is fine if the response type is HTML or XML, but doesn't work as well if the response type is script or JSON, both of which often contain characters that need to be repesented using entity references when found in HTML markup. 528 | 529 | To account for the challenges of script and JSON responses when using the iframe mode, the Form Plugin allows these responses to be embedded in a `textarea` element and it is recommended that you do so for these response types when used in conjuction with file uploads and older browsers. 530 | 531 | It is important to note that even when the dataType option is set to 'script', and the server is actually responding with some javascript to a multipart form submission, the response's Content-Type header should be forced to `text/html`, otherwise Internet Explorer will prompt the user to download a "file". 532 | 533 | Also note that if there is no file input in the form then the request uses normal XHR to submit the form (not an iframe). This puts the burden on your server code to know when to use a textarea and when not to. If you like, you can use the `iframe` option of the plugin to force it to always use an *iframe mode* and then your server can always embed the response in a textarea. But the recommended solution is to test for the 'X-Requested-With' request header. If the value of that header is 'XMLHttpRequest' then you know that the form was posted via ajax. 534 | 535 | The following PHP snippet shows how you can be sure to return content successfully: 536 | 537 | ```php 538 | '; 542 | ?> 543 | 544 | // main content of response here 545 | 546 | '; 549 | ?> 550 | ``` 551 | 552 | The form below provides an input element of type "file" along with a select element to specify the dataType of the response. The form is submitted to `files.php` which uses the dataType to determine what type of response to return. 553 | 554 |
555 | 556 | File: 557 | Return Type: 563 | 564 | 565 |
566 | 567 |
568 | 569 | Examples that show how to display upload progress: 570 | - [Progress Demo 1](http://malsup.com/jquery/form/progress.html) 571 | - [Progress Demo 2](http://malsup.com/jquery/form/progress2.html) 572 | - [Progress Demo 3](http://malsup.com/jquery/form/progress3.html) 573 | -------------------------------------------------------------------------------- /docs/faq.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## Frequently Asked Questions 5 | #### Does jQuery Form Plugin have any dependencies? 6 | The only dependency is jQuery itself. 7 | 8 | #### Which versions of jQuery is jQuery Form Plugin compatible with? 9 | jQuery Form Plugin is compatible with jQuery v1.7.2 and later, including jQuery 2.x.x and 3.x.x. 10 | 11 | #### Is jQuery Form Plugin fast? Does it serialize forms accurately? 12 | Yes! See our [comparison page](http://malsup.com/jquery/form/comp/) for a look at how jQuery Form Plugin compares to other libraries (including Prototype and dojo). 13 | 14 | #### What is the easiet way to use jQuery Form Plugin? 15 | The `ajaxForm` method provides the simplest way to enable your HTML form to use AJAX. It's the one-stop-shopping method for preparing forms. 16 | 17 | #### What is the difference between `ajaxForm` and `ajaxSubmit`? 18 | There are two main differences between these methods: 19 | 1. `ajaxSubmit` submits the form, `ajaxForm` does not. When you invoke `ajaxSubmit` it immediately serializes the form data and sends it to the server. When you invoke `ajaxForm` it adds the necessary event listeners to the form so that it can detect when the form is submitted by the user. When this occurs `ajaxSubmit` is called for you. 20 | 2. When using `ajaxForm` the submitted data will include the name and value of the submitting element (or its click coordinates if the submitting element is an image). 21 | 22 | #### How can I cancel a form submit? 23 | You can prevent a form from being submitted by adding a 'beforeSubmit' callback function and returning false from that function. See the [Code Samples](http://malsup.com/jquery/form/#ajaxForm) page for an example. 24 | 25 | #### Is there a unit test suite for jQuery Form Plugin? 26 | Yes! jQuery Form Plugin has an extensive set of tests that are used to validate its functionality. 27 | [Run unit tests](http://malsup.com/jquery/form/test/) 28 | 29 | #### Does jQuery Form Plugin support file uploads? 30 | Yes! 31 | 32 | #### Why aren't all my input values posted? 33 | jQuery Form serialization adheres closely to the HTML spec. Only [successful controls](https://www.w3.org/TR/html5/forms.html#constructing-form-data-set) are valid for submission. 34 | 35 | #### How do I display upload progress information? 36 | [Demo](view-source:malsup.com/jquery/form/progress.html) 37 | -------------------------------------------------------------------------------- /docs/form-fields.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## Form Fields 5 | This page describes and demonstrates the Form Plugin's `fieldValue` and `fieldSerialize` methods. 6 | 7 | ### fieldValue 8 | `fieldValue` allows you to retrieve the current value of a field. For example, to retrieve the value of the password field in a form with the id of 'myForm' you would write: 9 | 10 | ```javascript 11 | var pwd = $('#myForm :password').fieldValue()[0]; 12 | ``` 13 | 14 | This method *always* returns an array. If no valid value can be determined the array will be empty, otherwise it will contain one or more values. 15 | 16 | ### fieldSerialize 17 | `fieldSerialize` allows you to serialize a subset of a form into a query string. This is useful when you need to process only certain fields. For example, to serialize only the text inputs of a form you would write: 18 | 19 | ```javascript 20 | var queryString = $('#myForm :text').fieldSerialize(); 21 | ``` 22 | 23 |
24 |
25 |

Demonstration

26 |

27 | Enter a jQuery expression into the textbox below and then click 'Test' to see the results 28 | of the fieldValue and fieldSerialize 29 | methods. These methods are run against the test form that follows. 30 |

31 | jQuery expression: 32 | 33 | (ie: textarea, [@type='hidden'], :radio, :checkbox, etc)
34 | [Successful controls](https://www.w3.org/TR/html5/forms.html#constructing-form-data-set) only
35 | 36 |
37 |
38 | 39 | 40 |
41 | Test Form 42 | 43 | 44 | 45 | 46 | 51 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 |
<input type="hidden" name="Hidden" value="secret">
<input name="Name" type="text" value="MyName1">
<input name="Password" type="password">
<select name="Multiple" multiple="multiple">
<select name="Single">
<input type="checkbox" name="Check" value="1">
<input type="checkbox" name="Check" value="2">
<input type="checkbox" name="Check" value="3">
<input type="checkbox" name="Check2" value="4">
<input type="checkbox" name="Check2" value="5">
<input type="checkbox" name="Check3">
<input type="radio" name="Radio" value="1">
<input type="radio" name="Radio" value="2">
<input type="radio" name="Radio" value="3">
<input type="radio" name="Radio2" value="4">
<input type="radio" name="Radio2" value="5">
<textarea name="Text" rows="2" cols="20"></textarea>
<input type="reset" name="resetButton" value="Reset">
<input type="submit" name="sub" value="Submit">
71 |
72 | 73 | By default, `fieldValue` and `fieldSerialize` only function on '[successful controls](https://www.w3.org/TR/html5/forms.html#constructing-form-data-set)'. This means that if you run the following code on a checkbox that is not checked, the result will be an empty array. 74 | ```javascript 75 | // value will be an empty array if checkbox is not checked: 76 | var value = $('#myUncheckedCheckbox').fieldValue(); 77 | // value.length == 0 78 | ``` 79 | 80 | However, if you really want to know the 'value' of the checkbox element, even if it's unchecked, you can write this: 81 | ```javascript 82 | // value will hold the checkbox value even if it's not checked: 83 | var value = $('#myUncheckedCheckbox').fieldValue(false); 84 | // value.length == 1 85 | ``` 86 | -------------------------------------------------------------------------------- /docs/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## Getting Started 5 | ### Overview 6 | The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX. The main methods, `ajaxForm` and `ajaxSubmit`, gather information from the form element to determine how to manage the submit process. Both of these methods support numerous options which allows you to have full control over how the data is submitted. Submitting a form with AJAX doesn't get any easier than this! 7 | 8 | ### Quick Start Guide 9 | 1. Add a form to your page. Just a normal form, no special markup required: 10 | ```html 11 |
12 | Name: 13 | Comment: 14 | 15 |
16 | ``` 17 | 2. Include jQuery and the Form Plugin external script files and a short script to initialize the form when the DOM is ready: 18 | ```html 19 | 20 | 21 | 22 | 23 | 24 | 33 | 34 | ``` 35 | 36 | **That's it!** 37 | 38 | When this form is submitted the _name_ and _comment_ fields will be posted to _comment.php_. If the server returns a success status then the user will see a "Thank you" message. 39 | 40 | *[AJAX]: Asynchronous JavaScript and XML 41 | -------------------------------------------------------------------------------- /docs/options.md: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | ## ajaxForm and ajaxSubmit Options 5 | Both `ajaxForm` and `ajaxSubmit` support numerous options which can be provided using plain JavaScript `options` object containing any of the options below: 6 | **Note:** Aside from the options listed below, you can also pass any of the standard [$.ajax settings](https://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings) to ajaxForm and ajaxSubmit. 7 | 8 | 9 | ### beforeSerialize 10 | Default: `null` 11 | Callback function to be invoked before the form is serialized. This provides an opportunity to manipulate the form before it's values are retrieved. The `beforeSerialize` function is invoked with two arguments: the jQuery object for the form, and the Options Object passed into ajaxForm/ajaxSubmit. 12 | 13 | ```javascript 14 | beforeSerialize: function($form, options) { 15 | // return false to cancel submit 16 | } 17 | ``` 18 | 19 | 20 | ### beforeSubmit 21 | Default: `null` 22 | Callback function to be invoked before the form is submitted. The 'beforeSubmit' callback can be provided as a hook for running pre-submit logic or for validating the form data. If the 'beforeSubmit' callback returns false then the form will not be submitted. The 'beforeSubmit' callback is invoked with three arguments: the form data in array format, the jQuery object for the form, and the Options Object passed into ajaxForm/ajaxSubmit. 23 | 24 | ```javascript 25 | beforeSubmit: function(arr, $form, options) { 26 | // The array of form data takes the following form: 27 | // [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ] 28 | 29 | // return false to cancel submit 30 | } 31 | ``` 32 | 33 | 34 | ### clearForm 35 | Default: `null` 36 | Boolean flag indicating whether the form should be cleared if the submit is successful 37 | 38 | 39 | ### data 40 | Default: `{}` 41 | An object containing extra data that should be submitted along with the form. 42 | 43 | ```javascript 44 | data: { key1: 'value1', key2: 'value2' } 45 | ``` 46 | 47 | 48 | ### dataType 49 | Default: `null` 50 | Expected data type of the response. One of: null, 'xml', 'script', or 'json'. The `dataType` option provides a means for specifying how the server response should be handled. This maps directly to the `jQuery.httpData` method. The following values are supported: 51 | 52 | **'xml'**: if dataType == 'xml' the server response is treated as XML and the 'success' callback method, if specified, will be passed the responseXML value 53 | 54 | **'json'**: if dataType == 'json' the server response will be evaluted and passed to the 'success' callback, if specified 55 | 56 | **'script'**: if dataType == 'script' the server response is evaluated in the global context 57 | 58 | 59 | ### error 60 | **Deprecated** due to incompatiblity with jQuery 3 Slim. ([issue #544](https://github.com/jquery-form/form/issues/544)) 61 | Callback function to be invoked upon error. 62 | 63 | 64 | ### forceSync 65 | Default: `false` 66 | Boolean value. Set to true to remove short delay before posting form when uploading files (or using the iframe option). The delay is used to allow the browser to render DOM updates prior to performing a native form submit. This improves usability when displaying notifications to the user, such as "Please Wait…" **(version added: 2.38)** 67 | 68 | 69 | ### iframe 70 | Default: `false` 71 | Boolean flag indicating whether the form should always target the server response to an iframe. This is useful in conjuction with file uploads. See the _File Uploads_ documentation on the [Code Samples](#code-samples) page for more info. 72 | 73 | 74 | ### iframeSrc 75 | Default: `about:blank` 76 | Default value for HTTPS pages: `javascript:false` 77 | String value that should be used for the iframe's src attribute when/if an iframe is used. 78 | 79 | 80 | ### iframeTarget 81 | Default: `null` 82 | Identifies the iframe element to be used as the response target for file uploads. By default, the plugin will create a temporary iframe element to capture the response when uploading files. This options allows you to use an existing iframe if you wish. When using this option the plugin will make no attempt at handling the response from the server. **(version added: 2.76)** 83 | 84 | 85 | ### method 86 | Default: value of form's `method` attribute (or `GET` if none found) 87 | The HTTP method to use for the request (e.g. 'POST', 'GET', 'PUT'). **(version added: 4.2.0)** 88 | 89 | 90 | ### replaceTarget 91 | Default: `false` 92 | Optionally used along with the the [`target`](#target) option. Set to `true` if the target should be replaced or `false` if only the target _contents_ should be replaced. **(version added: 2.43)** 93 | 94 | ### resetForm 95 | Default: `null` 96 | Boolean flag indicating whether the form should be reset if the submit is successful 97 | 98 | 99 | ### semantic 100 | Default: `false` 101 | Boolean flag indicating whether data must be submitted in strict semantic order (slower). Note that the normal form serialization is done in semantic order with the exception of input elements of `type="image"`. 102 | **Note:** You should _only_ set the `semantic` option to `true` if your server has strict semantic requirements **and** your form contains an input element of `type="image"`. 103 | 104 | 105 | ### success 106 | **Deprecated** due to incompatiblity with jQuery 3 Slim. ([issue #544](https://github.com/jquery-form/form/issues/544)) 107 | Default: `null` 108 | Callback function to be invoked after the form has been submitted. If a 'success' callback function is provided it is invoked after the response has been returned from the server. It is passed the following standard jQuery arguments: 109 | 110 | 1. `data`, formatted according to the dataType parameter or the dataFilter callback function, if specified 111 | 2. `textStatus`, string 112 | 3. `jqXHR`, object 113 | 4. `$form` jQuery object containing form element 114 | 115 | 116 | ### target 117 | Default: `null` 118 | Identifies the element(s) in the page to be updated with the server response. This value may be specified as a jQuery selection string, a jQuery object, or a DOM element. 119 | 120 | 121 | ### type 122 | Default: value of form's `method` attribute (or 'GET' if none found) 123 | The HTTP method to use for the request (e.g. 'POST', 'GET', 'PUT'). 124 | An alias for `method` option. Overridden by the `method` value if both are present. 125 | 126 | 127 | ### uploadProgress 128 | Default: `null` 129 | Callback function to be invoked with upload progress information (if supported by the browser). The callback is passed the following arguments: 130 | 131 | 1. event; the browser event 132 | 2. position (integer) 133 | 3. total (integer) 134 | 4. percentComplete (integer) 135 | 136 | 137 | ### url 138 | Default: value of form's `action` attribute 139 | URL to which the form data will be submitted. 140 | 141 | 142 | ## Example 143 | ```javascript 144 | // prepare Options Object 145 | var options = { 146 | target: '#divToUpdate', 147 | url: 'comment.php', 148 | success: function() { 149 | alert('Thanks for your comment!'); 150 | } 151 | }; 152 | 153 | // pass options to ajaxForm 154 | $('#myForm').ajaxForm(options); 155 | ``` 156 | -------------------------------------------------------------------------------- /form.jquery.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "form", 3 | "title": "jQuery Form", 4 | "version": "4.3.0", 5 | "author": { 6 | "name": "Kevin Morris", 7 | "url": "https://github.com/kevindb/" 8 | }, 9 | "description": "The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX.", 10 | "keywords": [ "jquery", "ajax", "jquery-plugin", "json", "json-form", "html-form", "form", "jquery-form" ], 11 | "homepage": "https://github.com/jquery-form/form", 12 | "docs": "https://jquery-form.github.io/form/", 13 | "bugs": "https://github.com/jquery-form/form/issues", 14 | "licenses": [ 15 | { 16 | "type": "LGPL-2.1+", 17 | "url": "https://github.com/jquery-form/form/blob/master/LICENSE" 18 | }, 19 | { 20 | "type": "MIT", 21 | "url": "https://github.com/jquery-form/form/blob/master/LICENSE-MIT" 22 | } 23 | ], 24 | "maintainers": [ 25 | { 26 | "name": "Kevin Morris", 27 | "url": "https://github.com/kevindb" 28 | }, 29 | { 30 | "name": "Mike Alsup", 31 | "url": "https://github.com/malsup" 32 | } 33 | ], 34 | "main": "src/jquery.form.js", 35 | "browser": "dist/jquery.form.min.js", 36 | "repository": { 37 | "type": "git", 38 | "url": "https://github.com/jquery-form/form.git" 39 | }, 40 | "dependencies": { 41 | "jquery": ">=1.7.2" 42 | }, 43 | "devDependencies": { 44 | "chai": "^4.2.0", 45 | "grunt": "^1.0.4", 46 | "grunt-cli": "^1.3.2", 47 | "grunt-contrib-uglify": "^3.4.0", 48 | "grunt-eslint": "*", 49 | "grunt-mocha": "^1.2.0", 50 | "jquery": "^3.5.0", 51 | "mocha": "^6.1.4" 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /install/pre-commit.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | # 3 | # Pre-commit hooks 4 | 5 | # Make sure node modules are available to Github Desktop 6 | PATH=$PATH:/usr/local/bin:/usr/local/sbin 7 | 8 | # Lint and test before committing 9 | grunt test 10 | -------------------------------------------------------------------------------- /install/template/shell.hb: -------------------------------------------------------------------------------- 1 | # Make sure node modules are available to Github Desktop 2 | PATH=$PATH:/usr/local/bin:/usr/local/sbin 3 | 4 | {{command}}{{#if task}} {{task}}{{/if}}{{#if args}} {{args}}{{/if}} 5 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery-form", 3 | "version": "4.3.0", 4 | "description": "The jQuery Form Plugin allows you to easily and unobtrusively upgrade HTML forms to use AJAX.", 5 | "keywords": [ 6 | "jquery", 7 | "ajax", 8 | "jquery-plugin", 9 | "json", 10 | "json-form", 11 | "html-form", 12 | "form", 13 | "jquery-form", 14 | "ecosystem:jquery" 15 | ], 16 | "homepage": "https://github.com/jquery-form/form", 17 | "bugs": "https://github.com/jquery-form/form/issues", 18 | "license": "(LGPL-2.1+ OR MIT)", 19 | "contributors": [ 20 | "Mike Alsup", 21 | "Kevin Morris" 22 | ], 23 | "main": "src/jquery.form.js", 24 | "browser": "dist/jquery.form.min.js", 25 | "repository": { 26 | "type": "git", 27 | "url": "https://github.com/jquery-form/form.git" 28 | }, 29 | "dependencies": { 30 | "jquery": ">=1.7.2" 31 | }, 32 | "devDependencies": { 33 | "chai": "^4.2.0", 34 | "grunt": "^1.1.0", 35 | "grunt-cli": "^1.3.2", 36 | "grunt-contrib-uglify": "^4.0.1", 37 | "grunt-eslint": "*", 38 | "grunt-mocha": "^1.2.0", 39 | "jquery": "^3.5.1", 40 | "mocha": "^7.2.0" 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /test/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | "env": { 3 | "browser": true, 4 | "jquery": true, 5 | "node": true, 6 | "mocha": true 7 | }, 8 | "parserOptions": { 9 | "ecmaVersion": 5, 10 | "sourceType": "script" 11 | }, 12 | "rules": { 13 | "comma-spacing": "warn", 14 | "eqeqeq": "warn", 15 | "newline-after-var": "off", 16 | "newline-before-return": "off", 17 | "no-multi-spaces": "warn", 18 | "object-curly-spacing": [ 19 | "warn", 20 | "never", 21 | { 22 | "arraysInObjects": true, 23 | "objectsInObjects": true 24 | } 25 | ], 26 | "strict": [ 27 | "warn", 28 | "global" 29 | ], 30 | "yoda": "warn" 31 | } 32 | }; 33 | -------------------------------------------------------------------------------- /test/ajax/doc-with-scripts.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | Lorem ipsum dolor sit amet 4 | 5 | 9 | 10 | Lorem ipsum dolor sit amet 11 | 12 | 16 | 17 | 24 | 25 | Lorem ipsum dolor sit amet 26 | 27 |
28 | -------------------------------------------------------------------------------- /test/ajax/json.json: -------------------------------------------------------------------------------- 1 | { "name": "jquery-test" } -------------------------------------------------------------------------------- /test/ajax/json.txt: -------------------------------------------------------------------------------- 1 | { "name": "jquery-test" } -------------------------------------------------------------------------------- /test/ajax/script.txt: -------------------------------------------------------------------------------- 1 | formScriptTest = function() { 2 | // no-op 3 | } 4 | -------------------------------------------------------------------------------- /test/ajax/test.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /test/ajax/text.html: -------------------------------------------------------------------------------- 1 | Lorem ipsum dolor sit amet 2 | consectetuer adipiscing elit 3 | Sed lorem leo 4 | lorem leo consectetuer adipiscing elit 5 | Sed lorem leo 6 | rhoncus sit amet 7 | elementum at 8 | bibendum at, eros 9 | Cras at mi et tortor egestas vestibulum 10 | sed Cras at mi vestibulum 11 | Phasellus sed felis sit amet 12 | orci dapibus semper. 13 | -------------------------------------------------------------------------------- /test/img/submit.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jquery-form/form/421b0aed6ff6ba8615151e1a10d9ffef3fb58923/test/img/submit.gif -------------------------------------------------------------------------------- /test/test.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Example Mocha Test 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 224 | 225 | 226 | 227 | 228 | 234 | 235 | 236 | -------------------------------------------------------------------------------- /test/test.js: -------------------------------------------------------------------------------- 1 | /* global chai, scriptCount */ 2 | 3 | 'use strict'; 4 | 5 | // helper method 6 | var arrayCount = function(arr, key) { 7 | var count = 0; 8 | for (var i = 0; i < arr.length; i++) { 9 | if (arr[i].name === key) { 10 | count++; 11 | } 12 | } 13 | return count; 14 | }; 15 | 16 | // helper method 17 | var arrayValue = function(arr, key) { 18 | for (var i = 0; i < arr.length; i++) { 19 | if (arr[i].name === key) { 20 | return arr[i].value; 21 | } 22 | } 23 | return undefined; 24 | }; 25 | 26 | 27 | var assert = chai.assert; 28 | var fixture; 29 | 30 | describe('form', function() { 31 | before(function() { 32 | fixture = $('#main').html(); 33 | }); 34 | 35 | beforeEach(function() { 36 | $('#main').html(fixture); 37 | }); 38 | 39 | 40 | it('"action" and "method" form attributes', function() { 41 | var f = $('#form1'); 42 | assert.strictEqual(f.attr('action'), 'ajax/text.html', 'form "action"'); 43 | assert.strictEqual(f.attr('method'), 'get', 'form "method"'); 44 | }); 45 | 46 | it('formToArray: multi-select', function() { 47 | var a = $('#form1').formToArray(); 48 | assert.strictEqual(a.constructor, Array, 'type check'); 49 | assert.strictEqual(a.length, 13, 'array length'); 50 | assert.strictEqual(arrayCount(a, 'Multiple'), 3, 'multi-select'); 51 | }); 52 | 53 | it('formToArray: "action" and "method" inputs', function() { 54 | var a = $('#form1').formToArray(); 55 | assert.strictEqual(a.constructor, Array, 'type check'); 56 | assert.strictEqual(arrayValue(a, 'action'), '1', 'input name=action'); 57 | assert.strictEqual(arrayValue(a, 'method'), '2', 'input name=method'); 58 | }); 59 | 60 | it('formToArray: semantic test', function() { 61 | var formData = $('#form2').formToArray(true); 62 | var testData = ['a','b','c','d','e','f']; 63 | for (var i = 0; i < 6; i++) { 64 | assert.strictEqual(formData[i].name, testData[i], 'match value at index=' + i); 65 | } 66 | }); 67 | 68 | it('formToArray: text promotion for missing value attributes', function() { 69 | var expected = [ 70 | { name: 'A', value: ''}, 71 | { name: 'B', value: 'MISSING_ATTR'}, 72 | { name: 'C', value: ''}, 73 | { name: 'C', value: 'MISSING_ATTR'} 74 | ]; 75 | var a = $('#form6').formToArray(true); 76 | 77 | // verify all the option values 78 | for (var i = 0; i < a.length; i++) { 79 | assert.strictEqual(a[i].name, expected[i].name, 'Name: ' + a[i].name + ' = ' + expected[i].name); 80 | assert.strictEqual(a[i].value, expected[i].value, 'Value: ' + a[i].value + ' = ' + expected[i].value); 81 | } 82 | }); 83 | 84 | it('formToArray: outside fields', function() { 85 | var formData = $('#form10').formToArray(); 86 | assert.strictEqual(formData.length, 2, 'There are two "successful" elements of the form'); 87 | }); 88 | 89 | // test string serialization 90 | it('serialize: param count', function() { 91 | var s = $('#form1').formSerialize(); 92 | assert.ok(s.constructor == String, 'type check'); 93 | assert.ok(s.split('&').length == 13, 'string array length'); 94 | }); 95 | 96 | // test support for input elements not contained within a form 97 | it('serialize: pseudo form', function() { 98 | var s = $('#pseudo *').fieldSerialize(); 99 | assert.ok(s.constructor == String, 'type check'); 100 | assert.ok(s.split('&').length == 3, 'string array length'); 101 | }); 102 | 103 | 104 | // test resetForm 105 | it('resetForm (text input)', function() { 106 | var $el = $('#form1 input[name=Name]'); 107 | var val = $el.val(); 108 | assert.ok('MyName1' == val, 'beforeSubmit: ' + val); 109 | $el.val('test'); 110 | val = $el.val(); 111 | assert.ok('test' == $el.val(), 'update: ' + val); 112 | $('#form1').resetForm(); 113 | val = $el.val(); 114 | assert.ok('MyName1' == val, 'success: ' + val); 115 | }); 116 | 117 | // test resetForm 118 | it('resetForm (select)', function() { 119 | var $el = $('#form1 select[name=Single]'); 120 | var val = $el.val(); 121 | assert.ok('one' == val, 'beforeSubmit: ' + val); 122 | $el.val('two'); 123 | val = $el.val(); 124 | assert.ok('two' == $el.val(), 'update: ' + val); 125 | $('#form1').resetForm(); 126 | val = $el.val(); 127 | assert.ok('one' == val, 'success: ' + val); 128 | }); 129 | 130 | // test resetForm 131 | it('resetForm (textarea)', function() { 132 | var $el = $('#form1 textarea'); 133 | var val = $el.val(); 134 | assert.ok('This is Form1' == val, 'beforeSubmit: ' + val); 135 | $el.val('test'); 136 | val = $el.val(); 137 | assert.ok('test' == val, 'udpate: ' + val); 138 | $('#form1').resetForm(); 139 | val = $el.val(); 140 | assert.ok('This is Form1' == val, 'success: ' + val); 141 | }); 142 | 143 | // test resetForm 144 | it('resetForm (checkbox)', function() { 145 | var el = $('#form1 input:checkbox:checked')[0]; 146 | var val = el.value; 147 | assert.ok(el.checked, 'beforeSubmit: ' + el.checked); 148 | el.checked = false; 149 | assert.ok(!el.checked, 'update: ' + el.checked); 150 | $('#form1').resetForm(); 151 | assert.ok(el.checked, 'success: ' + el.checked); 152 | }); 153 | 154 | // test resetForm 155 | it('resetForm (radio)', function() { 156 | var el = $('#form1 input:radio:checked')[0]; 157 | var val = el.value; 158 | assert.ok(el.checked, 'beforeSubmit: ' + el.checked); 159 | el.checked = false; 160 | assert.ok(!el.checked, 'update: ' + el.checked); 161 | $('#form1').resetForm(); 162 | assert.ok(el.checked, 'success: ' + el.checked); 163 | }); 164 | 165 | 166 | // test clearForm 167 | it('clearForm (text input)', function() { 168 | var $el = $('#form1 input[name=Name]'); 169 | var val = $el.val(); 170 | assert.ok('MyName1' == val, 'beforeSubmit: ' + val); 171 | $('#form1').clearForm(); 172 | val = $el.val(); 173 | assert.ok('' == val, 'success: ' + val); 174 | }); 175 | 176 | // test clearForm 177 | it('clearForm (select)', function() { 178 | var $el = $('#form1 select[name=Single]'); 179 | var val = $el.val(); 180 | assert.ok('one' == val, 'beforeSubmit: ' + val); 181 | $('#form1').clearForm(); 182 | val = $el.val(); 183 | assert.ok(!val, 'success: ' + val); 184 | }); 185 | 186 | // test clearForm; here we're testing that a hidden field is NOT cleared 187 | it('clearForm: (hidden input)', function() { 188 | var $el = $('#form1 input:hidden'); 189 | var val = $el.val(); 190 | assert.ok('hiddenValue' == val, 'beforeSubmit: ' + val); 191 | $('#form1').clearForm(); 192 | val = $el.val(); 193 | assert.ok('hiddenValue' == val, 'success: ' + val); 194 | }); 195 | 196 | 197 | // test clearForm; here we're testing that a submit element is NOT cleared 198 | it('clearForm: (submit input)', function() { 199 | var $el = $('#form1 input:submit'); 200 | var val = $el.val(); 201 | assert.ok('Submit1' == val, 'beforeSubmit: ' + val); 202 | $('#form1').clearForm(); 203 | val = $el.val(); 204 | assert.ok('Submit1' == val, 'success: ' + val); 205 | }); 206 | 207 | // test clearForm 208 | it('clearForm (checkbox)', function() { 209 | var el = $('#form1 input:checkbox:checked')[0]; 210 | assert.ok(el.checked, 'beforeSubmit: ' + el.checked); 211 | $('#form1').clearForm(); 212 | assert.ok(!el.checked, 'success: ' + el.checked); 213 | }); 214 | 215 | // test clearForm 216 | it('clearForm (radio)', function() { 217 | var el = $('#form1 input:radio:checked')[0]; 218 | assert.ok(el.checked, 'beforeSubmit: ' + el.checked); 219 | $('#form1').clearForm(); 220 | assert.ok(!el.checked, 'success: ' + el.checked); 221 | }); 222 | 223 | // test ajaxSubmit target update 224 | it('ajaxSubmit: target == String', function() { 225 | $('#targetDiv').empty(); 226 | // stop(); 227 | var opts = { 228 | target: '#targetDiv', 229 | success: function() { // post-callback 230 | assert.ok(true, 'post-callback'); 231 | assert.ok($('#targetDiv').text().match('Lorem ipsum'), 'targetDiv updated'); 232 | // start(); 233 | } 234 | }; 235 | 236 | // expect(2); 237 | $('#form3').ajaxSubmit(opts); 238 | }); 239 | 240 | // test passing jQuery object as the target 241 | it('ajaxSubmit: target == jQuery object', function() { 242 | // stop(); 243 | var target = $('#targetDiv'); 244 | target.empty(); 245 | 246 | var opts = { 247 | target: target, 248 | success: function(responseText) { // post-callback 249 | assert.ok(true, 'post-callback'); 250 | assert.ok($('#targetDiv').text().match('Lorem ipsum'), 'targetDiv updated'); 251 | // start(); 252 | } 253 | }; 254 | 255 | // expect(2); 256 | $('#form2').ajaxSubmit(opts); 257 | }); 258 | 259 | // test passing DOM element as the target 260 | it('ajaxSubmit: target == DOM element', function() { 261 | // stop(); 262 | $('#targetDiv').empty(); 263 | var el = $('#targetDiv')[0]; 264 | 265 | var opts = { 266 | target: '#targetDiv', 267 | success: function(responseText) { // post-callback 268 | assert.ok(true, 'post-callback'); 269 | assert.ok($('#targetDiv').text().match('Lorem ipsum'), 'targetDiv updated'); 270 | // start(); 271 | } 272 | }; 273 | 274 | // expect(2); 275 | $('#form2').ajaxSubmit(opts); 276 | }); 277 | 278 | // test simulated $.load behavior 279 | it('ajaxSubmit: load target with scripts', function() { 280 | // stop(); 281 | $('#targetDiv').empty(); 282 | 283 | var opts = { 284 | target: '#targetDiv', 285 | url: 'ajax/doc-with-scripts.html?' + new Date().getTime(), 286 | success: function(responseText) { // post-callback 287 | assert.ok(true, 'success-callback'); 288 | assert.ok($('#targetDiv').text().match('Lorem ipsum'), 'targetDiv updated'); 289 | assert.ok(typeof unitTestVariable1 != 'undefined', 'first script block executed'); 290 | assert.ok(typeof unitTestVariable2 != 'undefined', 'second script block executed'); 291 | assert.ok(typeof scriptCount != 'undefined', 'third script block executed'); 292 | assert.ok(scriptCount == 1, 'scripts executed once: ' + scriptCount); 293 | // start(); 294 | } 295 | }; 296 | 297 | // expect(6); 298 | $('#form2').ajaxSubmit(opts); 299 | }); 300 | 301 | // test ajaxSubmit pre-submit callback 302 | it('ajaxSubmit: pre-submit callback', function() { 303 | var opts = { 304 | beforeSubmit: function(a, jq) { // pre-submit callback 305 | assert.ok(true, 'pre-submit callback'); 306 | assert.ok(a.constructor == Array, 'type check array'); 307 | assert.ok(jq.jquery, 'type check jQuery'); 308 | assert.ok(jq[0].tagName.toLowerCase() == 'form', 'jQuery arg == "form": ' + jq[0].tagName.toLowerCase()); 309 | } 310 | }; 311 | 312 | // expect(4); 313 | $('#form3').ajaxSubmit(opts); 314 | }); 315 | 316 | // test ajaxSubmit post-submit callback for response and status text 317 | it('ajaxSubmit: post-submit callback', function() { 318 | // stop(); 319 | 320 | var opts = { 321 | success: function(responseText, statusText) { // post-submit callback 322 | assert.ok(true, 'post-submit callback'); 323 | assert.ok(responseText.match('Lorem ipsum'), 'responseText'); 324 | assert.ok(statusText == 'success', 'statusText'); 325 | // start(); 326 | } 327 | }; 328 | 329 | // expect(3); 330 | $('#form3').ajaxSubmit(opts); 331 | }); 332 | 333 | // test ajaxSubmit with function argument 334 | it('ajaxSubmit: function arg', function() { 335 | // stop(); 336 | 337 | // expect(1); 338 | $('#form3').ajaxSubmit(function() { 339 | assert.ok(true, 'callback hit'); 340 | // start(); 341 | }); 342 | }); 343 | 344 | // test semantic support via ajaxSubmit's pre-submit callback 345 | it('ajaxSubmit: semantic test', function() { 346 | var testData = ['a','b','c','d','e','f']; 347 | 348 | var opts = { 349 | semantic: true, 350 | beforeSubmit: function(a, jq) { // pre-submit callback 351 | assert.ok(true, 'pre-submit callback'); 352 | assert.ok(a.constructor == Array, 'type check'); 353 | assert.ok(jq.jquery, 'type check jQuery'); 354 | for (var i = 0; i < a.length; i++) { 355 | assert.ok(a[i].name == testData[i], 'match value at index=' + i); 356 | } 357 | } 358 | }; 359 | 360 | // expect(9); 361 | $('#form2').ajaxSubmit(opts); 362 | }); 363 | 364 | // test json datatype 365 | it('ajaxSubmit: dataType == json', function() { 366 | // stop(); 367 | 368 | var opts = { 369 | url: 'ajax/json.json', 370 | dataType: 'json', 371 | success: function(data, statusText) { // post-submit callback 372 | // assert that the json data was evaluated 373 | assert.ok(typeof data == 'object', 'json data type'); 374 | assert.ok(data.name == 'jquery-test', 'json data contents'); 375 | // start(); 376 | } 377 | }; 378 | 379 | // expect(2); 380 | $('#form2').ajaxSubmit(opts); 381 | }); 382 | 383 | 384 | // test script datatype 385 | it('ajaxSubmit: dataType == script', function() { 386 | // stop(); 387 | 388 | var opts = { 389 | url: 'ajax/script.txt?' + new Date().getTime(), // don't let ie cache it 390 | dataType: 'script', 391 | success: function(responseText, statusText) { // post-submit callback 392 | assert.ok(typeof formScriptTest == 'function', 'script evaluated'); 393 | assert.ok(responseText.match('formScriptTest'), 'script returned'); 394 | // start(); 395 | } 396 | }; 397 | 398 | // expect(2); 399 | $('#form2').ajaxSubmit(opts); 400 | }); 401 | 402 | // test xml datatype 403 | it('ajaxSubmit: dataType == xml', function() { 404 | // stop(); 405 | 406 | var opts = { 407 | url: 'ajax/test.xml', 408 | dataType: 'xml', 409 | success: function(responseXML, statusText) { // post-submit callback 410 | assert.ok(typeof responseXML == 'object', 'data type xml'); 411 | assert.ok($('test', responseXML).length == 3, 'xml data query'); 412 | // start(); 413 | } 414 | }; 415 | 416 | // expect(2); 417 | $('#form2').ajaxSubmit(opts); 418 | }); 419 | 420 | 421 | // test that args embedded in the action are honored; no real way 422 | // to assert this so successful callback is used to signal success 423 | it('ajaxSubmit: existing args in action attr', function() { 424 | // stop(); 425 | 426 | var opts = { 427 | success: function() { // post-submit callback 428 | assert.ok(true, 'post callback'); 429 | // start(); 430 | } 431 | }; 432 | 433 | // expect(1); 434 | $('#form5').ajaxSubmit(opts); 435 | }); 436 | 437 | // test ajaxSubmit using pre-submit callback to cancel submit 438 | it('ajaxSubmit: cancel submit', function() { 439 | 440 | var opts = { 441 | beforeSubmit: function(a, jq) { // pre-submit callback 442 | assert.ok(true, 'pre-submit callback'); 443 | assert.ok(a.constructor == Array, 'type check'); 444 | assert.ok(jq.jquery, 'type check jQuery'); 445 | return false; // return false to abort submit 446 | }, 447 | success: function() { // post-submit callback 448 | assert.ok(false, 'should not hit this post-submit callback'); 449 | } 450 | }; 451 | 452 | // expect(3); 453 | $('#form3').ajaxSubmit(opts); 454 | }); 455 | 456 | // test submitting a pseudo-form 457 | it('ajaxSubmit: pseudo-form', function() { 458 | // stop(); 459 | 460 | var opts = { 461 | beforeSubmit: function(a, jq) { // pre-submit callback 462 | assert.ok(true, 'pre-submit callback'); 463 | assert.ok(a.constructor == Array, 'type check'); 464 | assert.ok(jq.jquery, 'type check jQuery'); 465 | assert.ok(jq[0].tagName.toLowerCase() == 'div', 'jQuery arg == "div"'); 466 | }, 467 | success: function() { // post-submit callback 468 | assert.ok(true, 'post-submit callback'); 469 | // start(); 470 | }, 471 | // url and method must be provided for a pseudo form since they can 472 | // not be extracted from the markup 473 | url: 'ajax/text.html', 474 | type: 'post' 475 | }; 476 | 477 | // expect(5); 478 | $('#pseudo').ajaxSubmit(opts); 479 | }); 480 | 481 | // test eval of json response 482 | it('ajaxSubmit: evaluate response', function() { 483 | // stop(); 484 | 485 | var opts = { 486 | success: function(responseText) { // post-callback 487 | assert.ok(true, 'post-callback'); 488 | var data = eval.call(window, '(' + responseText + ')'); 489 | assert.ok(data.name == 'jquery-test', 'evaled response'); 490 | // start(); 491 | }, 492 | url: 'ajax/json.txt' 493 | }; 494 | 495 | // expect(2); 496 | $('#form2').ajaxSubmit(opts); 497 | }); 498 | 499 | 500 | // test pre and post callbacks for ajaxForm 501 | it('ajaxForm: pre and post callbacks', function() { 502 | // stop(); 503 | 504 | var opts = { 505 | beforeSubmit: function(a, jq) { // pre-submit callback 506 | assert.ok(true, 'pre-submit callback'); 507 | assert.ok(a.constructor == Array, 'type check'); 508 | assert.ok(jq.jquery, 'type check jQuery'); 509 | }, 510 | success: function() { // post-submit callback 511 | assert.ok(true, 'post-submit callback'); 512 | // start(); 513 | } 514 | }; 515 | 516 | // expect(4); 517 | $('#form4').ajaxForm(opts); 518 | $('#submitForm4')[0].click(); // trigger the submit button 519 | }); 520 | 521 | // test that the value of the submit button is captured 522 | it('ajaxForm: capture submit element', function() { 523 | 524 | var opts = { 525 | beforeSubmit: function(a, jq) { // pre-callback 526 | assert.ok(true, 'pre-callback'); 527 | assert.ok(a.constructor == Array, 'type check'); 528 | assert.ok(jq.jquery, 'type check jQuery'); 529 | assert.ok(arrayValue(a, 'form4inputName') !== null, 'submit button'); 530 | } 531 | }; 532 | 533 | // expect(4); 534 | $('#form4').ajaxForm(opts); 535 | $('#submitForm4withName')[0].click(); 536 | }); 537 | 538 | // test image submit support 539 | it('ajaxForm: capture submit image coordinates', function() { 540 | 541 | var opts = { 542 | beforeSubmit: function(a, jq) { // pre-callback 543 | assert.ok(true, 'pre-callback'); 544 | assert.ok(a.constructor == Array, 'type check'); 545 | assert.ok(jq.jquery, 'type check jQuery'); 546 | assert.ok(arrayValue(a, 'myImage.x') !== null, 'x coord'); 547 | assert.ok(arrayValue(a, 'myImage.y') !== null, 'y coord'); 548 | } 549 | }; 550 | 551 | // expect(5); 552 | $('#form4').ajaxForm(opts); 553 | $('#form4imageSubmit')[0].click(); 554 | }); 555 | 556 | // test image submit support 557 | it('ajaxForm: capture submit image coordinates (semantic=true)', function() { 558 | 559 | var opts = { 560 | semantic: true, 561 | beforeSubmit: function(a, jq) { // pre-callback 562 | assert.ok(true, 'pre-callback'); 563 | assert.ok(a.constructor == Array, 'type check'); 564 | assert.ok(jq.jquery, 'type check jQuery'); 565 | assert.ok(arrayValue(a, 'myImage.x') !== null, 'x coord'); 566 | assert.ok(arrayValue(a, 'myImage.y') !== null, 'y coord'); 567 | } 568 | }; 569 | 570 | // expect(5); 571 | $('#form4').ajaxForm(opts); 572 | $('#form4imageSubmit')[0].click(); 573 | }); 574 | 575 | // test that the targetDiv gets updated 576 | it('ajaxForm: update target div', function() { 577 | $('#targetDiv').empty(); 578 | // stop(); 579 | 580 | var opts = { 581 | target: '#targetDiv', 582 | beforeSubmit: function(a, jq) { // pre-callback 583 | assert.ok(true, 'pre-callback'); 584 | assert.ok(a.constructor == Array, 'type check'); 585 | assert.ok(jq.jquery, 'type check jQuery'); 586 | }, 587 | success: function() { 588 | assert.ok(true, 'post-callback'); 589 | assert.ok($('#targetDiv').text().match('Lorem ipsum'), 'targetDiv updated'); 590 | // start(); 591 | } 592 | }; 593 | 594 | // expect(5); 595 | $('#form4').ajaxForm(opts); 596 | $('#submitForm4')[0].click(); 597 | }); 598 | 599 | it('"success" callback', function() { 600 | $('#targetDiv').empty(); 601 | // stop(); 602 | 603 | var opts = { 604 | success: function() { 605 | assert.ok(true, 'post-callback'); 606 | // start(); 607 | } 608 | }; 609 | 610 | // expect(1); 611 | $('#form3').ajaxSubmit(opts); 612 | }); 613 | 614 | it('"error" callback', function() { 615 | $('#targetDiv').empty(); 616 | // stop(); 617 | 618 | var opts = { 619 | url: 'ajax/404.html', 620 | error: function() { 621 | assert.ok(true, 'error-callback'); 622 | // start(); 623 | }, 624 | success: function() { // post-submit callback 625 | assert.ok(false, 'should not hit post-submit callback'); 626 | } 627 | }; 628 | 629 | // expect(1); 630 | $('#form3').ajaxSubmit(opts); 631 | }); 632 | 633 | 634 | it('fieldValue(true)', function() { 635 | var i; 636 | 637 | assert.ok('5' == $('#fieldTest input').fieldValue(true)[0], 'input'); 638 | assert.ok('1' == $('#fieldTest :input').fieldValue(true)[0], ':input'); 639 | assert.ok('5' == $('#fieldTest input:hidden').fieldValue(true)[0], ':hidden'); 640 | assert.ok('14' == $('#fieldTest :password').fieldValue(true)[0], ':password'); 641 | assert.ok('12' == $('#fieldTest :radio').fieldValue(true)[0], ':radio'); 642 | assert.ok('1' == $('#fieldTest select').fieldValue(true)[0], 'select'); 643 | 644 | var expected = ['8','10']; 645 | var result = $('#fieldTest :checkbox').fieldValue(true); 646 | assert.ok(result.length == expected.length, 'result size check (checkbox): ' + result.length + '=' + expected.length); 647 | for (i = 0; i < result.length; i++) { 648 | assert.ok(result[i] == expected[i], expected[i]); 649 | } 650 | 651 | expected = ['3','4']; 652 | result = $('#fieldTest [name=B]').fieldValue(true); 653 | assert.ok(result.length == expected.length, 'result size check (select-multiple): ' + result.length + '=' + expected.length); 654 | for (i = 0; i < result.length; i++) { 655 | assert.ok(result[i] == expected[i], expected[i]); 656 | } 657 | }); 658 | 659 | it('fieldValue(false)', function() { 660 | var i; 661 | 662 | assert.ok('5' == $('#fieldTest input').fieldValue(false)[0], 'input'); 663 | assert.ok('1' == $('#fieldTest :input').fieldValue(false)[0], ':input'); 664 | assert.ok('5' == $('#fieldTest input:hidden').fieldValue(false)[0], ':hidden'); 665 | assert.ok('14' == $('#fieldTest :password').fieldValue(false)[0], ':password'); 666 | assert.ok('1' == $('#fieldTest select').fieldValue(false)[0], 'select'); 667 | 668 | var expected = ['8','9','10']; 669 | var result = $('#fieldTest :checkbox').fieldValue(false); 670 | assert.ok(result.length == expected.length, 'result size check (checkbox): ' + result.length + '=' + expected.length); 671 | for (i = 0; i < result.length; i++) { 672 | assert.ok(result[i] == expected[i], expected[i]); 673 | } 674 | 675 | expected = ['11','12','13']; 676 | result = $('#fieldTest :radio').fieldValue(false); 677 | assert.ok(result.length == expected.length, 'result size check (radio): ' + result.length + '=' + expected.length); 678 | for (i = 0; i < result.length; i++) { 679 | assert.ok(result[i] == expected[i], expected[i]); 680 | } 681 | 682 | expected = ['3','4']; 683 | result = $('#fieldTest [name=B]').fieldValue(false); 684 | assert.ok(result.length == expected.length, 'result size check (select-multiple): ' + result.length + '=' + expected.length); 685 | for (i = 0; i < result.length; i++) { 686 | assert.ok(result[i] == expected[i], expected[i]); 687 | } 688 | }); 689 | 690 | it('fieldSerialize(true) input', function() { 691 | var expected = ['C=5', 'D=6', 'F=8', 'F=10', 'G=12', 'H=14']; 692 | 693 | var result = $('#fieldTest input').fieldSerialize(true); 694 | result = result.split('&'); 695 | 696 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 697 | for (var i = 0; i < result.length; i++) { 698 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 699 | } 700 | }); 701 | 702 | it('fieldSerialize(true) :input', function() { 703 | var expected = ['A=1','B=3','B=4','C=5','D=6','E=7','F=8','F=10','G=12','H=14']; 704 | 705 | var result = $('#fieldTest :input').fieldSerialize(true); 706 | result = result.split('&'); 707 | 708 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 709 | for (var i = 0; i < result.length; i++) { 710 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 711 | } 712 | }); 713 | 714 | it('fieldSerialize(false) :input', function() { 715 | var expected = ['A=1','B=3','B=4','C=5','D=6','E=7','F=8','F=9','F=10','G=11','G=12','G=13','H=14','I=15','J=16']; 716 | 717 | var result = $('#fieldTest :input').fieldSerialize(false); 718 | result = result.split('&'); 719 | 720 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 721 | for (var i = 0; i < result.length; i++) { 722 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 723 | } 724 | }); 725 | 726 | it('fieldSerialize(true) select-mulitple', function() { 727 | var expected = ['B=3','B=4']; 728 | 729 | var result = $('#fieldTest [name=B]').fieldSerialize(true); 730 | result = result.split('&'); 731 | 732 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 733 | for (var i = 0; i < result.length; i++) { 734 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 735 | } 736 | }); 737 | 738 | it('fieldSerialize(true) :checkbox', function() { 739 | var expected = ['F=8','F=10']; 740 | 741 | var result = $('#fieldTest :checkbox').fieldSerialize(true); 742 | result = result.split('&'); 743 | 744 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 745 | for (var i = 0; i < result.length; i++) { 746 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 747 | } 748 | }); 749 | 750 | it('fieldSerialize(false) :checkbox', function() { 751 | var expected = ['F=8','F=9','F=10']; 752 | 753 | var result = $('#fieldTest :checkbox').fieldSerialize(false); 754 | result = result.split('&'); 755 | 756 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 757 | for (var i = 0; i < result.length; i++) { 758 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 759 | } 760 | }); 761 | 762 | it('fieldSerialize(true) :radio', function() { 763 | var expected = ['G=12']; 764 | 765 | var result = $('#fieldTest :radio').fieldSerialize(true); 766 | result = result.split('&'); 767 | 768 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 769 | for (var i = 0; i < result.length; i++) { 770 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 771 | } 772 | }); 773 | 774 | it('fieldSerialize(false) :radio', function() { 775 | var expected = ['G=11','G=12','G=13']; 776 | 777 | var result = $('#fieldTest :radio').fieldSerialize(false); 778 | result = result.split('&'); 779 | 780 | assert.ok(result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length); 781 | for (var i = 0; i < result.length; i++) { 782 | assert.ok(result[i] == expected[i], expected[i] + ' = ' + result[i]); 783 | } 784 | }); 785 | 786 | it('ajaxForm - auto unbind', function() { 787 | $('#targetDiv').empty(); 788 | // stop(); 789 | 790 | var opts = { 791 | target: '#targetDiv', 792 | beforeSubmit: function(a, jq) { // pre-callback 793 | assert.ok(true, 'pre-callback'); 794 | }, 795 | success: function() { 796 | assert.ok(true, 'post-callback'); 797 | // start(); 798 | } 799 | }; 800 | 801 | // expect(2); 802 | // multiple binds 803 | $('#form8').ajaxForm(opts).ajaxForm(opts).ajaxForm(opts); 804 | $('#submitForm8')[0].click(); 805 | }); 806 | 807 | it('ajaxFormUnbind', function() { 808 | $('#targetDiv').empty(); 809 | // stop(); 810 | 811 | var opts = { 812 | target: '#targetDiv', 813 | beforeSubmit: function(a, jq) { // pre-callback 814 | assert.ok(true, 'pre-callback'); 815 | }, 816 | success: function() { 817 | assert.ok(true, 'post-callback'); 818 | // start(); 819 | } 820 | }; 821 | 822 | // expect(0); 823 | // multiple binds 824 | $('#form9').ajaxForm(opts).submit(function() { 825 | return false; 826 | }); 827 | $('#form9').ajaxFormUnbind(opts); 828 | $('#submitForm9')[0].click(); 829 | 830 | // setTimeout(start, 500); 831 | }); 832 | 833 | it('naked hash', function() { 834 | $('#actionTest1').ajaxSubmit({ 835 | beforeSerialize: function($f, opts) { 836 | assert.ok(true, 'url=' + opts.url); 837 | } 838 | }); 839 | assert.ok(true, 'ajaxSubmit passed'); 840 | }); 841 | it('hash only', function() { 842 | $('#actionTest2').ajaxSubmit({ 843 | beforeSerialize: function($f, opts) { 844 | assert.ok(true, 'url=' + opts.url); 845 | } 846 | }); 847 | assert.ok(true, 'ajaxSubmit passed'); 848 | }); 849 | it('empty action', function() { 850 | $('#actionTest3').ajaxSubmit({ 851 | beforeSerialize: function($f, opts) { 852 | assert.ok(true, 'url=' + opts.url); 853 | } 854 | }); 855 | assert.ok(true, 'ajaxSubmit passed'); 856 | }); 857 | it('missing action', function() { 858 | $('#actionTest4').ajaxSubmit({ 859 | beforeSerialize: function($f, opts) { 860 | assert.ok(true, 'url=' + opts.url); 861 | } 862 | }); 863 | assert.ok(true, 'ajaxSubmit passed'); 864 | }); 865 | 866 | it('success callback params', function() { 867 | var $testForm; 868 | 869 | $('#targetDiv').empty(); 870 | // stop(); 871 | 872 | if (/^1\.3/.test($.fn.jquery)) { 873 | // expect(3); 874 | $testForm = $('#form3').ajaxSubmit({ 875 | success: function(data, status, $form) { // jQuery 1.4+ signature 876 | assert.ok(true, 'success callback invoked'); 877 | assert.ok(status === 'success', 'status === success'); 878 | assert.ok($form === $testForm, '$form param is valid'); 879 | // start(); 880 | } 881 | }); 882 | 883 | } else { // if (/^1\.4/.test($.fn.jquery)) { 884 | // expect(6); 885 | $testForm = $('#form3').ajaxSubmit({ 886 | success: function(data, status, xhr, $form) { // jQuery 1.4+ signature 887 | assert.ok(true, 'success callback invoked'); 888 | assert.ok(status === 'success', 'status === success'); 889 | assert.ok(true, 'third arg: ' + typeof xhr != undefined); 890 | assert.ok(!!xhr != false, 'xhr != false'); 891 | assert.ok(xhr.status, 'xhr.status == ' + xhr.status); 892 | assert.ok($form === $testForm, '$form param is valid'); 893 | // start(); 894 | } 895 | }); 896 | } 897 | }); 898 | 899 | it('forceSync', function() { 900 | $('#targetDiv').empty(); 901 | // stop(); 902 | 903 | // expect(2); 904 | var $testForm = $('#form3').ajaxSubmit({ 905 | forceSync: true, 906 | success: function(data, status, $form) { // jQuery 1.4+ signature 907 | assert.ok(true, 'success callback invoked'); 908 | assert.ok(status === 'success', 'status === success'); 909 | // start(); 910 | } 911 | }); 912 | }); 913 | 914 | }); 915 | --------------------------------------------------------------------------------