2012-03-25 17 views
2

考慮下面的HTML剪斷submiting垂直分佈式輸入:創建了兩種方式來沒有JavaScript

<input type="submit" value="Delete selected"><input type="submit" value="Print selected"> 
<div class="table"> 
    <div class="row"> 
    <span class="cell"><input type="checkbox" name="chose" value="1"></span> 
    <span class="cell"><input type="text" name="name" value="Joe"></span> 
    <span class="cell"><input type="text" name="age" value="23"></span> 
    <span class="cell"><input type="submit" name="save" value="Save"></span> 
    <span class="cell"><input type="submit" name="delete" value="Delete"></span> 
    </div> 
    <div class="row"> 
    <span class="cell"><input type="checkbox" name="chose" value="2"></span> 
    <span class="cell"><input type="text" name="name" value="Jack"></span> 
    <span class="cell"><input type="text" name="age" value="42"></span> 
    <span class="cell"><input type="submit" name="save" value="Save"></span> 
    <span class="cell"><input type="submit" name="delete" value="Delete"></span> 
    </div> 
</div> 

結果如下文件:

enter image description here

我想箱子在這樣兩種形式上部按鈕提交ckeckbox的方式...

enter image description here

...和行按鈕在同一行提交輸入:

enter image description here

雖然這個例子只有兩行,我想知道如何把它做任意數量的行。此外,解決方案不應該使用JavaScript(即使因爲我知道如何使用JavaScript來完成)。 OTOH可以重新排列元素的位置並在不改變視覺效果的情況下使用CSS。

那麼,有可能嗎?

注意:我使用<div>!而非<table>,所以我們不需要考慮使用內部表格形式的正確性。

+1

嗯..爲什麼不是JavaScript?這是ajax解決方案的完美示例\ – elclanrs 2012-03-25 01:23:04

+0

我寧願讓我的應用程序在沒有JavaScript的情況下也能正常工作(儘管我自由使用JavaScript來改進其行爲)。更重要的是,我希望它可以通過斜紋和機械化等工具輕鬆抓取。 – brandizzi 2012-03-26 19:36:43

回答

3

發送的發佈信息的一部分是用於使用值「Submit」提交的按鈕的名稱。如果您相應地命名它們,您可以確定要保存哪一行。

+0

是的,我已經用它來區分兩個線路按鈕。但是,我不喜歡它,因爲它迫使我編寫代碼來區分這些操作。 OTOH,我敢打賭,這是迄今爲止最好的解決方案。 – brandizzi 2012-03-25 15:37:47

相關問題