none
入力可能なDropDownListにフォーカスが移った時 RRS feed

  • 質問

  • はじめまして。

    Visual Studio 2010を使用し、Webフォームにて開発しています。

    下記サイトを参考に、入力可能なDropDownListを作成することはできました。

    このDropDownListにフォーカスが移った場合、現在選択されているリスト(文字)を選択した状態にしたいです。
    よろしくお願い致します。

    サイト

    jQueryUIのautocompleteとASP.NETの連携

    【page1.aspx】

    <asp:DropDownList ID="DropDownList1" runat="server"
        DataTextField="NAME" DataValueField="CODE"
        DataSourceID="sds">
    </asp:DropDownList>
    <script type="text/javascript">
        $(function () {
            $("#<%= DropDownList1.ClientID %>").combobox({ 'id': 0 });
        });
    </script>
    <asp:SqlDataSource ID="sds" runat="server"
        ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
        SelectCommand="SELECT  [NAME], [CODE] FROM [MASTER] ">
    </asp:SqlDataSource>

    2013年9月12日 10:18

回答

すべての返信

  • > 現在選択されているリスト(文字)を選択した状態

    どういう意味ですか?

    あと、ご自分の環境(OS, ASP.NET, IIS, jQuery のバージョン、使用しているブラウザなど)を書いてください。

    2013年9月12日 14:09
  • 開発環境は、

    OS:Windows7
    IIS:IIS7.5
    ASP.NET:4
    ブラウザ:IE9
    jQuery他:
    ajax/jQuery/jquery-1.7.1.js
    ajax/jquery.ui/1.8.17/jquery-ui.js
    ajax/jquery.ui/1.8.17/themes/cupertino/jquery-ui.css


    >どういう意味ですか?
    わかりづらく申し訳ありません。


    例えば

    すでに
    DropDownListに
    「りんご」という文字がセットされていて、
    入力可能なDropDownListですので、その文字を「みかん」に変更したい場合、
    その入力領域をクリックし、逐一文字を削除した後、入力するのが手間なので、
    入力領域をクリックしした時点で、「りんご」という文字が範囲選択された状態にしたいと考えております。
    そうすればそのまま文字を上書きで入力できますので。

    2013年9月13日 0:36
  • jQuery UIのAutocomplete - ComboBoxのサンプルを操作してみたところ、

    • tabキーでフォーカス移動 → 全体が選択される
    • マウスクリック → クリックした箇所にカーソル移動

    のようです。これがオリジナルの動作。

    これに対して質問者さんは何を望むのでしょうか?

    • オリジナルの動作をしない
      →DropDownListとの組み合わせがうまくできていないということになるのかな
    • オリジナルの動作が気に食わない
      →jQuery UIに相談してみては?
    2013年9月13日 1:17
  • combobox.jsに、以下を追加してみて下さい。 

    input.click(function () { input.focus(); input.select(); })

    #このページでの話ですよね?

    jQueryUIのautocompleteとASP.NETの連携
    http://karuakun.wordpress.com/2012/02/17/jqueryui%E3%81%AEautocomplete%E3%81%A8asp-net%E3%81%AE%E9%80%A3%E6%90%BA/


    ★良い回答には回答済みマークを付けよう! わんくま同盟 MVP - Visual C# http://d.hatena.ne.jp/trapemiya/


    2013年9月13日 2:32
    モデレータ
  • 以下のページにデモがある Combobox の話ですよね。

    Autocomplete - Combobox
    http://jqueryui.com/autocomplete/#combobox

    とすると、説明 ↓ からは依然として質問者さんのやりたいことが分かりません。

    > すでに
    > DropDownListに
    > 「りんご」という文字がセットされていて、
    > 入力可能なDropDownListですので、その文字を「みかん」に変更したい場合、
    > その入力領域をクリックし、逐一文字を削除した後、入力するのが手間なので、
    > 入力領域をクリックしした時点で、「りんご」という文字が範囲選択された状態
    > にしたいと考えております。
    > そうすればそのまま文字を上書きで入力できますので。

    上の jQuery UI のページのデモをベースに、どのようにしたいか説明していただけませんか。

    2013年9月13日 2:52