Auto-complete using jqxInput in asp.net

Tagged: asp.net, AutoComplete, Input, jqxinput, select, val

This topic contains 7 replies, has 2 voices, and was last updated by Dimitar 11 years, 7 months ago.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

jqxinput Value Not Fetch in asp.net Posts
August 22, 2013 at 11:16 am jqxinput Value Not Fetch in asp.net #27408

Vicky
Member

hi

I use jqxinput for autocomplete In asp.net my code is :

function autocompleteOfSudent() {
var temdata = $(“#hdnStudent”).val();
var autoStudentData = $(“#txtStudentName”).val();
$(“#txtStudentName”).jqxInput({ placeHolder: ‘Please Enter Student Name’, height: 25, width: 200, theme: theme,
source: function (query, response) {
var dataAdapter = new $.jqx.dataAdapter
(
{
datatype: “json”,
datafields:
[
{ name: ‘StudentId’, type: ‘number’ },
{ name: ‘FirstName’, type: ‘string’ },
{ name: ‘LastName’, type: ‘string’ },
{ name: ‘Instrumentid’, type: ‘number’ },
],
id: ‘id’,
localdata: temdata
},
{
autoBind: true,
formatData: function (data) {
data.name_startsWith = query;
return data;
},
loadComplete: function (data) {
if (data.length > 0) {
response($.map($.parseJSON(data), function (item) {
return {
label: item.FirstName + “, ” + item.LastName,
value: item.FirstName + “|” + item.LastName + “|” + item.StudentId + “|” + item.Instrumentid
}

}));
}
}
}
);
}
});

}

this is In Document.ready. After Select Any Item I Call TextBox onchange Event And Call Function is :

function SelectChangeOfStudent() {
var data = $(“#txtStudentName”).val();
var strStudentData = data.split(‘|’);
$(“#txtStudentName”).val(strStudentData[1]);
var intAutoStudentId = strStudentData[2];
var intAutoStudentId = strStudentData[2];
if (intAutoStudentId != undefined && intAutoStudentId != null && intAutoStudentId != ”) {
$(‘#hdnStudentId’).val(intAutoStudentId);
alert(“StduebtId Is :” + intAutoStudentId);
var ContactFirstName = strStudentData[5];
}
}

but data=firstname,lastname not Fetch Actual value That I Post In Autocomplete Textbox Value.

So Any One Please Help me For Solve That Issue.

Thanks In Advance

August 22, 2013 at 11:43 am jqxinput Value Not Fetch in asp.net #27426

Dimitar
Participant

Hello Vicky,

Unfortunately, we cannot determine the source of the issue from the provided sample. Please send a project which to demonstrate the reported scenario to support@jqwidgets.com.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

August 23, 2013 at 8:20 am jqxinput Value Not Fetch in asp.net #27527

Vicky
Member

hello jqxwidgets Team

I Can’t Send You Any Project demonstrate Because i Am Fresher So I cant Have Any Permission For That So Please Give Me Solution For This Code.

I Want To Just Access Textbox Value That Give on Auto-Complete value Selected.

So Please Give me Any Solution.

And You Do Not Understand That Code Or not Find Any Solution Then Please Send me Demo For asp.net Auto-Complete With jqxInput.

Thanks In Advance

Your Faithfully

Vicky

August 26, 2013 at 8:18 am jqxinput Value Not Fetch in asp.net #27674

Dimitar
Participant

Hi Vicky,

Unfortunately, we do not have such an example.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

August 26, 2013 at 9:58 am jqxinput Value Not Fetch in asp.net #27683

Vicky
Member

hello

thank you for reply

I Can’t Fetch Value From jqxinput Change Event .

So Tell me Any Method For Get Auto-complete value From Change Event of Textbox

Code Is :

function autocompleteOfSudent() {
var temdata = $(“#hdnStudent”).val();
$(“#txtStudentName”).jqxInput({ placeHolder: ‘Please Enter Name’, height: 25, width: 200, theme: theme,
source: function (query, response) {
var dataAdapter = new $.jqx.dataAdapter
(
{
datatype: “json”,
datafields:
[
{ name: ‘StudentId’, type: ‘number’ },
{ name: ‘FirstName’, type: ‘string’ },
{ name: ‘LastName’, type: ‘string’ },
{ name: ‘Instrumentid’, type: ‘number’ },
],
id: ‘id’,
localdata: temdata
},
{
autoBind: true,
formatData: function (data) {
data.name_startsWith = query;
return data;
},
loadComplete: function (data) {
if (data.length > 0) {
response($.map($.parseJSON(data), function (item) {
return {
label: item.FirstName + “, ” + item.LastName,
value: item.FirstName + “|” + item.StudentId + “|” + item.Instrumentid
}

}));
}
}
}
);
}
});
}
Blue Color Line Value Fetch From Textbox Changed Event.

So Give me Any Solution If You Have Please.

Thanks In Advance
your faithfully

Vicky

August 27, 2013 at 6:04 am jqxinput Value Not Fetch in asp.net #27759
Dimitar
Participant
Hi Vicky,

Here is how to get the value of an input when you select a value from the autocomplete:
```
<!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>
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxinput.js"></script>
</head>
<body class='default'>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                var theme = getDemoTheme();
                var countries = new Array("Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", " Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe");
                $("#input").jqxInput({ placeHolder: "Enter a Country", height: 25, width: 200, minLength: 1, theme: theme, source: countries });
                $('#input').on('select', function (event) {
                    if (event.args) {
                        var value = $('#input').val();
                        alert(value);
                    };
                });
            });
        </script>
        <input type="text" id="input" />
    </div>
</body>
</html>
```
Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/
August 28, 2013 at 7:25 am jqxinput Value Not Fetch in asp.net #27836

Vicky
Member

hi team

Thank you for reply

But I Want To fetch Value On Textbox Change Event.

So Please Give Me Proper Suggestion For this.

Thanks

your

Vicky

August 29, 2013 at 5:13 am jqxinput Value Not Fetch in asp.net #27907
Dimitar
Participant
Hi Vicky,

If you wish to get the value after it has been changed, please bind to the change event, e.g.:
```
$('#input').on('change', function (event) {
    var value = $('#input').val();
    alert(value);
});
```
Alternatively, if you wish to get the value during the change, please bind to the keyup event, e.g.:
```
$('#input').on('keyup', function (event) {
    var value = $('#input').val();
    alert(value);
});
```
Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/
Author

Posts

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.