0

我的页面上有 3 个选项：早餐、午餐和晚餐。当您将鼠标悬停在它们上方时，会出现一个选择餐点的请求按钮。这带来了一个模态表单，让人们可以在一个表单中选择不同的膳食。

我想在餐食类型中添加餐食。不过，我可以找出膳食类型的唯一方法是，如果我以某种方式将此信息传递给 1) 模态对话框和 2) 那里的提交按钮。

我将如何做这两件事？

相关代码：

模板

        <div class="row-fluid">
            <div class="span12 hero-unit">
                <div class="row-fluid">
                       <h3> What Type of Meal Is It- Breakfast Lunch or Dinner? </h3>
                    </p>
                    <br>
                </div>
                <div class="row-fluid align-center">
                    <div class="span4">
                        <div>
                            <div class="library-image-parent">
                                <img src="{{ STATIC_URL }}images/breakfast.png"
                                width="200" height="160" alt="1" />
                                <div class="options">
                                    <ul class="unstyled" style="font-size:16px;">
                                 <div class="span11" style="text-align:center;">
                                        <a href="#myModal" role="button" class="btn btn-success" data-toggle="modal">Request A Meal</a>
                                                                        </div>
                            </div>
                        </div>
</div>

                    </div>

提出用餐要求的模式表格

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Select Your Meal to Make a Request</h3>
</div>
<div class="modal-body">
<form enctype="multipart/form-data" method="POST" action="" class="uniForm">
    <fieldset class="inlineLabels">
        {% csrf_token %}
        <h6> Meal </h6>
        <br>
        {{ formtoaddrequest.meal }}
        <br>
                    <div class="form_block" style="float:right;">
                        <input class="btn btn-primary" type="submit" value="{% trans 'Add Request' %}">
                    </div>
    </fieldset>
</form>
</div>
</div>
4

1 回答 1

0

据我了解，您希望将餐食动态添加到您的表单对话中。这将要求您使用 javascript 将餐点添加到您的页面，以便用户可以选择餐点。一旦用户选择了早餐、午餐或晚餐，您将需要进行 Ajax 调用以返回可以在所选菜单下选择的餐点。在这种情况下，菜单指的是早餐菜单、午餐菜单或晚餐菜单。

于 2012-12-09T01:15:09.510 回答