1

フォームの送信が完了するまで「お待ちください」とユーザーに伝えるモーダル ポップアップを表示したいと考えています。

これが私の_form.phpの一部です(読み取り可能な提案のために切り取っただけです):

<?php $form=$this->beginWidget('CActiveForm', array(
    'id'=>'event-form',
        'enableClientValidation' => true,
        'clientOptions'=> 
              array('validateOnSubmit'=>true, 
                'afterValidate'=>'js:function() {     
                         $("#publishErrors").empty();
                         $("#event-form_es_").empty();
                         i = true;
                         if($("#EntityEvent_active").is(":checked"))
                         {
                          $("#publishErrors").show().append("<p>Please check:</p>")
                          if($("#Event_name").val()=="")
                          {
                            $("#Event_name").addClass("error"); 
                            ...
                            ...

私はこのプロセスで少し迷っていることを告白します.これがうまくいくかどうかはまだわかりません.

私はこれを置くことを考えています：

$this->beginWidget('zii.widgets.jui.CJuiDialog'
        , array('options'=>array(
            'title'=>'My Title'
            , 'modal'=>true
            ))
);

echo 'Please Wait While Your Form is Being Submitted';

$this->endWidget('zii.widgets.jui.CJuiDialog');

「afterValidate」の最後に -

より良いアプローチはありますか？

ご意見をお聞かせください

4

1 に答える 1

1

このための jquery プラグインがすでにあります: jQuery BlockUI plugin。

ただし、CJuiDialog を使用する場合は、 is 、closeOnEscapeis false、modalisであることを確認してください。trueautoOpenfalse

必要に応じて、CJuiDialog 内でjQueryUI Progressbarを使用して進行状況を表示することもできます。

編集：

ダイアログの x ボタンを非表示にするサンプル コード:

$this->beginWidget('zii.widgets.jui.CJuiDialog',
    array(
        'id'=>'mywaitdialog',
        'options'=>array(
            'title'=>'My Title',
            'modal'=>true,
            'autoOpen'=>false,// default is true
            'closeOnEscape'=>false,
            'open'=>// supply a callback function to handle the open event
                    'js:function(){ // in this function hide the close button
                         $(".class-of-closebutton").hide();
                    }'
         ))
);

ダイアログを開くには: $("#mywaitdialog").dialog("open");.

ご想像のとおり、afterValidate でダイアログを開くことができます。フォーム データがサーバーに渡される間、ダイアログが表示され、完了後に URL ナビゲーションが発生します (新しいページが読み込まれます)。

于 2012-07-12T08:13:47.897 に答える