在同一个 html 页面上使用 ajax 变量

Question

我在我的应用程序中使用了 Input type="date" 字段来接受来自用户的日期值。但是我必须将名为“sdate”的日期值发布到操作方法中使用的地址中，如下所示。我想将 Input 类型日期字段的值发布到 Form Post 方法的操作中。

我已经通过 AJAX 将这些值存储到变量中，但是如何将这些 AJAX 变量用于

我写的视图代码如下：

<form method="post" id="report" class="live" target="_blank" action="http://wcidevapps.com/salescentral/jm2/troute.php?custnum=<?php echo $KUNNR?>&staffid='+staffid+'&rdate='+sdate+'">

<fieldset><legend>Today's Tasks</legend></fieldset>

<div class="span5 well">
    <div class="form-inline">
        <label class="control-label"><b> For </b> </label>
            <input type="text" name="stech" id="stech"/>
    </div><br/><br/>

    <div class="form-inline">
        <label class="control-label"><b> On </b> </label>
            <input type="date" class="datefield" name="sdate" id="sdate"/>
    </div><br/><br/>

    <button type="submit" name="open" class="btn btn-primary offset4"><i class="icon-file"></i> Open</button>
</div>

</form>



<script type="text/javascript">

var onFilter = function () {
        var obj = {
            sdate: $("#sdate").val(),
            stech: $("#stech").val()
        };
        $.ajax({
            method: 'POST',
            dataType: "JSON",
            contentType: "application/json; charset=utf-8",
            url: root + 'standard_projects/?json',
            data: obj,
            success: function (d) {
            sdate=d.sdate,
            staffid=d.staffid
            }
        });
    }
    $("#sdate").live("change", onFilter);
    $("#stech").live("change",onFilter);
</script>

如何使用这些 AJAX 变量？ 日期和员工编号

Answer 1

您不能在 ajax 之外使用 ajax 变量。而不是从脚本开头声明变量

Answer 2

我认为你错过了document ready handler，一切似乎都很好。在最新的 jQuery 版本中不推荐使用 live，因此您可以使用 .on() 处理程序。

你错过了一些';'

来自 jQuery 文档：

从 jQuery 1.7 开始，.live() 方法已被弃用。使用 .on() 来 附加事件处理程序。

试试这个，看看是否有帮助：

<script type="text/javascript">

var onFilter = function () {
        var obj = {
            sdate: $("#sdate").val(),
            stech: $("#stech").val()
        };
        $.ajax({
            method: 'POST',
            dataType: "JSON",
            contentType: "application/json; charset=utf-8",
            url: root + 'standard_projects/?json',
            data: obj,
            success: function (d) {
            sdate=d.sdate; //<--------------missing ';'
            staffid=d.staffid; //<----------missing ';'
            $('form#report').attr("action", "http://wcidevapps.com/salescentral/jm2/troute.php?custnum="+<?php echo $KUNNR?>+"&staffid=" + staffid + '&rdate=' + sdate + '"');
            }
        });
    }; //<----------------------------------missing ';'
    $(function(){
        $(document).on("change", "#sdate", onFilter);
        $(document).on("change", "#stech", onFilter);
    });
</script>

Answer 3

只需在你的成功函数中使用它

<form method="post" id="report" class="live" target="_blank" action="http://wcidevapps.com/salescentral/jm2/troute.php?custnum=<?php echo $KUNNR?>&">

//...
var report=$('#report), 
    url=report.attr('action'), 
    useStaff = function(staffid, sdate){
        report.attr('action', url+'staffid='+staffid+'&rdate='+sdate);
        //submit report or so...
    };
$.ajax({
        method: 'POST',
        dataType: "JSON",
        contentType: "application/json; charset=utf-8",
        url: root + 'standard_projects/?json',
        data: obj,
        success: function (d) {
            useStaff(d.staffid, d.sdate);
        }
    });