正确格式化这些表单

时间:2013-01-10 15:32:50

标签: html forms xhtml

我有一种情况,嵌套表单可以很好地工作,但显然不允许嵌套表单。

采用以下示例:

<form method="post" action="bid.php">
   <input type="hidden" value="11111111" name="auction_id">
   <input type="hidden" value="bid_confirm" name="action">                
    <!-- Holder Ends -->
    <div class="holder2">
        <div class="text">
            Quantity:
        </div>
        <div class="field">
            <input type="text" maxlength="6" value="1" class="small" name="quantity">
        </div>
        <!-- Btn Ends -->                                                    
        <div class="contentClear"></div>
    </div>
    <!-- Holder Ends -->                                                             
    <div class="holder holder3">                                                        
        <div class="field">
            <input type="text" maxlength="15" name="max_bid">
        </div>
        <div class="btn">
            <input type="image" src="images/pixel.gif" class="bid" name="submit">
        </div>
        <!-- Btn Ends -->
        <form method="post" action="make_offer.php?auction_id=11111111">  
            <div class="btn btn_offer">
                <input type="image" src="images/pixel.gif" class="offer" name="submit">
            </div>
            <!-- Btn Ends -->
        </form>                                    
        <div class="contentClear"></div>
    </div>
    <!-- Holder Ends -->            
</form>   

您将从上面看到嵌套是理想的。

从技术上讲,我可以在另一个表单开始之前关闭第一个表单,因为所有必需的字段都已输出auction_id,action,quantity,max_bid但是我想避免这个,因为代码开始看起来很乱,因为表单会打开&amp;结束于代码的不同部分&amp;这不是很理想。

有没有人知道如何在不诉诸Javascript的情况下处理这种情况?

1 个答案:

答案 0 :(得分:1)

您可以使用第二种形式(制作商品)AJAX组件,您不会提交表单但仍能正确发送数据。 IMO这将是最好的方法,但你不想恢复到javascript(出于某种原因)。

另一个可行的选项是不要让表单插入页面的iFrame。然后,此页面将包含您的第二个表单并提交。这个问题是你必须找到一种方法将auctionID传递给iFrame。但是如果你可以通过URL参数来做到这一点,那么它应该不会太糟糕。

我认为看起来很像这样:

    <!-- Btn Ends -->
    <iframe src="pagewithform2.php?auction_id=1111111" width="xx" height="xx" scrolling="no"/>                                  
    <div class="contentClear"></div>