本發(fā)明涉及web界面技術(shù)領(lǐng)域,特別涉及一種基于自由表單的動態(tài)生成web界面的方法。
背景技術(shù):
在許多基于網(wǎng)絡的應用程序中,數(shù)據(jù)訪問、數(shù)據(jù)操縱和數(shù)據(jù)演示通過對諸如數(shù)據(jù)庫表等底層數(shù)據(jù)的用戶接口來促進。為了標準化功能,用戶接口能夠以基于web的格式來呈現(xiàn)以使得具有對web瀏覽器的訪問的任何用戶都能夠與底層數(shù)據(jù)交互。例如,數(shù)據(jù)可通過允許用戶訪問并操縱數(shù)據(jù)的一個或多個基于web的表單來呈現(xiàn)。為了創(chuàng)建基于web的表單,表單設計者通常手動設計數(shù)據(jù)層和演示層。數(shù)據(jù)層響應于來自演示層的命令與底層數(shù)據(jù)交互(例如,向數(shù)據(jù)庫發(fā)出查詢)并為演示層提供數(shù)據(jù)(例如,數(shù)據(jù)庫查詢的結(jié)果)。表單設計者還可將諸如過濾、主細節(jié)、基于服務器的分頁以及編輯、刪除和插入命令等其他功能構(gòu)建到數(shù)據(jù)層中。例如,數(shù)據(jù)層可根據(jù)其他準則來過濾查詢結(jié)果以便將合適的數(shù)據(jù)集返回給演示層。
某些web表單開發(fā)平臺利用部分自動化的技術(shù)來生成基于web的表單。例如,至少一個平臺支持自動顯示、編輯、更新和刪除功能。然而,這些平臺仍然需要手動活動以獲得其他功能。例如,過濾、分頁和排序通常即使使用這些開發(fā)平臺也需要人工干預。因此,即使在使用部分自動化的技術(shù)時,仍然可消耗相當多的資源以便手動添加附加功能。
技術(shù)實現(xiàn)要素:
本發(fā)明的目的旨在至少解決所述技術(shù)缺陷之一。
為此,本發(fā)明的目的在于提供了一種基于自由表單的動態(tài)生成web界面的方法,將自由表單動態(tài)生成web界面,使其操作更加靈活,無需消耗相當多的資源就可以添加附加功能。
為了實現(xiàn)上述目的,本發(fā)明提供一種基于自由表單的動態(tài)生成web界面的方法,包括以下步驟:
步驟s1,定義頁面級信息,至少包括關(guān)聯(lián)的元數(shù)據(jù)、列表頁面數(shù)據(jù)分頁規(guī)則、列表頁面數(shù)據(jù)默認排序規(guī)則;
步驟s2,定義字段級信息,至少包括中文名稱、元素類型、輸入類型、輸入設定;
步驟s3,根據(jù)頁面級信息,按照規(guī)則約束進行解析,動態(tài)渲染列表頁面,并加載數(shù)據(jù);
其中,列表頁面加載步驟如下:
步驟s301,根據(jù)功能編號讀取表單配置;
步驟s302,根據(jù)列表顯示字段渲染列表分列;
步驟s303,根據(jù)查詢表或試圖加載業(yè)務數(shù)據(jù);
步驟s304,根據(jù)每頁顯示數(shù)量進行分頁處理;
步驟s305,根據(jù)字段的元素類型和輸入類型渲染列控件;
步驟s306,根據(jù)輸入設定初始化控件中的數(shù)據(jù);
步驟s307,根據(jù)表單列表按鈕初始化按鈕;
步驟s308,完成列表界面加載;
步驟s4,根據(jù)字段級信息,自動渲染卡片頁面,并加載數(shù)據(jù);
步驟s5,根據(jù)輸入規(guī)則,校驗輸入是否正確;
步驟s6,輸出加載后的列表界面和列表界面。
進一步的,在步驟s3中,可根據(jù)自身業(yè)務自定義擴展類,實現(xiàn)action接口,用于完成業(yè)務數(shù)據(jù)的保存、刪除的特殊業(yè)務。
進一步的,所述列表頁面還設置個性化按鈕、查詢按鈕。
進一步的,在步驟s4中,卡片界面內(nèi)還可以根據(jù)輸入類型、輸入設定,自動生成字段控件,字段控件至少包括下拉框、單選框、多選框。
進一步的,在步驟s5中,如果校驗輸入不正確,則提示重新輸入,如果校驗輸入正確,則進入下一操作。
進一步的,在步驟s4中,卡片頁面加載步驟如下:
步驟s401,根據(jù)功能編號讀取表單配置;
步驟s402,根據(jù)卡片顯示字段渲染詳細頁輸入字段;
步驟s403,根據(jù)操作表查詢業(yè)務數(shù)據(jù);
步驟s404,根據(jù)字段的元素類型和輸入類型渲染輸入框的控件;
步驟s405,根據(jù)輸入設定初始化控件中的數(shù)據(jù);
步驟s406,根據(jù)是否只讀控制輸入項是否可編輯;
步驟s407,根據(jù)卡片是否為空控制輸入項是否允許為空;
步驟s408,根據(jù)表單卡片按鈕初始化按鈕;
步驟s409,完成卡片界面加載。
進一步的,所述卡片頁面加載是由雙擊列表數(shù)據(jù)后開始的。
本發(fā)明將表單生成web界面,并且可對所生成的web界面進行自定義,使其使用更加靈活,同時,按照規(guī)則約束進行解析,能快速的動態(tài)渲染列表頁面,并加載數(shù)據(jù),相比傳統(tǒng)的用部分自動化的技術(shù)來生成基于web的表單的方式,無需人工干預就可以自動生成web界面,還可以自定義多個功能按鈕,便于操作。
附圖說明
本發(fā)明的上述和/或附加的方面和優(yōu)點從結(jié)合下面附圖對實施例的描述中將變得明顯和容易理解,其中:
圖1為本發(fā)明的主體流程圖;
圖2為本發(fā)明的列表頁面加載流程圖;
圖3為本發(fā)明的卡片頁面加載流程圖。
具體實施方式
下面詳細描述本發(fā)明的實施例,所述實施例的示例在附圖中示出,其中自始至終相同或類似的標號表示相同或類似的元件或具有相同或類似功能的元件。下面通過參考附圖描述的實施例是示例性的,旨在用于解釋本發(fā)明,而不能理解為對本發(fā)明的限制。
下面結(jié)合具體實施方式對本發(fā)明作詳細說明。
如圖1-3所示,本發(fā)明提供的基于自由表單的動態(tài)生成web界面的方法,包括以下步驟:
步驟s1,定義頁面級信息,至少包括關(guān)聯(lián)的元數(shù)據(jù)、列表頁面數(shù)據(jù)分頁規(guī)則、列表頁面數(shù)據(jù)默認排序規(guī)則;
步驟s2,定義字段級信息,至少包括中文名稱、元素類型、輸入類型、輸入設定;
步驟s3,根據(jù)頁面級信息,按照規(guī)則約束進行解析,動態(tài)渲染列表頁面,并加載數(shù)據(jù);
其中,列表頁面加載步驟如下:
步驟s301,根據(jù)功能編號讀取表單配置;
步驟s302,根據(jù)列表顯示字段渲染列表分列;
步驟s303,根據(jù)查詢表或試圖加載業(yè)務數(shù)據(jù);
步驟s304,根據(jù)每頁顯示數(shù)量進行分頁處理;
步驟s305,根據(jù)字段的元素類型和輸入類型渲染列控件;
步驟s306,根據(jù)輸入設定初始化控件中的數(shù)據(jù);
步驟s307,根據(jù)表單列表按鈕初始化按鈕;
步驟s308,完成列表界面加載;
此外,列表界面可根據(jù)自身業(yè)務自定義擴展類,實現(xiàn)action接口,用于完成業(yè)務數(shù)據(jù)的保存、刪除的特殊業(yè)務。列表頁面還設置個性化按鈕、查詢按鈕,個性化按鈕可在擴展js中實現(xiàn)。
步驟s4,根據(jù)字段級信息,自動渲染卡片頁面,并加載數(shù)據(jù);所述卡片頁面加載是由雙擊列表數(shù)據(jù)后開始的。
其中,卡片頁面加載步驟如下:
步驟s401,根據(jù)功能編號讀取表單配置;
步驟s402,根據(jù)卡片顯示字段渲染詳細頁輸入字段;
步驟s403,根據(jù)操作表查詢業(yè)務數(shù)據(jù);
步驟s404,根據(jù)字段的元素類型和輸入類型渲染輸入框的控件;
步驟s405,根據(jù)輸入設定初始化控件中的數(shù)據(jù);
步驟s406,根據(jù)是否只讀控制輸入項是否可編輯;
步驟s407,根據(jù)卡片是否為空控制輸入項是否允許為空;
步驟s408,根據(jù)表單卡片按鈕初始化按鈕;
步驟s409,完成卡片界面加載。
此外,卡片界面內(nèi)還可以根據(jù)輸入類型、輸入設定,自動生成字段控件,字段控件至少包括下拉框、單選框、多選框。
步驟s5,根據(jù)輸入規(guī)則,校驗輸入是否正確;如果校驗輸入不正確,則提示重新輸入,如果校驗輸入正確,則進入下一操作。
步驟s6,輸出加載后的列表界面和列表界面。
本發(fā)明將表單生成web界面,并且可對所生成的web界面進行自定義,使其使用更加靈活,同時,按照規(guī)則約束進行解析,能快速的動態(tài)渲染列表頁面,并加載數(shù)據(jù),相比傳統(tǒng)的用部分自動化的技術(shù)來生成基于web的表單的方式,無需人工干預就可以自動生成web界面,還可以自定義多個功能按鈕,便于操作。
盡管上面已經(jīng)示出和描述了本發(fā)明的實施例,可以理解的是,上述實施例是示例性的,不能理解為對本發(fā)明的限制,本領(lǐng)域的普通技術(shù)人員在不脫離本發(fā)明的原理和宗旨的情況下在本發(fā)明的范圍內(nèi)可以對上述實施例進行變化、修改、替換和變型。本發(fā)明的范圍由所附權(quán)利要求極其等同限定。