0

私はASP.NETWebサイトで作業しています（MVC3ですが、私の質問ではそれほど重要ではありません）

ユーザーがJqueryモーダルダイアログを開きたいリンクをクリックすると、ページにいくつかのリンクがあります。

http://jqueryui.com/demos/dialog/#modal-message

リンクごとに異なるダイアログを表示したい。

私が理解したよう<div>に、私は自分のページのでダイアログの内容を指定する必要があります。例えば：

<div id="dialog" title="Basic dialog">
    <p>Here we put the content of the dialog</p>
</div>

リンクは動的に生成されるため、リンクごとにdivを作成したくありません。また、ダイアログの内容は、リンクによって送信されるパラメーターによって異なります。

私が欲しいものを説明しようと思います。

私がしたいのは、可能であれば次のことを行うことです。

私は1つのdivを持っています

<div id="dialog" title="Basic dialog">
</div>

ユーザーがlink1をクリックすると、関数が呼び出されますShowDialog(FirstName1, LastName1)

divこの関数は、パラメータを文字列として「ダイアログ」に追加し、ダイアログを開きます。

ユーザーがlink2をクリックすると、「div」「ダイアログ」がクリアされ、関数によって新しいコンテンツが入力されShowDialog(FirstName2, LastName2)、ダイアログが開きます。

実行する必要があるのはJqueryまたはJavascriptだけです。

はっきりしていたと思います。さらに情報が必要な場合はお問い合わせください。

4

1 に答える 1

2

firstnameとsurname値を取得する場所を指定していないためdata-*、次のようにリンクの属性に割り当てました。

<a href="#" data-firstname="Foo" data-surname="Bar">Click me</a>

$("#dialog").dialog({ /* settings */ });

$("#link2").click(function() {
    var $el = $(this);
    var fn = $el.data("firstname");
    var sn = $el.data("surname");
    ShowDialog(fn, sn);
});

function ShowDialog(firstname, surname) {
    // Here you can do whatever is required to the dialog, create elements, change text, go nuts.
    $("p", "#dialog").text("Hello " + firstname + " " + surname); 

    // Show the dialog
    $("#dialog").dialog('open');
}
于 2012-04-11T10:40:50.417 に答える