Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 8th, 2012  |  syntax: JavaScript  |  size: 1.66 KB  |  hits: 24  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. // If I click the submit-button, the data should be send via ajax. Opening of the file that is set in the action-attribute in the form-element should be prevented. But it doesn't prevent, it actually opens the site. What did I do wrong here?
  2.  
  3. //Javascrpt (jQuery)
  4.  
  5.         function ajaxForm(action, field, value) {
  6.                 var url, data, formId;
  7.                 if (field && value) {
  8.                         data = field + '=' + value;
  9.                 }
  10.                 if (action === 'regForm') {
  11.                         formId = '#' + action;
  12.                         url = $(formId).getAttr('action');
  13.                         if (!field && !value) {
  14.                                 data = $(formId).serialize();
  15.                         }
  16.                 }
  17.                 hideshow('loading', 1);
  18.                 error(0);
  19.                 success(0);
  20.                 $.ajax({
  21.                         type:           "POST",
  22.                         url:            url,
  23.                         data:           data,
  24.                         dataType:       "json",
  25.                         success:        function (msg) {
  26.                                                         if (parseInt(msg.status, 10) === 1) {
  27.                                                                 success(1, msg.txt);
  28.                                                         } else if (parseInt(msg.status, 10) === 0) {
  29.                                                                 error(1, msg.txt);
  30.                                                         }
  31.                                                         hideshow('loading', 0);
  32.                                                 }
  33.                 });
  34.         }
  35.  
  36.         $('#regForm').submit(function (e) {
  37.                 ajaxForm('regForm');
  38.                 e.preventDefault();
  39.         });
  40.  
  41. // HTML
  42.  
  43. <form id="regForm" action="functions/register.php" method="post">
  44. <table>
  45.   <tr>
  46.     <td><label for="username">Username</label></td>
  47.     <td><input name="username" id="username" type="text"></td>
  48.   </tr>
  49.   <tr>
  50.     <td><label for="email">E-Mail</label></td>
  51.     <td><input name="email" id="email" type="text"></td>
  52.   </tr>
  53.   <tr>
  54.         <td><label for="password">Passwort</label></td>
  55.     <td><input name="password" id="password" type="password"></td>
  56.   </tr>
  57.   <tr>
  58.         <td>&nbsp;</td>
  59.         <td><input type="submit" value="Registrieren"><img id="loading" src="img/ajax-loader.gif" alt="Laden..."></td>
  60.   </tr>
  61. </table>
  62. </form>