如何使用条件过滤javascript甘特图并处理空输入？

Question

I've recently started using the DHTMLX javascript based Gantt chart . I'm having some issues with the filters which I don't feel are exclusively related to the chart itself, but, related to javascript.

So, the Gantt chart can be filtered by passing in some conditions via an if statement and returning true when those conditions are met. All my conditions values come from a selection of inputs, these inputs represent ranges.

<input type="text" class="k-textbox" id="bedsStart" />
<input type="text" class="k-textbox" id="bedsEnd" />

<input type="text" class="k-textbox" id="deckStart" />
<input type="text" class="k-textbox" id="deckEnd" />

<button type="button" id="filterSort">Set Filters</button>

When you click on the filter button the on click event is triggered and the values are gathered from the input fields.

$("#filterSort").on("click", function (e) {        
    let bedsStart = $('#bedsStart').val();
    let bedsEnd = $('#bedsEnd').val();
    let deckStart = $('#deckStart').val();
    let deckEnd = $('#deckEnd').val();

These values are then passed as conditions to the filter as per the documentation from DHTMLX:

    gantt.attachEvent("onBeforeTaskDisplay", function (id, task) {
        if (task.crane >= craneStart && task.crane <= craneEnd) {
            return true
        }        
        return false;
    });
    gantt.init("ganttReport");
}

The problem is if any of the text inputs are empty/null then the filter fails and returns nothing. Is there a way I can handle these nulls values by not including them or dynamically specify what filters to use?

The filter seems to only be capable of returning true or false so having multiple if statements don't work as it's always the last statement that will deliver an outcome with the previous iterations being overwritten ie

if(condition1)
{
    return true
}
if(condition2)
{
    return true
}
return false

The above code wouldn't work and only condition2 would be used as condition1 would be overwritten. So I can't just set out my conditions in this manner or using if else .

Can anyone offer a solution to how I can pass all these conditions to this single statement yet handle the nulls?

Answer 1

这是一个有效的示例，您可以尝试仅使用startDate / endDate或同时使用这两种方法： https : //codesandbox.io/s/7qz1kw9vq