[RESOLVED] Find Method Not Returning Value

I am using twitter-bootstrap as my CSS framework and I have a sidebar that is made up of various list-groups and those list-groups have several list-group-items. However, only one list-group-item will ever have the active class.

What I'm attempting to do is set the href of previous/next buttons based on which list-group-item currently has the active class.

This is what I'm trying right now:

Code:

---

$(document).ready(function(){
    //get all of the list-group-items
    var lessons = $('li.list-group-item').not('.list-group-item-info');

    //get the index of the current lesson
    var currentIndex = lessons.index(lessons.find('.active'));

    //check to see if there is a previous lesson
    if (currentIndex > 0) {
        $('#previousLesson').attr('href', lessons.get(currentIndex - 1).children('a:first').attr('href'));
        $('#previousLesson').parent().removeClass('disabled');
    }

    //check to see if there is a next lesson
    if (currentIndex < lessons.length - 1) {
        $('#nextLesson').attr('href', lessons.get(currentIndex + 1).children('a:first').attr('href'));
        $('#nextLesson').parent().removeClass('disabled');
    }
});

---

The lessons variable returns all of the valid list-group-items, but the currentIndex is always returning a -1. I'm not understanding why it is returning a -1 because whenever I debug my code and view the lessons collection in the watch window, I can clearly see an item that contains the active class.

So my question is, why is the find Method not returning the item?

https://s29.postimg.org/y6lbjc9rb/find.png

I was able to solve my issue by using the Filter method:

Code:

---

var currentIndex = lessons.index(lessons.filter('.active'));

---

That was fast!

Hey dday...

Here is how I grab HTML content from the server in the .ready() event...

Code:

---

