5

モーダルダイアログでwindow.confirm関数をオーバーライドしてみたい。

    <a href="http://example.com" onClick="return confirm('you want to go?')">

    <script>
        window.confirm = function(message){
            $("#confirm-dialog").modal('show');
            $("#confirm-dialog .modal-body p").html(message);
            $("#confirmYes").on("click", function () {
                return true;
            });

        }
    </script>

#confirmYes要素のモーダルウィンドウをクリックするとtrueが返されますが、hrefリンクによるリダイレクトが機能しません...なぜですか?

リンクを変更せずにこのことを行う方法を誰かに教えてもらえますか?ありがとう

UPD YiiフレームワークはCGridViewウィジェットのコードを生成し、それをオーバーライドしたいと思います。フレームワークにあるため、このコードを変更することはできません。代わりに、これは標準を確認します。モーダルウィンドウを使用します

 $(document).on('click','#product-grid a.delete',function() {
   if(!confirm('Are you sure you want to delete this item?')) return false;
   var th=this;
   var afterDelete=function(){};
   $.fn.yiiGridView.update('product-grid', {
       type:'POST',
       url:$(this).attr('href'),
       success:function(data) {
           $.fn.yiiGridView.update('product-grid');
           afterDelete(th,true,data);
       },
       error:function(XHR) {
           return afterDelete(th,false,XHR);
       }
   });
   return false;
  });
4

5 に答える 5

1

Js のデフォルトの確認ダイアログは同期的に動作します。これは、コードがユーザーが続行を選択するのを待つことを意味します。このように確認ダイアログをオーバーライドすると、新しいスタイリッシュな確認ダイアログが表示されますが、メソッドはすぐに終了して戻りますundefined

コールバックを操作できます。

<a href="http://example.com" onClick="confirm('you want to go?', function(result){ 
    if(result)
      //code to redirect, like window.location(this.href);
}); return false;">

それから:

<script>
    window.confirm = function(message, cb){
        $("#confirm-dialog").modal('show');
        $("#confirm-dialog .modal-body p").html(message);
        $("#confirmYes").on("click", function (userChoice) {
            cb(userChoice); //true or false - your jquery plugin will supply this value 
        });

    }
</script>

EDIT : SEO の理由から、(「/#」をそのままにするのではなく) href にリンク URL を保持することが重要です。リンクがトリガーされないようにするには、新しい確認ダイアログを呼び出した後に false を返す必要もあります。

于 2012-10-05T14:13:21.017 に答える
0

古い投稿であることは知っていますが、私の解決策を共有したいと思います。これにより yii のデフォルトの動作が変更されることはわかっていますが、同じように機能する 1 つのカスタムの関数を置き換えました。より良い方法について、またはもし将来、これは簡単に行うことができます。

Framework/yii/zii/widgets/grid/CButtonColumn.php で、initDefaultButtons を変更します。

/** * デフォルトのボタン (表示、更新、削除) を初期化します。*/

    protected function initDefaultButtons()
    {
        if($this->viewButtonLabel===null)
            $this->viewButtonLabel=Yii::t('zii','View');
        if($this->updateButtonLabel===null)
            $this->updateButtonLabel=Yii::t('zii','Update');
        if($this->deleteButtonLabel===null)
            $this->deleteButtonLabel=Yii::t('zii','Delete');
        if($this->viewButtonImageUrl===null)
            $this->viewButtonImageUrl=$this->grid->baseScriptUrl.'/view.png';
        if($this->updateButtonImageUrl===null)
            $this->updateButtonImageUrl=$this->grid->baseScriptUrl.'/update.png';
        if($this->deleteButtonImageUrl===null)
            $this->deleteButtonImageUrl=$this->grid->baseScriptUrl.'/delete.png';
        if($this->deleteConfirmation===null)
            $this->deleteConfirmation=Yii::t('zii','Are you sure you want to delete this item?');

        foreach(array('view','update','delete') as $id)
        {
            $button=array(
                'label'=>$this->{$id.'ButtonLabel'},
                'url'=>$this->{$id.'ButtonUrl'},
                'imageUrl'=>$this->{$id.'ButtonImageUrl'},
                'options'=>$this->{$id.'ButtonOptions'},
            );
            if(isset($this->buttons[$id]))
                $this->buttons[$id]=array_merge($button,$this->buttons[$id]);
            else
                $this->buttons[$id]=$button;
        }

        if(!isset($this->buttons['delete']['click']))
        {
            if(is_string($this->deleteConfirmation))
                $confirmation="if(!confirm(".CJavaScript::encode($this->deleteConfirmation).")) return false;";
            else
                $confirmation='';

            if(Yii::app()->request->enableCsrfValidation)
            {
                $csrfTokenName = Yii::app()->request->csrfTokenName;
                $csrfToken = Yii::app()->request->csrfToken;
                $csrf = "\n\t\tdata:{ '$csrfTokenName':'$csrfToken' },";
            }
            else
                $csrf = '';

            if($this->afterDelete===null)
                $this->afterDelete='function(){}';



    $withConfirmation    = strlen($confirmation) == 0 ? 0 : 1;
    $confirmationMessage =  CJavaScript::encode($this->deleteConfirmation);

    $this->buttons['delete']['click']=<<<EOD

    `function(event) {
    event.preventDefault();

    if ($withConfirmation){
        var th=this;
        var afterDelete=$this->afterDelete;
        var deleteUrl=$(this).attr('href');
        console.log(deleteUrl); 
        $(document.createElement('div')).attr({
            title:'Atención',
            'class': 'dialog'
        }).html($confirmationMessage).dialog({
            buttons: {
                "OK": function () {
                    $(this).dialog('close');                    
                    $.fn.yiiGridView.update('{$this->grid->id}', {
                        type:'POST',
                        url:deleteUrl,$csrf
                        success:function(data) {
                            $.fn.yiiGridView.update('{$this->grid->id}');
                            afterDelete(th,true,data);
                        },
                        error:function(XHR) {
                            return afterDelete(th,false,XHR);
                        }
                    });
                    return true;
                },
                "Cancel": function () {
                    $(this).dialog('close');
                    return false;
                }
            },
            close: function () {
                $(this).remove();
            },
            draggable: false,
            modal: true,
            resizable: false,
            width: 'auto'
        }).position({
           my: "center",
           at: "center",
           of: window
        });

    }
}
EOD;
    }
}
`

編集:

また、コア yii を変更せずにそれを行う方法も学びました。

ウィジェット グリッドでは、次のようなボタンのファイルを作成します。

array
        (
            'class'=>'CButtonColumn',
            'deleteConfirmation'=>'Atencion',
            'buttons'=>array
            (
                    'update'=>array
                    (
                            'imageUrl'=>FALSE,
                            'label'=>'update',
                            'options'=>array('title'=>'update'),
                            'visible'=>'$row > 0'
                    ),
                    'delete'=>array
                    (
                            'imageUrl'=>FALSE,
                            'label'=>'delete',
                            'options'=>array('title'=>'delete'),
                            'click'=>'function(){$("#mydialog").dialog("open"); return false;}',
                    ),
            ),
            'template'=>'{update} | {delete}'
        ),  
于 2014-11-30T23:18:30.690 に答える
0

window.alert() ダイアログボックスをオーバーライドする必要がある場合は、ここで見つけることができます

その後、私は自分自身を作成し​​ました window.confirm() ダイアログボックスをオーバーライドすると、ここで見つけることができます

window.confirm() ダイアログ ボックスをオーバーライドします。

次のように非常に簡単です。

window.confirm = function(message, title, doYes) {
        $(document.createElement('div'))
                .attr({title: title, class: 'confirm'})
                .html(message)
                .dialog({
            buttons: {
                "Confirm": function() {
                    $(this).dialog("close");
                    if (doYes && (typeof doYes === "function")) {
                        doYes();
                    } 
                },
                "Cancel": function() {
                    $(this).dialog("close");
                }
            }
            ,
            close: function() {
                $(this).remove();
            },
            draggable: true,
            modal: true,
            resizable: false,
            width: 'auto'
        });
    };

// New confirm
//confirm('This is a <strong>new</strong> alert!','Confirm', function(){alert('Yes')},function(){alert('No')});
于 2014-03-12T11:24:47.013 に答える
-3

onclick に return を追加してみてください:

a href="http://example.com" onclick="return confirm("you want to go?")">
于 2012-10-05T14:02:03.673 に答える