my problem is that i user control have 2 controls 1 text box with autocomplete function2 label control which get id of autocompelte valuewhen i select value of autocomplete it replace all labels values even wich textbox empty my issue is label valuelt Control Language34C34 AutoEventWireup34true34 CodeFile34WebUserControlascxcs34 Inherits34WebUserControl34 gtEnter search termltaspTextBox ID34txtSearch34 runat34server34 gtltaspLabel

Hi arehmanRefer below sampleHTMLWebUserControlCSascxlt Control Language34C34 AutoEventWireup34true34 CodeFile34WebUserControlCSascxcs34 Inherits34WebUserControlCS34 gtEnter search termltaspTextBox ID34txtSearch34 runat34server34 gtltbr gtMessageltaspLabel ID34lblMessage34 runat34server34 gtltscript src34httpajaxaspnetcdncomajaxjQueryjquery1100minjs34 type34textjavascript34gtltscriptgtltscript src34httpajaxaspnetcdncomajaxjqueryui192jqueryuiminjs34 type34textjavascript34gtltscriptgtltlink rel34Stylesheet34 type34textcss34 href34httpajaxaspnetcdncomajaxjqueryui192themesblitzerjqueryuicss34 gtltscript type34textjavascript34gt On Page Load function SetAutoComplete On UpdatePanel Refresh var prm SysWebFormsPageRequestManagerge

Set jQuery Autocomplete selected value in Label inside ASP.Net UserControl using jQuery

arehman

SOLVED CLOSED ACTIVE ANSWERED
User: arehman
Posted: on Mar 12, 2019 05:58 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 2510

my problem is that i user control have 2 controls

1- text box with autocomplete function

2- label control which get id of autocompelte value

when i select value of autocomplete it replace all labels values. even wich textbox empty. my issue is label value

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %>
Enter search term:
<asp:TextBox ID="txtSearch" runat="server" />
<asp:Label ID="lbl_id" runat="server" Text="ID"></asp:Label>

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js" type="text/javascript"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/jquery-ui.min.js" type="text/javascript"></script>
<link rel="Stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/blitzer/jquery-ui.css" />
<script type="text/javascript">
    //On Page Load.
    $(function () {
        SetAutoComplete();
    });

    //On UpdatePanel Refresh.
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    if (prm != null) {
        prm.add_endRequest(function (sender, e) {
            if (sender._postBackSettings.panelsToUpdate != null) {
                SetAutoComplete();
            }
        });
    };
    function SetAutoComplete() {
        $("[id$=txtSearch]").autocomplete({
            source: function (request, response) {
                var id = $("[id$=txtSearch]:focus").attr('id').split('_')[0];
                $.ajax({
                    url: '<%=ResolveUrl("~/WebService.asmx/") %>' + id,
                    data: "{ 'prefix': '" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {

                        if (!data.d.length) {
                            var result = [{ label: "no results", value: response.term }];
                            response(result);
                        }
                        else { 
                        response($.map(data.d, function (item) {
                            return {
                                label: item.split('-')[0],
                                val: item.split('-')[1]
                            };
                        }))
                        }
                    },
                    error: function (d) { alert(d.responseText) }
                });
            },
            select: function (e, i) {
                var label = i.item.label;
                if (label == "no results") {
                    $("[id$=lbl_id]").html("");
                }

                else {
                    $("[id$=lbl_id]").html(i.item.val);
                }
            },
            delay: 0,
            minLength: 1,
            mustMatch: true,
            autoFocus: true
        });
    }
</script>

above is usercontrol html code

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Src="~/WebUserControl.ascx" TagName="Name" TagPrefix="uc" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
               <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <uc:Name ID="GetFruits" runat="server" />
                <br />
                <br />
                <uc:Name ID="GetCountry" runat="server" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

above is pagel aspx code

in usercontrol i want to set label on base of autocomplete but it set all label with same value

Download FREE API for Word, Excel and PDF in ASP.Net

pandeyis...

0 8

Reply
ANSWER
User: pandeyism
Replied: on Mar 13, 2019 03:17 AM
Report

Hi arehman,

Refer below sample.

HTML

WebUserControlCS.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControlCS.ascx.cs"
    Inherits="WebUserControlCS" %>
