基础5 Abide和Modal AJAX问题

时间:2014-01-28 20:33:57

标签: jquery ajax validation modal-dialog zurb-foundation

我正在使用Foundation 5,我似乎无法让Abide在模态表单上正常工作。

表格来自:

<a href="/admin/edit_customer/<?= $order->id ?>/<?= $order->cust_id ?>" class="button tiny" data-reveal-id="myModal" data-reveal-ajax="true">Edit Customer</a>

一切都很顺利,除非永远不会开火。这是表格(缩写)。特别是,我遇到了电子邮件模式的问题。

<form data-abide action="/admin/edit_customer" method="POST">
<fieldset><legend>Edit Customer Information</legend>
<div class="row">
    <div class="large-6 columns">
        <div class="row collapse">
            <div class="small-4 columns">
                <label class="prefix" for="fname">First Name <small>required</small>    </label>
            </div>
            <div class="small-8 columns">
                <input type="text" id="fname" required value="<?= $c_info->fname ?>"     placeholder="<?= $c_info->fname ?>" name="c_fname">
                <small class="error">First name is required.</small>
            </div>
    </div>
</div>
<div class="large-6 columns">
    <div class="row collapse">
        <div class="small-4 columns">
            <label for="lname" class="prefix">Last Name <small>required</small></label>
        </div>
        <div class="small-8 columns">
            <input type="text" required value="<?= $c_info->lname ?>" placeholder="<?= $c_info->lname ?>" name="c_lname" id="lname">
            <small class="error">Last name is required.</small>
        </div>
    </div>
</div>
</div>

<div class="row">
<div class="large-9 columns">
    <div class="row collapse">
        <div class="small-3 columns">
            <label class="prefix" for="email">Email</label>
        </div>
        <div class="small-9 columns">
            <input type="text" name="c_email" pattern="email" id="email" value="<?= $c_info->email ?>" required>
            <small class="error">Need a valid email</small>
        </div>
    </div>
</div>
<div class="large-3 columns">
    <a href="#" class="button tiny radius" target="_blank">Email Customer</a>
</div>
</div>

我已尝试添加该行:

<script type="text/javascript">$(document).foundation('abide','events');</script>         

到最后,但这只是使模态失败。

任何人都有任何修复?或者,对于从哪里开始有任何想法?

1 个答案:

答案 0 :(得分:2)

HOT DIGGITY!

所以,结果是

$(document).foundation('abide','events');

是正确的做法,但它在基金会5中改为:

$('#your_form_id').foundation({bindings:'events'});

希望能帮到别人!!!