$(document).ready(function() {
.
.
.
    ctrlWebService("editpanels", "editpanels_health, "", "", "", []);

---

The function ctrlWebService does an AJAX POST to a backend web method...

Code:

---

        function ctrlWebService(strOpt, strVal1, strVal2, strVal3, strId, source, extra) {
            var newId = "";
            var objWebParam = {};
            var wesId = [];
            objWebParam.username = window.username || "";
            objWebParam.ctrloption = strOpt;
            objWebParam.ctrlval1 = strVal1;
            objWebParam.ctrlval2 = strVal2;
            objWebParam.ctrlval3 = strVal3;
            objWebParam.ctrlextra = extra || {};
            objWebParam.sguid = window.bootguid || "";
.
.
.
            var strWebParam = $.toJSON(objWebParam);
            $.ajax({
                type: "POST",
                url: "WebService.asmx/CtrlService",
                dataType: "json",
                data: strWebParam,
                contentType: "application/json; charset=utf-8",
                success: function(msg) {
                    ajaxCtrlFinished(msg, strId, "success", objWebParam);
                },
                failure: function(msg) {
                    ajaxCtrlFinished(msg, strId, "failure", objWebParam);
                },
                error: function(msg) {
                    ajaxCtrlFinished(msg, strId, "error", objWebParam);
                }
            });
        }

---

That backend VB function looks like this...

Code:

---

    <WebMethod()> _
    <ScriptMethod(ResponseFormat:=ResponseFormat.Json, UseHttpGet:=False)> _
    Public Function CtrlService(ByVal ctrloption As String, ByVal ctrlval1 As String _
                        , ByVal ctrlval2 As String _
                        , ByVal ctrlval3 As String _
                        , ByVal ctrlextra As Dictionary(Of String, String) _
                        , ByVal username As String _
                        , ByVal sguid As String _
                        , ByVal source As IList(Of Dictionary(Of String, String))) As String

        Dim rtnString As String = ""
.
.
.
        If ctrloption = "login" Then
            rtnString = ctrlLogin(credDB, ctrlval1, ctrlval2, ctrlval3)
        ElseIf ctrloption = "updatealert" Then
            rtnString = ctrlAlert(ctrlval1, ctrlval2, ctrlval3, sguid)
        Else
            Try
                If checkGuid(sguid) Then
                    rtnString = ctrlAction(credDB, ctrloption, ctrlval1, ctrlval2, ctrlval3, ctrlextra, username, source, sguid)
                Else
                    rtnString = "{""LoginRequired"": true}"
                    LogOutput("GUID not found (CtrlService): " & ctrloption)
                End If
            Catch ex As Exception
                LogOutput(ex.Message & " (CtrlService): " & ctrloption)
            End Try
        End If

        Return rtnString

    End Function

---

In that web service above the ctrlAction function is called - and the IF statement below is run though - where the folder of .ASPX files is opened up and those files read and turned into a JSON string for return to the browser.

Code:

---

    Private Function ctrlAction(credDB As String, ctrloption As String, ctrlval1 As String, ctrlval2 As String, ctrlval3 As String _
                                                                                , ctrlextra As Dictionary(Of String, String) _
                                                                                , username As String _
                                                                                , source As IList(Of Dictionary(Of String, String)) _
                                                                                , sguid As String) As String
        Dim JsonMaker As JsonWriter = New JsonWriter

        With JsonMaker
            .StartObject()

            Dim strMessage As String = "%no operation performed%"
            Dim strSuccess As String = "success"
.
.
.
            If ctrloption = "editpanels" Then
                Dim strEditPanelsFolder As String = System.Web.Configuration.WebConfigurationManager.AppSettings("editpanelsfolder")
                Dim strActualFolder As String = Path.Combine(strEditPanelsFolder, ctrlval1)
                Dim sHtml As New StringBuilder
                .NewObject("editpanels", True)
                .Seperate()
                For Each fil As String In IO.Directory.GetFiles(strActualFolder)
                    If IO.Path.GetExtension(fil).ToLower = ".aspx" Then
                        Dim strFileName As String = IO.Path.GetFileNameWithoutExtension(fil).ToLower
                        If ctrlval2 = "" OrElse ctrlval2 = strFileName Then
                            Dim inEditPanel As Boolean = False
                            Dim strContent As String = My.Computer.FileSystem.ReadAllText(fil)
                            Dim strLine As String() = strContent.Split(New String() {Environment.NewLine}, StringSplitOptions.None)
                            Dim sLine As Integer = 0
                            Dim eLine As Integer = 0
                            For i As Integer = 0 To strLine.Count - 1
                                If sLine = 0 AndAlso strLine(i).Contains("<form") Then
                                    sLine = i + 1
                                End If
                                If strLine(i).Contains("</form>") Then
                                    eLine = i - 1
                                End If
                            Next
                            sHtml.Length = 0
                            For i As Integer = sLine To eLine
                                sHtml.Append(strLine(i))
                                sHtml.Append(Environment.NewLine)
                            Next
                            .NewObject(strFileName, sHtml.ToString, True, True)
                            .Seperate()
                            If ctrlval2 <> "" Then
                                .NewObject("update", True)
                                .Seperate()
                                .NewObject("panelname", strFileName)
                                .Seperate()
                            End If
                        End If
                    End If
                Next
                strMessage = "Search Done"
            End If
.
.
.
            .NewObject("success", strSuccess)
            .Seperate()
            .NewObject("message", strMessage)
            .EndObject()
        End With

        Return JsonMaker.GetJson()
    End Function

---

The HTML files all look like the below. The <head> and <form> are needed to allow the .ASPX file to be edited in VS. You'll notice in the code that reads these above that the HTML up to the <FORM> is ignored - NOT sent to the browser. The snippet below is in a file called "compgroupinvestigation.aspx"

Code:

---

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title></title>
        <link href="../css/AWCOffice.css"rel="stylesheet" type="text/css" />
        <link href="../css/Final.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <form id="form1" onsubmit="return false;" runat="server">
            <div id="acs-edit-compgroupinvestigation" style="padding-left: 10px; padding-top: 10px;">
                <div class="acs-edit-lefthalf">
                    <div class="acs-div-p">
                        <span class="acs-span-large">Complaint Date</span>
                        <input type="text" class="awc-CompDate acs-edit-medium-text acs-class-datepicker acs-class-maxtoday"/>
                        Id: <label class="awc-CompId"></label>
                        <br />
                        <span class="acs-span-large">Close Date</span>
                        <input type="text" class="awc-ClosedDate acs-edit-medium-text acs-class-datepicker acs-class-maxtoday"/>

---

The raw JSON looks something like the below. Notice the KEY/VALUE pairs in the JSON object. The KEY names are the filenames that were read on the server. The VALUE is the HTM

Code:

---

{
        "editpanels": true,
        "compgroupinvestigation": "<div id=\\\"acs-edit-compgroupinvestigation\\\" style=\\\"padding-left: 10px...
        "doctypedocument": "<div id=\\\"acs-edit-doctypedocument\\\" style=\\\"padding-left: 10px...

---

And to finish this up the CALLBACK function from the AJAX POST that started all this does this with the JSON returned...

Code:

---

function ajaxCtrlFinished(msg, sender, rtnstatus, objOptions) {
    var objReturn = $.parseJSON(msg.d);
.
.
.
    if ((objReturn == null) || (objReturn.LoginRequired || false)) {
        errorMessage("Login Required", "Session has timed out - please login again!");
        if (g_GAWorker) {
            g_GAWorker.kill_alert();
        }
    } else {
        objReturn.login = objReturn.login || false;
        objReturn.button = objReturn.button || false;
.
.
.
        objReturn.editpanels = objReturn.editpanels || false;
        objReturn.filter = objReturn.filter || false;
.
.
.
        } else if (objReturn.editpanels) {
            g_editpanels = objReturn;
            g_editpanels.loaded = true;
.
.
.
}

---

Then later on when I need the HTML I simply get it from the global object variable "g_editpanels".

Code:

---

strEP = g_editpanels[strFromTo] || "";
if (strEP.length == 0) {
    strEP = "<br /><span>Edit Panel not found, please try to log out and log in again.</span>";
}
$(strEP).css("display", "none").appendTo(strEditPanel).addClass("acs-edit-bottom").removeAttr("id").attr("id", strNewId);

---