10

ASP.NET MVC3 / jQuery 1.9.1 / jQuery UI 1.10.2

をクリックした後にモーダル ダイアログを開くページがありますAjax.ActionLink。このダイアログ内には、入力フィールドとdatepickerそれに関連付けられた があります。初めてダイアログを開くと、datepicker ボタン (または関連付けられた入力フィールド内でフォーカスを受け取り、showOnに設定both) をクリックすると、datepicker が期待どおりに表示されます。モーダル ダイアログが開いている間は、必要なだけ何度でも実行できます。毎回、日付ピッカーが表示されます。モーダル ダイアログを閉じると (アタッチ$("ui-widget-overlay").click(function(){...});されたものを使用して再度開くと、ボタンをクリックしようとしても、関連する入力フィールドをクリックしようとしても、日付ピッカーが機能しなくなります。

jQueryコードをデバッグしようとしましたが、実行されているコード行はどちらも同じです（ダイアログが2回目に開かれたときに日付ピッカーが表示されなくても、jQueryメソッドがトリガーされます）。デバッガーで。私は完全に困惑しており、この投稿で説明されている方法は、ダイアログが最初に開いたときに日付ピッカーを表示するという点でのみ役に立ちました。別の投稿showOnは、設定がどのように機能するかの誤解にのみ関連しているようです。

また、ダイアログを閉じるときにdatepickerを破棄しようとしましたが、役に立ち$("#datepicker").datepicker("destroy");ませんでした。何か案は？

アップデート

「呼び出しページ」で：

$(document).ready(function () {
    $("#popupDialog").dialog(
    {
        autoOpen: false,
        modal: true,
        open: function()
        {
            $("ui-widget-overlay").click(function()
            {
                $("#popupDialog").dialog("close");
            }
        }
    });
});
[...]
@Ajax.ActionLink( "Some text", "Action", "Controller", new AjaxOptions {
    HttpMethod = "GET",
    UpdateTargetId = "popupDialog",
    InsertionMode = InsertionMode.Replace,
    OnSuccess = "openPopup()"
})
[...]
function openPopup()
{
    $("popupDialog").dialog("open");
}
[...]
<div id="popupDialog" style="display: none;"></div>

コントローラーのアクションは非常に単純で、次のようになります。

public ActionResult Action()
{
    MyActionModel myActionModel = new MyActionModel();
    return PartialView( myActionModel );
}
4

10 に答える 10

6

私にとってうまくいったのは-

ダイアログ内で、 class を持つ複数の入力がある場合datepicker、

$(".datepicker").removeClass('hasDatepicker').datepicker();

hasDatepicker基本的に、再度初期化する前にクラスを削除しdatepickerます。

私はjquery.ui.datepickerのバージョン1.8.18を使用していました

于 2014-05-16T13:35:23.427 に答える
0

ところで、私はそれを解決した方法を説明しようとします。なぜなら、この方法の方が簡単だと思うからです。

私はこの問題の専門家ではないので、正しい用語を使用して説明していない場合はご容赦ください。

同じページに 2 つの場所があり、datepicker をロードしたい場合、関数を複製する必要があります。

$(function() {
    $( "#datepicker" ).datepicker({
      showOn: "button",
      buttonImage: "images/calendar.png",
      buttonImageOnly: true,
      buttonText: "Select date",
      addClass:".ccCFcalV2"
    });    
});       

$(function() {
    $( "#datepicker2" ).datepicker({
      showOn: "button",
      buttonImage: "images/calendar.png",
      buttonImageOnly: true,
      buttonText: "Select date",
      addClass:".ccCFcalV2"
    });
});

クラス「datepicker2」を、datepicker を呼び出したい 2 番目の場所に追加します。それはほとんど私にとってはうまくいきます

これがばかげた解決策だと思う場合は、私に知らせてください。削除します

ごきげんよう！

于 2015-11-01T15:40:00.093 に答える
0

カレンダーを同じビューで複数回表示する必要があり、1 回しか表示されない場合は、次を試してください。

document.getElementById("div_Validade").onclick = function () { SetZIndex() };

function SetZIndex() {
    document.getElementById("ui-datepicker-div").style.zIndex = "999999";
}

div_Validade入力が配置されている div id に対応し、

ui-datepicker-div表示されていないインフラジスティックス要素です。

于 2019-09-02T11:33:27.473 に答える