-
Notifications
You must be signed in to change notification settings - Fork 0
/
form.html
78 lines (72 loc) · 2.36 KB
/
form.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
<title>AutoComplete Example</title>
<link rel="stylesheet" href="auto-complete.css"></head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
</head>
<body>
<form id="example_form" method="post" onsubmit="checkInput()">
<div>
<label for="name">First:</label>
<input type="text" id="input1" name="input_first">
</div>
<div>
<label for="mail">Second:</label>
<input type="text" id="input2" name="input_sec">
</div>
<div>
<label for="msg">Third:</label>
<input type="text" id="input3" name="input_third">
</div>
</form>
<button type="submit" form="example_form" value="Submit">Submit</button>
<script src = "auto-complete.min.js" type = "text/javascript"></script>
<script type="text/javascript">
var list = ['One', 'Two', 'Three', 'Four', 'Five'];
var selected = false;
$(document).ready(function() {
var xhr;
console.log("started");
var i;
new autoComplete({
selector: 'input[name="input_first"]',
minChars: 2,
source: function(term, suggest){
term = term.toLowerCase();
var matches = [];
for (i=0; i<list.length; i++)
if (~list[i].toLowerCase().indexOf(term)) matches.push(list[i]);
suggest(matches);
},
/*function(term, response){
try { xhr.abort(); } catch(e){}
list = term;
xhr = $.getJSON('/some/ajax/url/', { q: term }, function(data){ response(data); });
}*/
onSelect: function(e, term, item){
selected = true;
}
});
});
function checkInput() {
var input1_text = document.getElementById("input1").value;
var input2_text = document.getElementById("input2").value;
var input3_text = document.getElementById("input3").value;
if(input1_text == '' || input3_text == '' || input2_text == '') {
alert("Please fill all the fields");
return false;
} else {
if (list.indexOf(input1_text > -1) && selected) {
// Trigger the form submission her
alert("Submited successflly");
return true;
} else {
alert("Please select input from the drop down");
return false;
}
}
}
</script>
</body>
</html>