TypeError: $(…).data(…) is undefined when trying to use first selection result
I'm using autocomplete plugin to select university from an external json list. Now, it will be such that once student selects university, later he will need to choose his faculty.
For instance,
- Columbia University: communityid = 11 : parentID = 0
- Architecture, Planning & Preservation: communityid = 14 : parentid = 11
I dont understand why I am getting `TypeError: $(...).data(...) is undefined` error.
HTML
- <form action="content/signup/index.cs.asp?Process=AddMember" method="post" class="signup-form">
- <fieldset>
- <p>
- <input type="text" name="COMMUNITY" size="55" value="" title="<%=lngUniversity%>" />
- <div id="autobox"></div>
- </p>
- <p>
- <input type="text" name="SCHOOL" size="55" value="" title="<%=lngSchool%>" />
- </p>
- <p>
- <input type="hidden" name="COMMUNITYEMAIL" value="">
- <input type="hidden" name="COMMUNITYID" value="">
- <input type="hidden" name="x" value="p">
- <input type="submit" name="#" value="<%=lngSubmit%>" class="btn btn-signup">
- </p>
- </fieldset>
- </form>
JS
- $(".signup-form input[name='COMMUNITY']").autocomplete({
- source: function (request, response) {
- $.ajax({
- url: "/content/signup/index.cs.asp?Process=CheckEmail&PARENTID=0&COMMUNITY=" + request.term,
- dataType: "json",
- success: function (data) {
- response($.map(data.CheckEmail, function (item) {
- return {
- label: item.Name,
- value: item.Name,
- CommunityID: item.CommunityID
- }
- }));
- }
- });
- }
- });
- $(".signup-form input[name='SCHOOL']").autocomplete({
- source: function (request, response) {
- $.ajax({
- url: "/content/signup/index.cs.asp?Process=Check&PARENTID=" + $(".signup-form input[name='COMMUNITY']").data(CommunityID).selectedItem.UniversityId + "&COMMUNITY=" + request.term,
- dataType: "json",
- success: function (data) {
- response($.map(data.CheckEmail, function (item) {
- return {
- label: item.Name,
- value: item.Name,
- emailURL: item.emailURL,
- SchoolID: item.CommunityID
- }
- }));
- }
- });
- },
- minLength: 1,
- select: function (event, ui) {
- $(".signup-form input[name='COMMUNITYEMAIL']").val(ui.item.emailURL);
- $(".signup-form input[name='COMMUNITYID']").val(ui.item.CommunityID);
- },
- open: function () {
- $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
- },
- close: function () {
- $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
- },
- appendTo: '#autobox'
- });