6

リピーター OHMY 内で呼び出される Web ユーザー コントローラーにマルチビュー検索機能があります。

ページにリストされているいくつかのトレーニング セッションがあり、それぞれが employeeSearch Web ユーザー コントローラーを呼び出して、トレーニング セッションに追加する従業員を検索できるようにします。ページのJSに従業員名と従業員IDをリストし、jQueryオートコンプリートを使用して従業員を検索し、ユーザーコントローラーの非表示フィールドに入力します。プロセスが完了したら、さらに別の従業員を追加するオプションがあります。

そのため、すべての従業員検索ボックスでオートコンペルトが「機能」していましたが、最初の検索 (ポストバック) オートコンプリートを行うと、再び機能しません。

次に、 $().ready(function() を pageLoad() に更新して、複数の検索で正しく機能するようにしましたが、リピーターの LAST アイテムでのみ機能します (jQuery はユーザー コントローラーに読み込まれます)。

参考: JS 文字列を EMPLOYEENAME|ID として設定すると、jQuery は従業員名を表示し、選択すると ASP:HIDDEN FIELD に ID をスローします

    <script type="text/javascript">

    format_item = function(item, position, length) {
        var str = item.toString().split("|", 2);           
        return str[0];
    }

     function pageLoad() {    
        $("#<%=tb_EmployeeName.ClientID %>").autocomplete(EmployeeList, {
            minChars: 0,
            width: 500,
            matchContains: true,
            autoFill: false,
            scrollHeight: 300,
            scroll: true,
            formatItem: format_item,
            formatMatch: format_item,
            formatResult: format_item
        });
        $("#<%=tb_EmployeeName.ClientID %>").result(function(event, data, formatted) {                
            var str = data.toString().split("|", 2);
            $("#<%=hf_EmployeeID.ClientID %>").val(str[1]);
        });
    };       

    </script>

User Controll 内で pageLoad を繰り返すことにより、前の pageLoad をオーバーライドすることは既に推測できます。

質問: これを回避する方法はありますか? すべての jQuery を単一の pageLoad に表示する方法、または単一の jquery 呼び出しですべての検索ボックスを処理する方法はありますか?

特定のtb_EmployeeNameテキストボックスとhf_EmployeeID非表示フィールドを参照する方法がないため、すべてのコントローラーを呼び出すページに jQuery を移動できません。

この問題について私に与えることができる助けや洞察をありがとう。

これは、ユーザー コントローラーのマルチビューです。

        <asp:MultiView ID="mv_EmployeeArea" runat="server" ActiveViewIndex="0">

        <asp:View ID="vw_Search" runat="server">                  
            <asp:Panel ID="eSearch" runat="server">
                <b>Signup Employee Search</b> (<i>Last Name, First Name</i>)<br />
                <asp:TextBox ID="tb_EmployeeName" class="EmployeeSearch" runat="server"></asp:TextBox> 
                <asp:HiddenField ID="hf_EmployeeID" runat="server" />

                <asp:Button ID="btn_Search" runat="server" Text="Search" />
            </asp:Panel>                     
        </asp:View>

        <asp:View ID="vw_Confirm" runat="server">
            <b>Signup Confirmation</b>
            <asp:FormView ID="fv_EmployeeInfo" runat="server">
                <ItemTemplate> 
                    <%#(Eval("LastName"))%>, <%#(Eval("FirstName"))%><br />
                </ItemTemplate>
            </asp:FormView>    
            <asp:Button ID="btn_Confirm" runat="server" Text="Signup this employee" />  &nbsp; <asp:Button ID="btn_Reset3" runat="server" Text="Reset" />   
        </asp:View>

        <asp:View ID="vw_ThankYou" runat="server">
            <b>Thank You</b><br />
            The employee has been signed up and an email confirmation has been sent out.<br /><br />
            <asp:Button ID="btn_Reset" runat="server" Text="Reset" />
        </asp:View>              

    </asp:MultiView>

- - - - - - アップデート - - - - - - -

Nalum のおかげで、以前の (削除された) 試行よりもはるかに優れた方法で問題を解決できました。これで、作成される検索ボックスごとに追加のコードを生成することなく、検索ボックスのすべてのインスタンスを処理する単一の関数ができました。

次の JavaScript は、リピーターを含む親ページで呼び出されています。 

format_item = function(item, position, length) {
    var str = item.toString().split("|", 2);
    return str[0];
}

function pageLoad() {
    $(".ea_Autocomplete").each(function(i, element) {

        var tb_EmployeeName = $(this).children('input[id*=tb_EmployeeName]:first')
        var hf_EmployeeID = $(this).children('input[id*=hf_EmployeeID]:first')

        tb_EmployeeName.autocomplete(EmployeeList, {
            minChars: 0,
            width: 500,
            matchContains: true,
            autoFill: false,
            scrollHeight: 300,
            scroll: true,
            formatItem: format_item,
            formatMatch: format_item,
            formatResult: format_item
        });

        tb_EmployeeName.result(function(event, data, formatted) {
            var str = data.toString().split("|", 2);
            hf_EmployeeID.val(str[1]);
        });


    });
};

クラスea_Autocompleteを使用して div で 2 つの入力をラップする以外に、マルチビューで何も変更しませんでした

  <asp:Panel ID="eSearch" runat="server">
                <b>Signup Employee Search</b> (<i>Last Name, First Name</i>)<br />
                <div class="ea_Autocomplete">
                    <asp:TextBox ID="tb_EmployeeName" class="EmployeeSearch" runat="server"></asp:TextBox> 
                    <asp:HiddenField ID="hf_EmployeeID" runat="server" />
                </div>                                                                                 

                <asp:Button ID="btn_Search" runat="server" Text="Search" />
   </asp:Panel>

ありがとう、ナルム！

4

1 に答える 1

2

私はここでちょっと推測しています。私はasp.netを本当に知らないので、間違っている場合は修正してください。

マルチビューがasp.netのバックグラウンドである種のajaxyタイプのことを行っていると想定しています。その場合、検索フォームがリロードjQuery.autocompleteされると、新しいフォームには適用されません。

おそらく私が今言ったことは完全に間違っています。

2 番目のコメントを編集します。

$('.autocomplete').each(function(i,element){
    $(element).autocomplete({...});
    $(element).result(function(event, data, formatted) { 
        // Now based on you're element id you can build up an id and work with that
        var id = element.id + '-extra-stuff';               
        var str = data.toString().split("|", 2);
        $('#' + id).val(str[1]);
    });
});
于 2010-02-24T17:37:25.087 に答える