如何在Jquery中选择列表框项目文本?

时间:2017-02-08 06:16:38

标签: javascript jquery asp.net autocomplete listbox

  

我想执行 Jquery AutoComplete 。我的自动完成编码工作正常。但是当用户选择特定的列表框项

时,自动完成应该有效

This is output window

您可以看到一个列表框和一个文本框。我希望自动填充功能在用户选择 StoreID项时可以正常工作。

Jquery代码

//AUTO COMPLETE
var autoSelectedField = $("#FilterField option:selected").text(); 
if (autoSelectedField === 'StoreID') {
    alert(autoSelectedField);
    $('#txtFilterValue').autocomplete({
        source: 'AutoCompleteHandler.ashx'
    });
}

自动填充代码

public class AutoCompleteHandler : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        //string selectName = context.Request["columnName"] ?? "";
        string term = context.Request["term"] ?? "";

        List<string> listSelectedColumn = new List<string>();

        string cs = ConfigurationManager.ConnectionStrings["HQMatajerConnectionString"].ConnectionString;

        using (SqlConnection con = new SqlConnection(cs))
        {
            SqlCommand cmd = new SqlCommand("JCF_ac_getItemLookupCode", con);
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.Add(new SqlParameter()
                {
                    ParameterName = "@storeid",
                    Value = term
                });

            con.Open();
            SqlDataReader rdr = cmd.ExecuteReader();

            while (rdr.Read())
            {
                listSelectedColumn.Add(rdr["StoreCode"].ToString());
            }

        }

        JavaScriptSerializer js = new JavaScriptSerializer();
        context.Response.Write(js.Serialize(listSelectedColumn));
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}
  

自动填充应在选择列表项时起作用

4 个答案:

答案 0 :(得分:1)

为了达到我在你的(mohamed faisal)帖子中所提到的评论,这是我提出的唯一方法。如果发现任何问题,请通知。

  

jQuery自动填充

$('#txtFilterValue').autocomplete({
    source: function(request, response) {
            $.ajax({
                url: 'AutoCompleteHandler.ashx',
                dataType: "json",
                data: {
                    term : request.term,
                    value : autoSelectedField
                },
                success: function(data) {
                    response(data);
                }
            });
        },
 });
  

C#代码

 string term = context.Request["term"] ?? "";
 // Mention following code below above line.
 string value = context.Request["value"] ?? "";

答案 1 :(得分:0)

您可以通过添加&#39;选择&#39;来捕捉选择事件。自动完成功能的参数。像这样的东西:

$(autoselect_field).autocomplete({
select: function (event, ui){
if($(autoselect_field).value=='Store_ID'){
//do something}
});

答案 2 :(得分:0)

试试这个:

  <script type="text/javascript">
  $(document).ready(function () {
  $("#StoreID").on('change', function () {
  var storeItems = $("#FilterField option:selected").text();
  $("#txtFilterValue").autocomplete({
      source: storeItems,
      autoFocus: true
      });
    }
  });
  </script>

答案 3 :(得分:0)

答案很简单,我之前没有得到,

//AUTO COMPLETE
var autoSelectedField = $("#FilterField option:selected").text();

$('#txtFilterValue').autocomplete({
    source: 'AutoCompleteHandler.ashx?selectName=' + autoSelectedField
});
  

传递所选列表项的值并将其过滤回结束代码,如@Suprabhat Biswal告诉