Javascript UI5-过滤器组合框放置问题

Javascript UI5-过滤器组合框放置问题,javascript,combobox,sapui5,Javascript,Combobox,Sapui5,我已经设置了一些组合框作为报告过滤器的一部分 报告运行良好。唯一的问题是我想以不同的顺序放置组合框,而不是它们现在的显示方式 请看一看图像,它现在是什么样子: 我想把日期范围、开始日期、结束日期放在前排,而就在我想设置区域、离开、线路和订单状态的下方。所以有两行过滤器 我的XML视图如下所示: <Panel headerText="Order Report Filters" expandable="true"

我已经设置了一些组合框作为报告过滤器的一部分

报告运行良好。唯一的问题是我想以不同的顺序放置组合框,而不是它们现在的显示方式

请看一看图像,它现在是什么样子:

我想把日期范围、开始日期、结束日期放在前排,而就在我想设置区域、离开、线路和订单状态的下方。所以有两行过滤器

我的XML视图如下所示:

 <Panel headerText="Order Report Filters" expandable="true"
                                                    id="filterPanel" expand="onPanelExpand" expanded="true">
                                                    <content>

                                                     <f:SimpleForm editable="true" layout="ResponsiveGridLayout"
                                                            id="mainform" labelSpanL="6" labelSpanM="6"
                                                            adjustLabelSpan="false" emptySpanL="0" emptySpanM="1"
                                                            columnsL="2" columnsM="2" class="formTitleStyle">

                                                            <f:content>

                                                                <core:Title />                                                       
                                                                <Label text="Date Range">
                                                                <layoutData>
                                                                        <l:GridData span="L6 M6 S6"/>
                                                                    </layoutData>

                                                                </Label>
                                                                <Select id="dateRangeSelect" items="{ path: '/DateRangeFilter'}"
                                                                    change="onDateRangeFilterSelect">
                                                                    <core:Item key="{key}" text="{display}" />
                                                                </Select>
                                                                <Label text="Start Date">
                                                                    <layoutData>
                                                                        <l:GridData span="L6 M6 S6"/>
                                                                    </layoutData>
                                                                </Label>
                                                                <DatePicker id="startDate" enabled="false"
                                                                    change="onStartDateSelect" valueFormat="yyyy-MM-dd" placeholder="Choose Start Date ... "
                                                                     />
                                                                <Label text="End Date">
                                                                  <layoutData>
                                                                        <l:GridData span="L6 M6 S6"/>
                                                                    </layoutData>
                                                                </Label>
                                                                <DatePicker id="endDate" enabled="false"
                                                                    change="onEndDateSelect" valueFormat="yyyy-MM-dd" placeholder="Choose End Date ... "
                                                                    />

                                                                <core:Title />  
                                                                <Label id="idAreaLabel" visible="false">
                                                                    <layoutData>
                                                                        <l:GridData span="L5 M5 S5"/>
                                                                    </layoutData>
                                                                </Label>
                                                                <Select id="areaSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                                    change="onAreaSelect" visible="false" forceSelection="false">
                                                                    <core:Item key="{ID_ORG_AREA}" text="{DS_VALUE}" />
                                                                </Select>

                                                                <Label id="idDepartmentLabel" visible="false" text="Department">
                                                                    <layoutData>
                                                                        <l:GridData span="L5 M5 S5"/>
                                                                    </layoutData>
                                                                </Label>
                                                                <Select id="departmentSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                                    change="onDepartmentSelect" visible="false" enabled = "false" forceSelection="false">
                                                                    <core:Item key="{ID_ORG_DEPARTMENT}" text="{DS_VALUE}" />
                                                                </Select>


                                                                <Label id="idAssetLabel" visible="true" text="Line123">
                                                                    <layoutData>
                                                                        <l:GridData span="L5 M5 S5"/>
                                                                    </layoutData>
                                                                </Label>
                                                                 <Select id="assetSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                                    change="onAssetSelect" enabled = "false" forceSelection="false">
                                                                    <core:Item key="{ID_ORG_ASSET}" text="{DS_VALUE}" />
                                                                </Select>


                                                               <Label id="idOrderStatusLabel" visible="true" text="Order Status">
                                                                    <layoutData>
                                                                        <l:GridData span="L5 M5 S5"/>
                                                                    </layoutData>
                                                                </Label>
                                                                <Select id="orderStatusSelect" items="{ path: '/OrderStatus'}"
                                                                    change="loadTableData" visible="true" forceSelection="false">
                                                                    <core:Item key="{key}" text="{display}" /> 
                                                               </Select>                                                                                                                        

                                                            </f:content> 
                                                        </f:SimpleForm> 

                                                    </content>
                                                </Panel>

