みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

javascriptでログインページの作成

JSPを作成しているのですが、javascirpt構文の方が
多いため、こちらで質問をさせて頂きます。

javascript, html で ログインページを作成しています。

<%@ page contentType="text/html;charset=Shift_JIS" %>


<script type="text/javascript" language="javascript"><!--
    function Submit(name,pass,f){
 if(name == null){
document.getElementBy(f).action="http://www.yahoo.co.jp";
document.getElementById(f).submit();
}else{
document.getElementById(f).action="http://www.google.co.jp";
document.getElementById(f).submit();
}
}

//--></script>
<form action="login.jsp" method="post" NAME="f1">

<table border="1" width="30%">
<tr>
<td>ユーザーID:</td>
<td><input type="text" name="admin" size="25" value=""></td>
</tr>
<tr>
<td>パスワード:</td>
<td><input type="password" password="password" value=""></td>
</tr>
</table>

<%--- これが悪いのかも!? --- %>
<% String name = request.getParameter("name");
String password= request.getParameter("password");
%>
<input type="submit" value="ログイン" onClick="Submit('name','password','f1');">
</form>
</body>
</html>

ログインボタンをクリックして、name,password,f1(formの名前)を
function のSubmitに値を渡したいのですが、nullが渡されてしまいます。

テキストボックスで入力された値を渡したいのですが、
javascript,htmlの知識が乏しいため、どこがおかしいのかわかりません。

もしわかる方が居ましたら、よろしくお願いたします。

投稿日時 - 2007-03-19 22:18:14

QNo.2847978

困ってます

質問者が選んだベストアンサー

> admin (入力された値)
> password (入力された値)
これは期待するとおりに出力され、期待するとおりの表示ですか?

JSPをされているならname属性やid属性についてはご存じと思いますが、
両方を明記しておいたほうがいいです。
モダンブラウザは片方が書かれていれば、もう片方を同じ内容で補完しますが、nameのみの場合idを補完しないブラウザもあります(getElementByIdで取得出来ません)し、
idのみの場合、古いブラウザでnameを補完せずにvalueだけを送信する物もあります。
> <td><input type="password" password="password" value=""></td>
この辺は直されたようですが。。。


質問の内容と関係ないところでFAQでもありますが、一応解説しておきます。

フォームの内容をチェックするタイミングですが、
> <input type="submit" value="ログイン" onClick="Submit('name','password','f1');">
このタイミングでチェックを始めると、テキストフィールドやパスワードフィールドでエンターキー(リターンキー)を押した場合、
submitボタンは押されていませんから、関数は呼び出されません。
<form (中略) onsubmit="Submit()">
というタイミングでチェックするようにしてください。

本題ですが、あらかじめお断りしますが、ヒントだけです。

getElementByIdは知っていらっしゃるようですから、
フォームエレメント(<input type="text">など)の値(.value)を取得するには、どうすればいいか、わかりますよね?(リファランスに書かれているはずです)
あとはSubmit()への引数やdocument.getElementByIdの引数をどの様に指定すればいいかだけだと思います。

投稿日時 - 2007-03-20 22:35:13

お礼

お返事ありがとうございます。javascriptの勉強を
してもう一度取り組んでみたいと思います。

お答え頂きありがとうございました。

投稿日時 - 2007-03-24 09:26:14

ANo.2

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.1

JSPの部分が何をしているわイマイチわかりにくいので、
ブラウザでアクセスして「ソースを表示」した内容を提示していただけますか?

投稿日時 - 2007-03-20 08:21:17

補足

お返事ありがとうございます。
これがソースです。間違いがあったので変更はしました。

<script type="text/javascript" language="javascript"><!--
   function Submit(name,pass,f){
   //if(name != null){
//document.getElementById(f).action="http://www.yahoo.co.jp";
//document.getElementById(f).submit();
   //}else if( name == null){
//document.getElementById(f).action="http://www.excite.co.jp";
//document.getElementById(f).submit();
//}
}
//--></script>
</head>
<form action="login.jsp" method="post" NAME="f1">
<table border="1" width="30%">
<tr>
<td>ユーザーID:</td>
<td><input type="text" name="admin" size="25" value=""></td>
</tr>

<tr>
<td>パスワード:</td>
<td><input type="password" name="password" value=""></td>
</tr>
</table>

admin (入力された値)
password (入力された値)

<input type="submit" value="ログイン" onClick="Submit('name','password','f1');">
</form>
</body>
</html>

テキストボックスで入力された値を、name , passwordの変数で
受け取り、それをonSubmit()中に渡そうと思っています。

name, password を渡す事が出来てないのはわかりますが
どう解決したらいいのかわかりません。

ちなみにテキストボックスに名前を入れても、入れなくても
yahooが表示されてしまいます。 よろしくお願いいたします。

投稿日時 - 2007-03-20 10:57:08

あなたにオススメの質問