Ajax - 如何将参数从html输入发送到服务

时间:2017-01-05 10:03:26

标签: javascript jquery ajax input

我想将两个输入的日期作为参数发送到服务。我的HTML代码:

<input type="date" name="dateFrom" value="2016-10-29">
<input type="date" name="dateTo" value="2016-11-29">
<a class="action-button" id="history-report">Generate report</a>

现在我刚刚对日期值进行了硬编码,但稍后将从日历中选择它们。

我想将日期值与请求一起发送。我写了以下代码将它们发送到服务:

$('#history-report').click(
    function(event){
        event.preventDefault();
        showLoading()
        const dateFrom = $('input[name="dateFrom"]').val();
        const dateTo = $('input[name="dateTo"]').val();
        $.ajax({
            type:"POST",
            url:'/params/generate-commission-disposition-report',
            data: {
                dateFrom: dateFrom,
                dateTo: dateTo
            },
            dataType:'json'
        }).done(function(response){
            hideLoading();
            if(response.success === true){
                $('#ajax-success').html(response.msg);
                showSuccess(5000);
            }else{
                showError("Generation error");
            }
        })
        .fail(function(response){
            hideLoading();
            showError("Generation failed")
        });
    }      
);

代码是正确的解决方案吗?目前它不起作用,但我不确定这里是否存在错误,或者我以后使用的服务是错误的。

1 个答案:

答案 0 :(得分:1)

您已经在以下两行中编写了dataFrom和dataTo而不是dateFrom和dateTo。请更改它们,它会起作用:

const dateFrom = $('input[name="dateFrom"]').val();
const dateTo = $('input[name="dateTo"]').val();

所有其他事情看起来都不错。