我尝试了
标记的各种排列和组合,但都做不到

有人能提供一些信息吗


谢谢

正如我从您下面提到的问题中了解到的,是Xml代码,请尝试:

<Panel headerText="Order Report Filters" expandable="true"
                            id="filterPanel" expand="onPanelExpand" expanded="true">
                            <content>

                                    <f:SimpleForm editable="true" layout="ResponsiveGridLayout"
                                            id="mainform" labelSpanL="6" labelSpanM="6" adjustLabelSpan="false"
                                            emptySpanL="0" emptySpanM="0" columnsL="4" columnsM="4"
                                            class="formTitleStyle">

                                            <f:content>

                                                    <core:Title />
                                                    <Label text="Date Range">
                                                            <layoutData>
                                                                    <l:GridData span="L6 M6 S6" />
                                                            </layoutData>

                                                    </Label>
                                                    <Select id="dateRangeSelect" items="{ path: '/DateRangeFilter'}"
                                                            change="onDateRangeFilterSelect">
                                                            <core:Item key="{key}" text="{display}" />
                                                    </Select>

                                                    <core:Title />
                                                    <Label text="Start Date">
                                                            <layoutData>
                                                                    <l:GridData span="L6 M6 S6" />
                                                            </layoutData>
                                                    </Label>
                                                    <DatePicker id="startDate" enabled="false"
                                                            change="onStartDateSelect" valueFormat="yyyy-MM-dd"
                                                            placeholder="Choose Start Date ... " />

                                                    <core:Title />
                                                    <Label text="End Date">
                                                            <layoutData>
                                                                    <l:GridData span="L6 M6 S6" />
                                                            </layoutData>
                                                    </Label>
                                                    <DatePicker id="endDate" enabled="false"
                                                            change="onEndDateSelect" valueFormat="yyyy-MM-dd"
                                                            placeholder="Choose End Date ... " />

                                                    <core:Title /> 

                                                    <core:Title />
                                                    <Label id="idAreaLabel" visible="true" text="Dropdown" >
                                                            <layoutData>
                                                                    <l:GridData span="L5 M5 S5" />
                                                            </layoutData>
                                                    </Label>
                                                    <Select id="areaSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                            change="onAreaSelect"  forceSelection="false">
                                                            <core:Item key="{ID_ORG_AREA}" text="{DS_VALUE}" />
                                                    </Select>

                                                    <core:Title />
                                                    <Label id="idDepartmentLabel" visible="true" text="Department">
                                                            <layoutData>
                                                                    <l:GridData span="L5 M5 S5" />
                                                            </layoutData>
                                                    </Label>
                                                    <Select id="departmentSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                            change="onDepartmentSelect" enabled="false"
                                                            forceSelection="false">
                                                            <core:Item key="{ID_ORG_DEPARTMENT}" text="{DS_VALUE}" />
                                                    </Select>

                                                    <core:Title />      
                                                    <Label id="idAssetLabel" visible="true" text="Line123">
                                                            <layoutData>
                                                                    <l:GridData span="L5 M5 S5" />
                                                            </layoutData>
                                                    </Label>
                                                    <Select id="assetSelect" items="{ path: '/Rowsets/Rowset/0/Row'}"
                                                            change="onAssetSelect" enabled="false" forceSelection="false">
                                                            <core:Item key="{ID_ORG_ASSET}" text="{DS_VALUE}" />
                                                    </Select>

                                                    <core:Title />
                                                    <Label id="idOrderStatusLabel" visible="true"
                                                            text="Order Status">
                                                            <layoutData>
                                                                    <l:GridData span="L5 M5 S5" />
                                                            </layoutData>
                                                    </Label>
                                                    <Select id="orderStatusSelect" items="{ path: '/OrderStatus'}"
                                                            change="loadTableData" visible="true" forceSelection="false">
                                                            <core:Item key="{key}" text="{display}" />
                                                    </Select>

                                            </f:content>
                                    </f:SimpleForm>

                            </content>
                    </Panel>