關於選擇頁面的設計模式

2021-03-31 08:56:57 字數 650 閱讀 7437

b/s難免會用到選擇頁面:比如選客戶,選員工,選產品等等,對於這些,我們通常的方法是開啟乙個新視窗,上面會有上述內容的列表,然後我們勾選一下返回就可以了,通過一段時間的使用,漸漸發現了某些弊端:

可能在我們開發者來說,並不是特別麻煩的,但是對於測試人員和客戶來說,是個天大的災難,他們不得不僅僅為了選乙個他熟悉的記錄花費大量的時間。

由此,我在新的專案開始的時候注意到了這個問題,通過試驗,得出了乙個比較好的辦法,那就是----模擬outlook填寫email位址的方式。

由於是b/s系統,如果需要實現這個問題我們就要用到xmlhttp來無重新整理讀取記錄。廢話不多說,完整的思路是這樣:

有乙個text的輸入框,允許客戶填寫選擇的內容,比如:他要選客戶,那就填寫他的客戶的助記碼

按回車後,xmlhttp把這個助記碼傳回伺服器端,執行查詢,並將結果以xml的形式返回到前端(瀏覽器)。

前端瀏覽器通過js解析,如果有唯一記錄,那麼就將正確的客戶名稱加下劃線(表示通過驗證,客戶存在)賦值給文字框,

如果是多個記錄,文字框隱藏,顯示乙個下拉的列表讓操作人選擇乙個,並加選中內容加下劃線賦給文字框,文字框顯示,下拉列表隱藏。

如果沒有記錄,那麼顯示乙個訊息框。

通過這樣處理,就很好的提高了操作效率,提高了軟體的人性化的程度。

下面是demo的**:

20160708關於設計頁面的小感

一 注意的細節 1 注意頁面的統一性,包括字型,控制項的顏色 樣式 2 注意使用一些必要的提示,以提公升使用者的體驗,幫助使用者更好的理解 3 和設計人員配合好 二 寫 時應該思考的一些東西 1 注意思維的發散,多想 敢想 2 同樣的 注意不要重複使用 能合併就合併 3 同樣的頁面,不僅僅是自己測試...

關於父子頁面的互動

這兩天做專案的時候需要實現乙個功能,就是點選父頁面上的乙個超連結或是控制項,然後彈出乙個新的子頁面。在子頁面中作出相應的操作,然後將子頁面的值傳遞到父頁面,效果圖如下 根據網上的資料用js幾句話就可以搞定,可是自己做起來之後發現卻沒那麼簡單,網上的說法是當點選這個超連結 此處為文字框 時觸發乙個事件...

mvc模板頁面的設計

asp.net mvc 3 已經正式發布了,現在估計許多人都在拼命學,我也不能例外,剛剛看到了一篇文章,介紹了三個非常有用的方法 renderbody,renderpage和rendersection,現在自己再總結下。1.renderbody 在razor引擎中沒有了 母版頁 取而代之的是叫做 布...