event.preventDefault() que no impide el envío de formularios en el evento .live() de jQuery Mobile

Question

Estoy tratando de evitar el envío de un formulario de inicio de sesión para poder consultar un servidor, verificar un nombre de usuario y contraseña, y solo entonces pasar al página de inicio

Aquí está el código correspondiente:

En login.html:

 <form id="login-form"> 
      <input type="text" name="login-username" id="login-username" value="" placeholder="Username" /> 
      <input type="password" name="login-password" id="login-password" value="" placeholder="Password" /><br /> 
      <button id="cab-submit" type="submit" data-theme="a" data-inline="true">Log In</button> 
     </form> 

En app.js:

$("#login-form").live("submit", function(event) { 
     event.preventDefault(); 
     $.mobile.changePage("main.html", { 
      transition: "fade" 
     }); 
    }); 

Soy un programador experimentado jQuery pero nunca se han topado con este . El changePage() funciona pero solo ocurre después de que el formulario envía, lo que causa una carga de página innecesaria.

EDIT: Encontré la solución.

Tuve que agregar data-ajax = "false" al formulario si deseo manejar el formulario personalmente. Esto funcionó bien.

Nueva marcado:

 <form id="login-form" data-ajax="false"> 
      <input type="text" name="login-username" id="login-username" value="" placeholder="Username" /> 
      <input type="password" name="login-password" id="login-password" value="" placeholder="Password" /><br /> 
      <button id="cab-submit" type="submit" data-theme="a" data-inline="true">Log In</button> 
     </form> 

Answer 1

Respondí mi propia pregunta. Tuve que agregar data-ajax = "false" al formulario si quiero manejar el formulario personalmente. Esto funcionó bien.

Nueva marcado:

<form id="login-form" data-ajax="false"> 
     <input type="text" name="login-username" id="login-username" value="" placeholder="Username" /> 
     <input type="password" name="login-password" id="login-password" value="" placeholder="Password" /><br /> 
     <button id="cab-submit" type="submit" data-theme="a" data-inline="true">Log In</button> 
    </form> 

Answer 2

trate de cambiar el ID en el botón de enviar para id = "submit" y ver qué pasa. Parece que podría ser un problema conocido con jQuery mobile.