Enter search term:
<asp:TextBox ID="txtSearch" runat="server" />
<br />
Message:
<asp:Label ID="lblMessage" runat="server" />
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/jquery-ui.min.js" type="text/javascript"></script>
<link rel="Stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/themes/blitzer/jquery-ui.css" />
<script type="text/javascript">
    //On Page Load.
    $(function () {
        SetAutoComplete();
    });

    //On UpdatePanel Refresh.
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    if (prm != null) {
        prm.add_endRequest(function (sender, e) {
            if (sender._postBackSettings.panelsToUpdate != null) {
                SetAutoComplete();
            }
        });
    };
    function SetAutoComplete() {
        var focused;
        $("[id$=txtSearch]").autocomplete({
            source: function (request, response) {
                focused = $("[id$=txtSearch]:focus")
                var id = $("[id$=txtSearch]:focus").attr('id').split('_')[0];
                $.ajax({
                    url: '<%=ResolveUrl("~/WebServiceCS.asmx/") %>' + id,
                    data: "{ 'prefix': '" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return {
                                label: item.split('-')[0],
                                val: item.split('-')[1]
                            };
                        }))
                    },
                    error: function (d) { alert(d.responseText) }
                });
            },
            select: function (e, i) {
                var label = $(focused).attr('id').split('_')[0] + "_lblMessage";
                if (i.item.label == "") {
                    $('#' + label).html("");
                }
                else {
                    $('#' + label).html(i.item.label);
                }
            },
            delay: 0,
            minLength: 1,
            mustMatch: true,
            autoFocus: true
        });
    }
</script>

CS.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CS.aspx.cs" Inherits="CS" %>

<%@ Register Src="~/WebUserControlCS.ascx" TagName="Name" TagPrefix="uc" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <uc:Name ID="GetFruits" runat="server" />
                <br />
                <br />
                <uc:Name ID="GetCountry" runat="server" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

Code

WebServiceCS.cs

using System.Collections.Generic;
using System.Linq;
using System.Web.Services;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class WebServiceCS : System.Web.Services.WebService
{
    [WebMethod]
    public string[] GetFruits(string prefix)
    {
        List<string> fruits = new List<string>();
        fruits.Add("Mango");
        fruits.Add("Apple");
        fruits.Add("Banana");
        fruits.Add("Orange");
        fruits.Add("Pineapple");
        fruits.Add("Guava");
        fruits.Add("Grapes");
        fruits.Add("Papaya");
        return fruits.Where(f => f.ToLower().IndexOf(prefix.ToLower()) != -1).ToArray();
    }

    [WebMethod]
    public string[] GetCountry(string prefix)
    {
        List<string> Country = new List<string>();
        Country.Add("London");
        Country.Add("Canada");
        Country.Add("Dubai");
        Country.Add("UK");
        return Country.Where(f => f.ToLower().IndexOf(prefix.ToLower()) != -1).ToArray();
    }
}

VB.Net

WebServiceVB.vb

Imports System.Web
Imports System.Web.Services
Imports System.Web.Services.Protocols

<System.Web.Script.Services.ScriptService()> _
<WebService(Namespace:="http://tempuri.org/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Public Class WebServiceVB
    Inherits System.Web.Services.WebService

    <WebMethod()>
    Public Function GetFruits(ByVal prefix As String) As String()
        Dim fruits As List(Of String) = New List(Of String)()
        fruits.Add("Mango")
        fruits.Add("Apple")
        fruits.Add("Banana")
        fruits.Add("Orange")
        fruits.Add("Pineapple")
        fruits.Add("Guava")
        fruits.Add("Grapes")
        fruits.Add("Papaya")
        Return fruits.Where(Function(f) f.ToLower().IndexOf(prefix.ToLower()) <> -1).ToArray()
    End Function

    <WebMethod()>
    Public Function GetCountry(ByVal prefix As String) As String()
        Dim Country As List(Of String) = New List(Of String)()
        Country.Add("London")
        Country.Add("Canada")
        Country.Add("Dubai")
        Country.Add("UK")
        Return Country.Where(Function(f) f.ToLower().IndexOf(prefix.ToLower()) <> -1).ToArray()
    End Function
End Class

Screenshot

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Set jQuery Autocomplete selected value in Label inside ASP.Net UserControl using jQuery

Company

Explore

Follow us

Contact Us