2017-06-27 6 views
0

私はちょっとした初心者です。以下のコードで試してみました。しかし、 "ログインボタン"は動作しません。どんな助けも非常に高く評価されるでしょう。sqlite + jquery + login page

HTMLコード

<div data-role="page" id="loginpage"> 
    <div id="header" data-theme="b" data-role="header"> 
     <h3>Login</h3> 
    </div> 
    <div id="wrapper"> 
     <form action="" name="mylogin"> 
      <div data-role="content"> 
       <div class="username" data-role="fieldcontain"> 
        <label for="username"> Username </label> 
        <input name="username" id="username" placeholder="enter username" value="" type="text"> 
       </div> 
       <div class="psw" data-role="fieldcontain"> 
        <label for="psw"> Password </label> 
        <input name="password" id="psw" placeholder="enter password" value="" type="text"> 
       </div> 
       <input id="login" value="Login" type="button" name="Login" onclick="validationcheck();"> 
      </div> 
     </form> 
    </div> 
</div> 

JS

function validationcheck(){ 
var uname = ""; 
var pasw = ""; 
var username = document.getElementById("username").value; 
var password = document.getElementById("psw").value; 
if(username == uname && password == pasw){ 
    $.mobile.changePage("#page1"); 
}else{alert("login failed"); 
}} 

SQLiteデータベース

function getregistdata(tx){ 
tx.executeSql('SELECT username, password FROM Registration', [], getlogin_success, transaction_error);} 

function getlogin_success(tx, results){ 
var uname = ""; 
var pasw = ""; 
var len = results.rows.length; 
alert("DEMO table: " + len + " rows found."); 
for (var i=0; i<len; i++) { 
uname = results.rows.item(i).username; 
    pasw = results.rows.item(i).password;  
    }} 
+1

「機能しない」とはどういう意味ですか? –

+0

これは間違ったことを理解するのに役立ちます:https://stackoverflow.com/questions/9530954/how-to-call-external-javascript-function-in-html – davidl

+0

ありがとう@FlorianSemm ...「ログインボタン」をクリックすると、 username = unameとpassword = pasw ...#page1には行かないでください。 Unameとpaswはsqliteデータベースのデータです。私はsqliteデータベースが良いondeviceready()を試してみました – yazid

答えて

0

var db; 
 

 
try { 
 
    db = openDatabase('app', '1.0', 'description', 2 * 1024 * 1024); 
 
} catch (e) { 
 
    console.log(e); 
 
} 
 

 
try { 
 
    db.transaction(function(tx) { 
 
    var sql; 
 

 
    /* 
 
    sql = `DROP TABLE Persons`; 
 

 
    tx.executeSql(sql, [], function(tx, result) { 
 
     console.log('RESULT:', result); 
 
    }, function(tx, error) { 
 
     console.log('ERROR:', error); 
 
    }); 
 
    */ 
 

 
    sql = ` 
 
     CREATE TABLE IF NOT EXISTS Persons (
 
     id INTEGER PRIMARY KEY AUTOINCREMENT, 
 
     username VARCHAR(100) NOT NULL UNIQUE, 
 
     password VARCHAR(100) NOT NULL 
 
    ); 
 
    `; 
 

 
    tx.executeSql(sql, [], function(tx, result) { 
 
     console.log('RESULT:', result); 
 
    }, function(tx, error) { 
 
     console.log('ERROR:', error); 
 
    }); 
 

 
    /* 
 
    sql = ` 
 
     SELECT * FROM Persons WHERE username='admin' 
 
    `; 
 

 
    tx.executeSql(sql, [], function(tx, result) { 
 
     if (result.rows.length == 1) 
 
     { 
 
     var user = result.rows.item(0); 
 
     console.log(user); 
 
     } 
 
    }, function(tx, error) { 
 
     console.log('ERROR:', error); 
 
    }); 
 
    */ 
 

 
    /* 
 
    sql = ` 
 
     INSERT INTO Persons (
 
     username, 
 
     password 
 
    ) VALUES (
 
     'admin', 
 
     'admin' 
 
    ); 
 
    `; 
 

 
    tx.executeSql(sql, [], function(tx, result) { 
 
     console.log('RESULT:', result); 
 
    }, function(tx, error) { 
 
     console.log('ERROR:', error); 
 
    }); 
 
    */ 
 

 
    }); 
 
} catch (e) { 
 
    console.log(e) 
 
} 
 

 
function validationcheck() { 
 
    if (document.mylogin.username.value == "") { 
 
    console.log('please enter username'); 
 
    document.mylogin.username.focus(); 
 
    } else if (document.mylogin.psw.value == "") { 
 
    console.log('please enter password'); 
 
    document.mylogin.password.focus(); 
 
    } else { 
 
    var username = document.mylogin.username.value; 
 
    var password = document.mylogin.password.value; 
 
    try { 
 

 
     db.transaction(function(tx) { 
 
     tx.executeSql(`SELECT * FROM Persons WHERE username='${username}'`, [], function(tx, result) { 
 
      if (result.rows.length == 1) { 
 
      var user = result.rows.item(0); 
 

 
      if (username == user.username && password == user.password) { 
 
       console.log('LOGIN SUCCESS'); 
 
      } else { 
 
       console.log('LOGIN FAILURE'); 
 
      } 
 
      } 
 
     }, function(tx, error) { 
 
      console.log('ERROR:', error); 
 
     }); 
 
     }); 
 

 
    } catch (e) { 
 
     console.log(e); 
 
    } 
 
    } 
 
}
<div data-role="page" id="loginpage"> 
 
    <div id="header" data-theme="b" data-role="header"> 
 
    <h3>Login</h3> 
 
    </div> 
 
    <div id="wrapper"> 
 
    <form action="" name="mylogin"> 
 
     <div data-role="content"> 
 
     <div class="username" data-role="fieldcontain"> 
 
      <label for="username"> Username </label> 
 
      <input name="username" id="username" placeholder="enter username" value="" type="text"> 
 
     </div> 
 
     <div class="psw" data-role="fieldcontain"> 
 
      <label for="psw"> Password </label> 
 
      <input name="password" id="psw" placeholder="enter password" value="" type="text"> 
 
     </div> 
 
     <input id="login" value="Login" type="button" name="Login" onclick="validationcheck();"> 
 
     </div> 
 
    </form> 
 
    </div> 
 
</div>

+0

https://embed.plnkr.co/bCWzD5PqHFWLCKA2zObb/ –

+0

ありがとう@ウィリアムValhakis ....しかし、動作していません...情報..私はjqueryモバイル1.4.5を使用しています。 ..ログインボタンをクリックすると... referenceerror:db私は定義されていません...なぜですか?とondeviceready、私は使用します:var db = window.sqlitePlugin.openDatabase({name: 'amolefDB.db'、location: 'default'}); ..thanks – yazid

+0

ありがとう...私はmodifikasi:var db = window.sqlitePlugin.openDatabase({name: 'amolefDB.db'、場所: 'default'})の下で "試して" ...成功しました。すべて – yazid