2012-08-30 46 views
4

比方說,我有一個簡單的表單(但它相當長)。在表單中有多個「提交」按鈕的最佳方式?

該表單將用戶數據提交到數據庫中,並且在第一次提交後,很少(99.99%)再次完全編輯,每次只有一個部分。

我不希望用戶必須向下滾動到他們需要的部分,然後必須再次滾動相同的距離才能提交。

<form> 

    <div> 
     <input type="text" /> 
    </div> 
    <div> 
     <input type="text" /> 
    </div> 
    <div> 
     <input type="text" /> 
    </div> 
    <div> 
     <input type="text" /> 
    </div> 

    <input type="submit" /> 

</form> 

這是它的「非常」的基本結構。將被視爲一個體面的做法,這樣做

<form> 

    <div> 
     <input type="text" /> 
    </div> 
    <input type="submit" /> 
    <div> 
     <input type="text" /> 
    </div> 
    <input type="submit" /> 
    <div> 
     <input type="text" /> 
    </div> 
    <input type="submit" /> 
    <div> 
     <input type="text" /> 
    </div> 

    <input type="submit" class="afterFormSubmit"/> 

</form> 

我不知道如果有一個「好」的方式來做到這一點,或者如果這是更好的方式來得到它完成的嗎?

+0

你是否使用AJAX方法排除了這個更好的UI? –

+0

不 - 我會考慮在這裏獲得一個AJAX方法,我只是不知道該怎麼去做。 真相被告知,我寧願不 - 但我真的不介意,尤其是如果它是一個更好的UI – Xhynk

回答

2

除非你用AJAX做這件事,最好的方法是用兩種形式。你可以在同一個表單中使用ajax請求提交兩個不同的東西。

或者,如果你想擁有同樣的形式提交各部分按鍵的只是一個提交鏈接像這樣

<a href="JavaScript:submit_form();">Submit</a> 

這樣無論他們在提交的作品爲你想要的形式是什麼節它來。

另一種選擇是使用標籤即http://jqueryui.com/demos/tabs/

你可以有你的1折片區域以外提交它分裂。更多的信息在這裏:http://www.jankoatwarpspeed.com/post/2009/02/18/How-to-deal-with-large-webforms.aspx

+1

關於處理大型表單的信息http://www.alistapart.com/articles/sensibleforms –

0

在你的情況,而不是隻有<form>,我認爲你應該有不同的表單,每個提交按鈕你想要的。

2

把你的提交按鈕放在一個不可滾動的視圖上。

<form> 
    <input type='text'/> 
    ... 
    ... 
    <input type='submit' style="display:fixed; top:100px; left:200px;" /> 
</form> 
0

是的,我做了一次,一個客戶端誰需要只是一個簡單的日曆兩個X

我已經把每個日曆一個提交按鈕,所有這些被嵌入到1種形式PHP_SELF

我是一個大的程序文件,儘管我更喜歡OOP

相關問題