Combobox Ajax request

Posted by: michaelwhite on 10 September 2017, 11:48 am EST

  • Posted 10 September 2017, 11:48 am EST

    Hi componentOne hope you can help me with this one.

    I have a wijmo:C1ComboBox on my form and to begin with I had autopostback set to true in order to get my code behind function working how i wanted.

    I would love to get the combobox to use its ajax functionality and called the function in a seamless fashion so I don't have that horrible post back flicker.


    here is my comboxcode

    <wijmo:C1ComboBox runat="server" ID="weekselcector" AutoPostBack="True" >
    <Items>
    <wijmo:C1ComboBoxItem Text="Week 1" />
    <wijmo:C1ComboBoxItem Text="Week 2" />
    <wijmo:C1ComboBoxItem Text="Week 3" />
    </Items>
    </wijmo:C1ComboBox>



    Here is my code behind The logic behind this function basically builds up a comma separated string to a hidden field with is parsed client side using jquery


    Private Sub weekselcector_SelectedIndexChanged(sender As Object, args As C1.Web.Wijmo.Controls.C1ComboBox.C1ComboBoxEventArgs) Handles weekselcector.SelectedIndexChanged

    Try
    Dim fw As Aurum.GenericObjects.Finance.FinancialWeek = datedic(weekselcector.SelectedItem.Text.Replace("Week ", ""))

    strweek.Clear()

    For i = 0 To 6
    strweek.Add(i + 1, New Aurum.GenericObjects.Finance.FinancialWeek(fw.DateAnalysed.AddDays(i)))
    strweek(i + 1).ProcessDate()
    Next

    StartDatetime = strweek("1").WeekStartDate
    FinishDateTime = strweek("1").WeekFinishDate


    Dim r As String() = New String() {",", ",", ",", ",", ",", ",", ","}


    For Each employee In userlist

    If employee.SecondName Is Nothing OrElse String.IsNullOrEmpty(employee.SecondName.ToString) Then
    strfullemployeename = employee.FirstName.Trim & " " & employee.Surname.Trim
    Else
    strfullemployeename = employee.FirstName.Trim & " " & employee.SecondName.Trim & " " & employee.Surname.Trim
    End If

    Dim sd As DateTime = CType(StartDatetime.Date.ToString("yyyy-MM-dd 00:00:01"), DateTime)
    Dim fd As DateTime = CType(FinishDateTime.Date.ToString("yyyy-MM-dd 23:59:59"), DateTime)

    EmployeeEntriesByEmployee = StoreSystemsBLL.StaffScheduling.EmployeeEntriesByEmployee(sd, fd, strfullemployeename)

    r = New String() {",", ",", ",", ",", ",", ",", ","}


    For Each ei In EmployeeEntriesByEmployee

    Dim i As Int16 = ei.DateTimeStart.DayOfWeek - 1

    If i < 0 Then
    i = 6
    End If

    r(i) = ei.DateTimeStart.ToString("HH:mm") & "," & ei.DateTimeFinish.ToString("HH:mm")
    Next
    rr.Add(r)
    Next

    For Each ss As String() In rr
    For Each s As String In ss
    hdntimes.Value &= s & ","
    Next
    Next
    Catch ex As Exception
    Console.WriteLine(ex.Message.ToString)
    End Try
    End Sub




    Any Help would be great

    Kind regards

    Michael
  • Replied 10 September 2017, 11:48 am EST

    Hello Michael,

    You may refer to the following blog describing the same:
    http://our.componentone.com/2012/06/29/binding-wijmo-combobox-with-webservice-in-jquery/

    Regards
  • Replied 10 September 2017, 11:48 am EST

    Hi Ashish,

    So I followed the example on calling a web service via Ajax to bring back some data

    Here is my web service


    <WebMethod()> _
    <ScriptMethod(ResponseFormat:=ResponseFormat.Xml)>
    Public Function GetEmployeeEntries(ByVal weekNumber As Int16)

    Dim datedic As New Generic.Dictionary(Of String, Aurum.GenericObjects.Finance.FinancialWeek)
    Dim strweek As New Generic.Dictionary(Of String, Aurum.GenericObjects.Finance.FinancialWeek)

    Dim StartDatetime As DateTime
    Dim FinishDateTime As DateTime
    Dim EmployeeEntriesByEmployee As IList(Of StoreSystemsDAL.tbl_Entries)
    Dim rr As New ArrayList
    Dim mystring As String = ""
    Dim strdate As New Aurum.GenericObjects.Finance.FinancialWeek(DateTime.Now)
    strdate.ProcessDate()
    strweek.Clear()

    For i2 As Int16 = 0 To 51
    Dim fw1 As New Aurum.GenericObjects.Finance.FinancialWeek(strdate.AccountingYearStart.AddDays(i2 * 7))
    fw1.ProcessDate()
    datedic.Add(fw1.WeekOfTheYear, fw1)
    Next

    Dim fw As Aurum.GenericObjects.Finance.FinancialWeek = datedic(weekNumber)

    For i = 0 To 6
    strweek.Add(i + 1, New Aurum.GenericObjects.Finance.FinancialWeek(fw.DateAnalysed.AddDays(i)))
    strweek(i + 1).ProcessDate()
    Next

    StartDatetime = strweek("1").WeekStartDate
    FinishDateTime = strweek("1").WeekFinishDate

    Dim r As String() = New String() {",", ",", ",", ",", ",", ",", ","}

    Dim employees As IList(Of StoreSystemsDAL.tbl_Employees)
    Dim strfullemployeename As String

    Using Context As New StoreSystemsDAL.StaffSchedulingEntities
    employees = (From p In Context.tbl_Employees Where p.Dept = "002" Select p Order By p.FirstName).ToList

    For Each employee In employees

    If employee.SecondName Is Nothing OrElse String.IsNullOrEmpty(employee.SecondName.ToString) Then
    strfullemployeename = employee.FirstName.Trim & " " & employee.Surname.Trim
    Else
    strfullemployeename = employee.FirstName.Trim & " " & employee.SecondName.Trim & " " & employee.Surname.Trim
    End If

    Dim sd As DateTime = CType(StartDatetime.Date.ToString("yyyy-MM-dd 00:00:01"), DateTime)
    Dim fd As DateTime = CType(FinishDateTime.Date.ToString("yyyy-MM-dd 23:59:59"), DateTime)

    Using context2 As New StoreSystemsDAL.StaffSchedulingEntities
    EmployeeEntriesByEmployee = (From p In Context.tbl_Entries Where (p.DateTimeStart >= StartDatetime) And (p.DateTimeFinish <= FinishDateTime) And p.Employee = strfullemployeename Select p).ToList
    r = New String() {",", ",", ",", ",", ",", ",", ","}
    End Using


    For Each ei In EmployeeEntriesByEmployee

    Dim i As Int16 = ei.DateTimeStart.DayOfWeek - 1

    If i < 0 Then
    i = 6
    End If

    r(i) = ei.DateTimeStart.ToString("HH:mm") & "," & ei.DateTimeFinish.ToString("HH:mm")
    Next
    rr.Add(r)
    Next

    For Each ss As String() In rr
    For Each s As String In ss
    mystring &= s & ","
    Next
    Next

    Return mystring
    End Using

    End Function


    As you can see all this returns is a string called my string.

    However I cant seem to get the ajax call right, it just error with no specific explanation.

    I have added a onclientselect to my combobox and the following jscript



    function getdata(e, item) {
    var cmb_Week = $("#combo");
    cmb_Week.c1combobox({
    data: null
    });
    //call the service
    GetCityNamesFromService("31");

    }


    and the following js for the ajax call


    function GetCityNamesFromService(Week) {
    //ajax call to get the data
    $.ajax({
    type: "POST",
    url: "StaffScheduling.asmx/GetEmployeeEntries2",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    //pass the country name
    data: "{"31"}",
    success: function (data) {
    try {
    FillComboWithData(data);
    }
    catch (e) {
    alert(e);
    return;
    }

    },
    error: function (result, status) {
    if (status = "error") {
    alert(status);
    }
    }
    });

    }


    Instead of filling a combo box I want to spilt the returned data by comma and populate textboxes with the class name .auto


    function FillComboWithData(data) {
    var strArr = data.split(",");
    var index = 0;
    $('.time').each(function () {
    $(this).val(strArr[index].toString());
    index++;
    });


    However I cant get passed the call to the web service any ideas?

    regards

    Michael
  • Replied 10 September 2017, 11:48 am EST

    Hello Michael,

    Make sure that service is returning a valid value in mystring variable and then, try using data.d instead of data in order to access the returned string in the success method of ajax call.

    Regards
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels