我看到其他问题说解决方案是设置 autoOpen = true 但我不想让 autoopen 为 true。
无论如何要让 fcbkcomplete 在没有 autoOpen = true 的情况下处理 jquery 对话框。
我看到其他问题说解决方案是设置 autoOpen = true 但我不想让 autoopen 为 true。
无论如何要让 fcbkcomplete 在没有 autoOpen = true 的情况下处理 jquery 对话框。
ooo 什么似乎不起作用?你能解释一下你想要做的更多吗?只是我已经设置了基本的 FCBKcomplete 演示,将它放在一个对话框中并触发它,它会建议一些事情 - 你能举一个不适合你的例子吗?
这是我使用的代码:
HTML:
<div id="myDialog">
<h1>FCBKcomplete Demo</h1>
<form action="submit.php" method="POST" accept-charset="utf-8">
<select id="select3" name="select3">
<option value="test1">sleep</option>
<option value="test3">sport</option>
<option value="test3">freestyle</option>
<option value="2">Терешкова Валентина</option>
</select>
<br/>
<br/>
<input type="submit" value="Send">
</form>
</div>
<input type="button" id="trigger" value="Open Dialog" />
和javascript:
$("#myDialog").dialog({
autoOpen: false,
width: 550,
modal: true,
title: "FCBKcomplete Trial"
});
$("#select3").fcbkcomplete({
json_url: "/echo/json/",
addontab: true,
cache: true,
height: 2
});
$("#trigger").click(function() {
$("#myDialog").dialog('open');
}).button();
它的演示在这里
请耐心等待,该示例占用了大量代码。现在有三个例子,两个有效,一个无效。
简要说明,jQuery 代码通常在页面加载完成时运行。当所有项目都在那里时,它完成加载。因此,当您使用 ajax 添加项目时,您最初所做的任何事情都不会影响新项目。因此,现在您需要再次执行操作,以便新项目受到影响。
注意:由于我无法使用 ajax 加载 HTML,因此我通过单击模拟了它...
// EXAMPLE ONE: (working)
$("#dialogOne").dialog({
autoOpen: false,
width: 550,
modal: true,
title: "FCBKcomplete Trial"
});
$("#selectOne").fcbkcomplete({
json_url: "/echo/json/",
addontab: true,
cache: true,
height: 2
});
$("#triggerOne").click(function() {
$("#dialogOne").dialog('open');
}).button();
// ABOVE SHOULD WORK CORRECTLY: its static DOM items,
// there is a little clue for later......
// EXAMPLE TWO: (broken)
// Replicate loading data - as though it had been returned from ajax:
$("#loadTwo").click(function() {
// Add the data to the end of the page:
$("body").append(''
+'<div id="dialogTwo"> '
+' <h1>FCBKcomplete Demo Two</h1> '
+' <form action="submit.php" method="POST" accept-charset="utf-8"> '
+' <select id="selectTwo" name="selectTwo"> '
+' <option value="test1">sleep</option> '
+' <option value="test3">sport</option> '
+' <option value="test3">freestyle</option> '
+' <option value="2">Терешкова Валентина</option> '
+' </select> '
+' <br/> '
+' <br/> '
+' <input type="submit" value="Send"> '
+' </form> '
+' </div>'
+' <input type="button" id="triggerTwo" value="Open Dialog Two" /><br/><br/');
}).button();
// Just as before setup the dialog (buuuut, the div isn't there yet ;) ):
$("#dialogTwo").dialog({
autoOpen: false,
width: 550,
modal: true,
title: "FCBKcomplete Trial"
});
// Initiate the FCBKcomplete (buuuut, the select input isn't there yet ;) ):
$("#selectTwo").fcbkcomplete({
json_url: "/echo/json/",
addontab: true,
cache: true,
height: 2
});
// Add a listener to show the dialog containing the FCBKcomplete...:
$("#triggerTwo").click(function() {
$("#dialogTwo").dialog('open');
}).button();
// ABOVE SHOULD FAIL: It will load the 'dynamic' items (imagine
// $("body").append(....); being the success callback of an ajax
// function loading data) but remember, the other code runs when
// the page is ready, buuut the items aren't actually there yet!
// EXAMPLE THREE: (working)
// Replicate loading data - as though it had been returned from ajax:
$("#loadThree").click(function() {
// Add the data to the end of the page:
$("body").append(''
+'<div id="dialogThree"> '
+' <h1>FCBKcomplete Demo Three</h1> '
+' <form action="submit.php" method="POST" accept-charset="utf-8"> '
+' <select id="selectThree" name="selectThree"> '
+' <option value="test1">sleep</option> '
+' <option value="test3">sport</option> '
+' <option value="test3">freestyle</option> '
+' <option value="2">Терешкова Валентина</option> '
+' </select> '
+' <br/> '
+' <br/> '
+' <input type="submit" value="Send"> '
+' </form> '
+' </div>'
+' <input type="button" id="triggerThree" value="Open Dialog Three" /><br/><br/');
// This time setup the dialog INSIDE the 'success' callback:
$("#dialogThree").dialog({
autoOpen: false,
width: 550,
modal: true,
title: "FCBKcomplete Trial Three"
});
// Initiate the FCBKcomplete again INSIDE the 'success' callback:
$("#selectThree").fcbkcomplete({
json_url: "/echo/json/",
addontab: true,
cache: true,
height: 2
});
// Add a listener to show the dialog containing the FCBKcomplete:
$("#triggerThree").click(function() {
$("#dialogThree").dialog('open');
}).button();
}).button();
// ABOVE SHOULD WORK: Now the data is being loaded dynamically,
// just as example two. However this time we initiate the dialog
// and FCBKcomplete from the 'success' callback. That way, the
// dynamic HTML has already been loaded, so when you try to intiate
// them they will work!
更新的演示在这里
鉴于您的反馈,这里是一个更新。
$( ".selector" ).dialog({
open: function(event, ui)
{
$("element").fcbkcomplete({
json_url: "fetched.txt",
cache: true,
filter_case: true,
filter_hide: true,
newel: true
});
}
});
希望有帮助。