0

各フォームを 1 回送信すると、ページ上のフォームが消える状況があります。たとえば、ユーザー名とパスワードのログイン プロンプトが (Jquery Mobile を使用して) 表示され、ダイアログ ボックスが正常に表示され、入力が処理および検証され、ログインが成功するとメイン ページが表示されます。ただし、ログオフしてから再度ログインしようとすると、ページ ヘッダーだけが表示されます。入力フィールドとラベルはありません。

単一の入力フィールドがあり、そこにテキストが入力され、$.post 呼び出しが行われ、HTML が返され、要素が $('#results').html(dataReceived を使用して結果で更新される別のページがあります。 ) 関数呼び出し。

結果が表示されると、フォームが消えているようです。これはページのテキストです:

<div data-role="page" id="Search" data-title="Search">
<div data-role="header" data-theme="e">
<h1>Search</h1>                
</div>
<div data-role="content">                
<form name="SearchForm" action="search.php">
SSN: <input type=number name="snum" size="9" value=""><br>
<input id="SearchButton" type="submit" value="Begin Search" data-inline="true">
</form>
<div id=SearchResults></div>
</div><!-- /content -->
</div><!-- /Search -->

フォームの送信イベントをインターセプトし、別の場所で処理します。$.post AJAX 呼び出しのコールバック関数で div コンテンツを設定するコードは次のとおりです。

$('#SearchResults').html(dataReceived);

一般情報: jquery および jquery mobile の最新の安定バージョン。これは複数ページのファイルです。外部ページは呼び出されません。すべては $.post 呼び出しで行われます。ログイン フォームは HTML を更新しません。単にユーザーの ID を受け取り、それを変数に格納します。

どんな助けでも大歓迎です。グーグルはこれに関して私の友人ではありませんでした。

フォーム送信コードを表示するように修正:

$(document).ready(function() {
        $('form').submit(function(event) {
                event.preventDefault();
                var thisForm=$(this);
                var formUrl=thisForm.attr('action');
                var formName=thisForm.attr('name');
                var dataToSend=thisForm.serialize();
                var callBack=function(dataReceived) {
                        thisForm.hide();
                        switch(formName) {
                            case 'loginForm':
                            if (dataReceived.length>0 && parseInt(dataReceived)>0) {
                                   loggingIn=0;
                                   userId=parseInt(dataReceived);
                                   $.mobile.changePage("#home");
                                   break;
                            }
                            thisForm.show();
                            break;

                            case 'SearchForm':
                                    $('#SearchResults').html(dataReceived);
                                    break;
                        }
                };
                dataToSend += '&seid=' + SESSID;
                var rtnType="html";
                switch(formName) {
                        case "loginForm":
                                rtnType="text";
                                break;
                        case 'SearchForm':
                                break;
                }
                $.post(formUrl,dataToSend,callBack,rtnType);
                return false;
        });
4

1 に答える 1

1

送信コールバック関数でフォームを非表示にしています:

thisForm.hide();

「loginForm」の場合は show() を呼び出していますが、「SearchForm」の場合はフォームで show() を呼び出していません。

            var callBack=function(dataReceived) {
                    thisForm.hide();
                    switch(formName) {
                        case 'loginForm':
                          if (dataReceived.length>0 && parseInt(dataReceived)>0) {
                               loggingIn=0;
                               userId=parseInt(dataReceived);
                               $.mobile.changePage("#home");
                               break;
                          }
                          thisForm.show();
                          break;
                        case 'SearchForm':
                          $('#SearchResults').html(dataReceived);
                          break;
                    }
            };
于 2012-06-28T14:03:51.110 に答える