【问题标题】:multiple submit buttons in one form correlating to javascript functions please请以与 javascript 函数相关的一种形式提供多个提交按钮
【发布时间】:2015-03-19 12:23:34
【问题描述】:

我有一个需要两个提交按钮的 php 表单。一个使用 ajax 提交表单(有效),但现在我需要添加另一个按钮来完成销售。

我目前的方法是在表单中添加另一个提交按钮并尝试在 javascript 中区分两者(我不知道该怎么做)。

因此,我们将不胜感激这里的任何帮助或任何其他推荐的方法。

php表单

<form id="bidForm">
    <div class="form-group" id="divCheckbox" style="visibility: hidden">
        {{ Form::hidden('item_id', $item->id) }}
        {{ Form::hidden('user_id', Auth::User()->id) }}
    </div>
    <!-- bid    -->
    <div class="form-group" style="width: 100px" style="text-align: right">
        {{Form::label('bid_amount', 'Bid:') }}
        {{Form::text('bid_amount', null, ['class' => 'form-control', 'id' =>     'bid-amount']) }}
    </div>
    <!-- max bid   
    <div class="form-group">
        {{Form::label('max_bid', 'Max Bid:') }}
        {{Form::text('max_bid', null, ['class' => 'form-control']) }}
    </div> -->
    {{ Form::hidden('permission', "userr") }}

     <!-- submit``    -->
    <div class="form-group">
      {{Form::submit('Bid', ['class' => 'btn btn-primary', 'id' => 'submit']) }} 
    </div>
     {{ Form::close() }}

脚本

$( "#bidForm" ).submit(function( e ) {
// Async submit a form's input.
     e.preventDefault();
    var form = $(this);
    var method = 'POST';
    var url= "/items/" + {{ $item->id }}; 
    //var bid = $("#winner").innerHTML().val();
    var bid = document.getElementById("winner").innerHTML;
    var new_bid = $("#bid-amount").val(); 
         bigger = (new_bid > bid) ? true : false;
         console.log('');
    if(bigger){
        $.ajax({
            type: method,
            url: url,
            data: form.serialize(),
            action:"http://localhost:8000/items" + {{ $item->id }},
            success: function(data) {
                console.log("AJAX request was successfull");
                $('#bid-amount').val('');
            },
            failure: function() {
                console.log("AJAX request failed");
            }

        });
    }
    else{
        window.alert("This is not a high bid");

    }

});

【问题讨论】:

    标签: javascript php jquery ajax laravel


    【解决方案1】:

    ClickCoder 的答案here 的实现将解决您的问题。

    编辑:

    好的,您可以使用提交按钮执行以下操作:

    {{Form::submit('Bid', ['class' => 'btn btn-primary submit', 'id' => 'bid']) }}
    
    {{Form::submit('Complete Sale', ['class' => 'btn btn-primary submit', 'id' => 'sale']) }}
    

    然后像这样在JS中区分它们:

    $('.submit').on('click', function(e){
    //When a submit is clicked
    e.preventDefault();
    //prevent submit button default action
    var $token = $(this).attr('id');
    //get the id of the submit
    if($token == 'bid'){
    //If the clicked submit has an id of bid - Do Ajax stuff
    }else{
    //Do sale stuff
    }
    });
    

    【讨论】:

    • 嗨,正如我所说,我需要一个 JavaScript 实现,因为我正在使用 ajax。尽管 php 实现在技术上可行,但连锁反应将是页面重新加载,因此这是不可接受的。
    • 上面编辑的答案有一个简单的实现来区分点击了哪个按钮。
    • 这几乎可以工作。它返回表单的 id,而不是按钮。感谢您迄今为止的帮助
    • 我只是更改了它以纠正我犯的错误。为每个按钮添加一个提交类,然后在提交之前在您的 jquery 目标中添加一个点,如上所示。还将变量更改为 $this 而不是 this。我只喝了第一杯咖啡,所以我还没有参加比赛!
    猜你喜欢
    • 2015-10-02
    • 2019-01-16
    • 1970-01-01
    • 2012-12-29
    • 2018-01-19
    • 1970-01-01
    • 2017-03-19
    • 2019-10-11
    • 1970-01-01
    相关资源
    最近更新 更多