1.Here we have two related drop down and when on selected , secod one will be repopulated with related values , here is javascript part of the code placed directly into ascx control.
<script type="text/javascript">
function PageMethod(fn, paramArray, successFn, errorFn) {
var paramList = '';
if (paramArray.length > 0) {
for (var i = 0; i < paramArray.length; i += 2) {
if (paramList.length > 0) paramList += ',';
paramList += '"' + paramArray[i] + '":"' + paramArray[i + 1] + '"';
}
}
paramList = '{' + paramList + '}';
$.ajax({
type: "POST",
url: fn,
contentType: "application/json; charset=utf-8",
data: paramList,
dataType: "json",
success: successFn,
error: errorFn
})
;
}
var TargetDD='';
function Repopulate(value, TargetDDId, url2call) {
TargetDD = TargetDDId;
PageMethod(url2call, ["Group", "" + value], AjaxSucceeded, AjaxFailed);
}
function AjaxSucceeded(result) {
var elem = document.getElementById(TargetDD);
$(elem).empty();
$.each(result.d, function (index, v1) {
$(elem).append(
$('<option></option>').val(v1.MembershipNumber).html(v1.FirstName + " " + v1.LastName)
);
});
}
function AjaxFailed(result) {
alert("ajax failed" + result.d);
}
</script>
2.Create jsonhub page for making ajax calls from different pages
Imports DotNetNuke.Modules.MembershipModule
Imports System.Web.Services
Namespace NEvoWeb.Modules.NB_Store
Public Class jsonhub
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
End Sub
<WebMethod()>
Public Shared Function MSearchVolunteersbyGroup(Group As Integer) As ArrayList
Dim c As New MembershipModuleController
Return c.MSearchVolunteersbyGroup(Group)
End Function
End Class
End Namespace
3.Ad ajax calls inside of control:
Dim jscall As String = String.Format("Repopulate(this.value,'{0}','{1}');", ddlSalesRep.ClientID, Me.TemplateSourceDirectory + "/jsonhub.aspx/MSearchVolunteersbyGroup")
ddlTeam.Attributes.Add("onchange", jscall)