Sys.Services.ProfileService.properties and jQuery

Showing you how to load edit and save profiles without disclosing the property names.

This post is about using jQuery and Sys.Services.ProfileService for editing roles. This is in a basic form at the moment allowing you to add the properties to a list of textboxes in the same order as they are on the database. So to start off with I created a list of text boxes and labels for each property in the profile, then I added the JavaScript.

function LoadProfile() {
Sys.Services.ProfileService.load(null,
OnLoadCompleted, OnProfileFailed, null);
}

This simply calls the profile service and if successful it calls the OnLoadCompleted function


function OnLoadCompleted(numProperties, userContext, methodName) {
var prop = Sys.Services.ProfileService.properties;
var fields = $("#tabs-9 input:text");
var i = 0;
for (var p in prop) {
$(fields[i]).val(prop[p]);
i++;
}
}

Now I save the lengthy Sys.Services.ProfileService.properties; to a variable then use jQuery to collect the collection of text boxes that are in the div tag with an ID of "tabs-9".

Then loop through the prop collection while also looping through the textbox collection adding the values.

To save the properties do the same in reverse, using the click of the update button


$("#CompanySave").click(function(e) {
e.preventDefault();
var prop = Sys.Services.ProfileService.properties;
var fields = $("#tabs-9 input:text");
var i = 0;
for (var p in prop) {
prop[p] = $(fields[i]).val();
i++;
}
Sys.Services.ProfileService.properties = prop;
Sys.Services.ProfileService.save(null, OnSaveCompleted, OnProfileFailed, null);
});

And that’s it without having to disclose any of the actual property names. I could be spruced up a bit to include different form elements let me know what you think.

Using jQuery and a Web Service for unobtrusive email form

This could probably be done better and i will look into making it a jQuery plugin when I get time. Basically Iam using jQuery to collect all the variables from a form and looping through them to create a html string. then using a web service to send the text and have it emailed, then report whether it was a success or not.

Sys.Application.add_load(function() {
//Collect form variables
$("input:submit").click(function(e) {
e.preventDefault();
var tb = $("input:text");
var rb = $("input:radio");
var cb = $("input:checkbox");
var sel = $("option:selected");
var tbArea = $("textarea");
var text = "";
tb.each(function(n) {
text += "" + $(this).attr("id") + ": " + $(this).val() + "
";
});
tbArea.each(function(n) {
text += "" + $(this).attr("id") + ": " + $(this).val() + "
";
});
rb.each(function(n) {
if ($(this).attr("checked")) {
text += "" + $(this).attr("id") + ": " + $(this).val() + "
";
}
});
cb.each(function(n) {
if ($(this).attr("checked")) {
text += "" + $(this).attr("id") + ": " + $(this).val() + "
";
}
});
sel.each(function(n) {
text += "" + $(this).parent("select").attr("id") + ": " + $(this).val() + "
";
});
output.append(text);
EmailService.SendMail(text, success, failure);
});
//Send to web service as string
});