onchage event

So, the onchage event that I have in my drop down is not firing.  Any ideas?

function getGroups(){
  $().SPServices({
            operation: "GetGroupCollectionFromWeb",
            webURL: siteURL,
            async: false,
            completefunc: function (xData, Status) {
              //console.log(xData.responseXML);
              $(xData.responseXML).find("Group").each(function() {
                //var names = $(this).attr("LoginName");
                var id = $(this).attr("ID");
                
                $("#WSOutput").append("<option value="+ $(this).attr("Name") +">" + $(this).attr("Name") + "</option>");
                
              });
            }
        });
		
		//Capture selected value
		var groupSelection =  document.getElementById("WSOutput").value; //ADDED
		
		console.log("selected value: "+groupSelection);
		//Call getGroupUsers() function to filter
		getGroupUsers(groupSelection); //ADDED
}

//returns users from group
function getGroupUsers(group){
		//var dfd = $.Deferred();
		alert(group);
	console.log("In getGroupUsers function");
		($().SPServices({
			operation: "GetUserCollectionFromGroup",
			groupName: group, //ADDED
			async: true
		})).done(function(responseXML, status){
			var d = [];

			var nodes = $(responseXML).SPFilterNode("User")
			if (nodes.length > 0){
				nodes.each(function(){
					var uId = $(this).attr("ID");
					var uName = $(this).attr("Name");
					var uLoginName =$(this).attr("LoginName");	
					var uEmail = $(this).attr("Email");
					//var uTitle = $(this).attr("Title");
					console.log("uEmail");
					//alert("I'm in");	
					$("#users").append("<table id='uTbl'><tr><td>" + uId + "</td><td>" + uName + "</td><td>" + "<a href='mailto:" + uEmail + "'>"+ uEmail +"</a></td></tr></table>");	
				});
			}
		});
}	

});
</script>
<style>
#uTbl  {
	width:100%;
	border-collapse: collapse;
	table-layout: fixed;
}
table#uTbl, #uTbl td {
	border:1px solid #ccc;
}
#uTbl td {
	padding: 5px;
}

</style>
<select id="WSOutput" onchange="getGroups()"> //ADDED EVENT
<select id="nameSelect">
<div id="users"></div>

<div id="myOutDiv"></div>

Open in new window

LVL 5
IsaacSharePoint Client Side DeveloperAsked:
Who is Participating?
 
Rainer JeschorCommented:
Hi,
thanks. Due to missing credentials, the SPServices call does not return anything.

BTW, when using IE 11 to open the page, I get two Javascript errors:
Line 824: var logoImg = documentGetElementsByName('onetidHeadbnnr0');
There is a missing "." and should be
var logoImg = document.GetElementsByName('onetidHeadbnnr0');

And the next one a couple of lines later:
MoveSiteTitle(); - this function cannot be found.

HTH
Rainer
0
 
Rainer JeschorCommented:
Hi,
hm, have you closed the select tag?
Can you please simply try to replace
<select id="WSOutput" onchange="getGroups()"> //ADDED EVENT
<select id="nameSelect">

Open in new window

with
<select id="WSOutput" onchange="getGroups()" /> //ADDED EVENT
<select id="nameSelect" />

Open in new window


Javascript / jQuery can be very picky as soon as the HTMLDOM is not valid.

HTH
Rainer
0
 
IsaacSharePoint Client Side DeveloperAuthor Commented:
Closed it but that didn't work.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
Rainer JeschorCommented:
Hi,
hm, could you perhaps attach the complete generated HTML source?
Second question: why do you want to call the getGroups function in the onchange? Shouldnt this be the getGroupUsers? Because in the latter one you build up the select and multiple calls will simply append the same groups again and again.
Thanks.
Rainer
0
 
Chris StanyonCommented:
Might sound obvious, but in the code you posted, you don't have any <options> in the <select>, meaning there's nothing to change it to: it's never going to fire a change() event!
0
 
IsaacSharePoint Client Side DeveloperAuthor Commented:
Here's what I'm trying to do,

I want to show users in a group based on the selection of a group from a drop down box.

@Chris, <options> is dynamically added.

Here's the page http://isaac.issharepoint.com/practice/Web%20Part%20Pages/test.aspx
0
 
Chris StanyonCommented:
On the page you posted, the <select> is not dynamically populated - it's empty!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.