Need to filter datatable based on date selection

smruti20

i am not able to filter datatable on selection of date picker. the logic is display all records if submitted date is between from date and To date

<div class="form-group">
    <div class="input-group input-daterange">
        <span id="date-label-from" class="input-group-addon">From: </span>
        <input type="text" id="min" class="form-control">
        <span id="date-label-to" class="input-group-addon">To: </span>
        <input type="text" id="max" class="form-control">
    </div>
</div>
<table id="divDT" class="table table-striped table-bordered table-hover table-condensed" style="text-align:center;">
</table>

 $(document).ready(function() 
        {
           getAllSubmittedRecords();
            
            //Date picker
            $.fn.dataTable.ext.search.push(
            function( settings, data, dataIndex ) 
                {
                    var min =  $('#min').val();
                    var max =  $('#max').val();
                    var date_submitted =  data[7]  || 0; 
             
                     if (min == "" && max == "") { return true; }
                     if (min == "" && date_submitted <= max) { return true;}
                     if(max == "" && date_submitted >= min) {return true;}
                     if (date_submitted <= max && date_submitted >= min) { return true; }
                     return false;
                }
            );
            
            
            
            //for date selection
            $("#min").datepicker({ onSelect: function () { oTable.draw(); }, changeMonth: true, changeYear: true, dateFormat:"yy-mm-dd"});
            $("#max").datepicker({ onSelect: function () { oTable.draw(); }, changeMonth: true, changeYear: true, dateFormat:"yy-mm-dd"});
      
        });  


function getAllSubmittedRecords()
        {
            $.ajax({
                url: _spPageContextInfo.webAbsoluteUrl + ListName,
                type: "GET",
                headers: {
                    "accept": "application/json;odata=verbose",
                },
                success: function (data) 
                {
                    var items = data.d.results;
                    if(items.length > 0)
                    {
                        for (var i = 0; i < items.length; i++) 
                        {
                            var projectId = items[i].ProjectID;
                            if(projectId == null)
                                projectId = "";
                            
                            var requestID =  items[i].WorkfrontID;
                            if(requestID == null)
                                requestID = "";
                            
                            var reqProjId;
                            if(projectId == "" && requestID != null)
                            {
                                reqProjId= requestID;
                            }
                            else if(projectId != null && requestID == "")
                            {
                                reqProjId = projectId;
                            }
                            else
                            {
                                reqProjId="";
                            }
                        
                            var PM_ID = items[i].ProjectManagerId;
                            if (PM_ID == null)
                                PM_ID="";
                            else 
                                PM_ID=getDisplayName(items[i].ProjectManagerId);
                        
                            var baName = items[i].BANameId;
                            if (baName == 'undefined' || baName == "" )
                                baName="";
                            else 
                                baName  = getDisplayName(items[i].BANameId);
                                
                            var projectName = items[i].ProjectName;
                            
                            var clientName =  items[i].ClientNameId;
                            if(clientName == "47")
                                clientName = items[i].OtherClient;
                            else
                                clientName = getClientNameOnId(items[i].ClientNameId);
                                
                             var submissionDate = items[i].SubmissionDate;
                            if(submissionDate == null || submissionDate == "")
                                submissionDate = "";
                            else
                                submissionDate = new Date(items[i].SubmissionDate).format("dd/MM/yyyy");    
                        
                            if(submissionDate == null || submissionDate == "")
                                dtArray.push([items[i].Id,items[i].Title,reqProjId,clientName,projectName,baName,PM_ID,""]);
                            else
                                dtArray.push([items[i].Id,items[i].Title,reqProjId,clientName,projectName,baName,PM_ID,submissionDate]);
                        }
                  
                         //dataArray=dtArray;
                          
                     var oTable = $('#divDT').dataTable(
                        {
                            dom: 'lBfrtip',
                            buttons: [
                            'excelHtml5',
                            ],
                            "order": [[ 0, "desc" ]],
                            data: dtArray,
                             "columnDefs": [
                            {
                                "targets": [ 0 ],
                                "visible": false
                            }],
                            columns: [
                                { title: "Id" },
                                { title: "Form Id" },
                                { title: "Request / Project Id" },
                                { title: "Client Name" },
                                { title: "Project Name" },
                                { title: "BA" },
                                { title: "PM" },
                                { title: "Submission Date" }
                            ]
                        });
                        $(".dt-button span").text("Export to Excel");  
                    }
                },
                error: function (error) {
                   // alert(JSON.stringify(error));
                }
            });
        }

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

Hi @smruti20 ,

That's a lot of code to look through. We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

smruti20

i have mention my code in below link
https://jsfiddle.net/qLaxpnf1/

colin

Hi @smruti20 ,

That doesn't run, so we can't diagnose the issue.

Colin