jQuery加载<button>而不是href

时间:2015-09-24 06:49:08

标签: php jquery

我目前有一个购物车,我正在加载到我自己的自定义仪表板中,例如使用一个html页面将php购物车页面加载到我自己的html文件中。

$app->get('/cata-categories/?', function () use ($app) {   
           $app->render('cata-categories.html', [
               'page' => [
                   'author' =>         $app->site->author,
                   'title' =>          "Catagories",
                   'description' =>    "Catalogue Catagories.",
                   'alerts' =>         $app->alerts->getAndClearMessages()
               ]
           ]);  
        });

为了让它工作得很好,我在我自己的仪表板页面的页面上加载购物车上的页面链接。

<ol id="categories"></ol>

                <script>
                    $( "#categories" ).load( "../solutions/admin/index.php?route=catalog/category" );
                </script>

为了保留仪表板中的所有内容,我在这些购物车页面上的链接也在同一个div中打开,我也在使用加载功能。

使href链接加载到我正在使用的相同div中的代码如下:

$("#categories").on("click", "a", function (e) {
    $("#categories").load($(this).attr("href"));
    e.preventDefault();
});

我还有按钮来提交表单或加载/链接到另一个页面: 例如

<button type="submit" form="form-category" data-toggle="tooltip" title="<?php echo $button_save; ?>" class="btn btn-primary"><i class="fa fa-save"></i></button>

我希望在点击该页面上的这些按钮和其他按钮时加载相同的div,就像href链接一样。

基本上我的问题是我用什么而不是.attr(&#34; href&#34;)?

3 个答案:

答案 0 :(得分:1)

首先,如果您想在不导致页面加载的情况下提交表单,建议您使用AJAX

其他 如果您仍打算使用$.load(),您可以执行的操作是在按钮中添加data-*属性,例如{{1} }}

data-url="your url"

现在使用<input type="submit" data-url="your-url" value="Load" /> 抓住点击事件,阻止其默认设置,并使用jQuery加载数据。

答案 1 :(得分:0)

表单的操作会告诉您URL。

您需要以不同的方式表达数据,具体取决于表单是在发出GET还是POST请求。

有些事情:

$("button").on('click', function (e) {
    var $f = $(this.form);
    var data;
    if (f.attr("method").toLowerCase() === "post") {
        data = $f.serializeArray();
    } else {
        data = $f.serialize();
    }
    $("#categories").load(
        $f.attr("action") || location.href,
        data
    );
    e.preventDefault()
});

......可能会做到这一点,但我还没有测试过它。

答案 2 :(得分:0)

所以我意识到我在哪里出错了。购物车具有验证表格/提交等功能,我只需要使用

$this->response->redirect('../../portal/cata-categories');

我使用.load方式将购物车页面注入我的仪表板意味着我显然没有被重定向回他们来自的相同网址。它直接进入购物车页面,而不是我的仪表板页面正在加载购物车页面。

感觉有点愚蠢,以前没有看到它,但它已经修复了!感谢大家的投入 - 一如既往地超级有用:)