I want to create radio buttons according to the elements of array that i am calling from database. and this elements should be use as label for each radio button. How i can code for it. I am calling 6 element as username suggestion. and when a guest select any of button then that label for particular button will replace the input name type by guest. Thank You
-
2What are your attempts so far?Markai– Markai2015-09-07 11:42:45 +00:00Commented Sep 7, 2015 at 11:42
-
Show example of array from database and result that you expect.Finesse– Finesse2015-09-07 11:45:38 +00:00Commented Sep 7, 2015 at 11:45
-
I know how to create radio buttons dynamically. but i have no idea that how i can create it with different labels. Like I type a name in input "Michael".. so by change event.. this value is going to database where it is exist or not. If this value is exist then i will get array {"Michael5678" , "Michael5128", "Michael2278" , "Michael2345 , "Michael5611" , "Michael9856"}. And i have to display this values as username suggestion with radio buttion. So if a guest will select any of value then it will replace the input value in field.shoaib– shoaib2015-09-07 11:55:10 +00:00Commented Sep 7, 2015 at 11:55
Add a comment
|
1 Answer
function showSuggestions() {
var usernames = [
'test1', 'test2', 'test3', 'test4'
];
var result = $('#result');
result.html('');
for (var i = 0; i < usernames.length; i++) {
result.append('<label><input type="radio" name="usernames" value="' + usernames[i] + '" /> ' + usernames[i] + '</label>');
}
}
$('button').click(showSuggestions);
$('#result').on('change', 'input', function() {
var elem = $(this);
if (elem.is(':checked')) {
$('#search').val(elem.val());
}
});
label {
display:block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="search" type="search" /><button>Search</button>
<div id="result"></div>
4 Comments
shoaib
thank you Sir. i try it by implement it with my code. thanks again. Sir can you suggest me how i can display this element in vertical alignment
shoaib
thank you. i almost done everything. But i dont know .. why i am getting problem to replacing the text. this last function is not working and not giving any check value on console the elem.val() .. i try this code in js fiddle where it is working and console all this array element on checked. But my code is not working on checked. what i am doing wrong ?
shoaib
yeah but you will not able to see array. that i am calling from database. wait i should make a jsfiddle. And thank you for your concern
shoaib
Sir sorry. I thought this is the method you are calling in showSuggestion function. But now i find that it was different function. i call it and now everything is working. thank you sir again