0

解決策はautoOpen=trueに設定することですが、autoopenをtrueにしたくないという他の質問があります。

autoOpen =trueなしでfcbkcompleteをjqueryダイアログで動作させる方法はありますか？

4

2 に答える 2

2

ここにあなたのフィードバックを与えられて、更新です。

$( ".selector" ).dialog({
    open: function(event, ui)
    {
        $("element").fcbkcomplete({
            json_url: "fetched.txt",
            cache: true,
            filter_case: true,
            filter_hide: true,
            newel: true
        });
    }
});

お役に立てば幸いです。

于 2011-03-04T13:34:06.087 に答える
2

何がうまくいかないようですか？もう少しやろうとしていることを説明していただけますか？基本的な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();

デモはこちら

我慢してください、この例はかなり多くのコードを取ります。現在、3つの例があり、2つは機能し、1つは機能しません。

簡単に説明すると、jQueryコードは通常、ページの読み込みが完了すると実行されます。すべてのアイテムが揃ったら、ロードが完了します。したがって、ajaxを使用してアイテムを追加する場合、最初に行ったことは、新しいアイテムには影響しません。だから今、あなたは新しいアイテムが影響を受けるようにもう一度物事をする必要があります。

注： ajaxを使用してHTMLをロードできないため、クリックするだけで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!

更新されたデモはこちら

于 2011-03-04T14:01:48.380 に答える