Question

当用户想要在基本时间表网格中输入url()时，我有以下功能来调出modal/dialog。我使用ajax发布表单，工作正常，并按照我的意愿返回。

问题在于，当我第二次使用该函数时，无论我第二次输入的是什么，它都会使用我第一次放入shift的值。

即。 Attempt1

输入方框11:00:00 - 17:00:00
传递给php页面11:00:00 - 17:00:00

ATTEMPT2

进入方框14:00:00 - 22:00:00
传递给php页面11:00:00 - 17:00:00

我设法通过textboxes获取清除值的功能。但即使我这样做，在任何后续尝试中，我也无法输入新值。它只是发布空的，无论我输入什么。它正确传递所有其他变量，如$("#starttime").val('');和date``week。

year

修改

这是我的ajax电话。我根据给出的第一个答案改变了它，这确实有意义。然而，它并没有像现在这样改变行为。

function newshiftClick(eid, date, week, year) {
    $("#delete-confirm").html("Please input start and finish times for the new shift.<br>\n\
Start:&nbsp;&nbsp;<input type='text' size='8' id='starttime' placeholder='00:00:00'><br>\n\
Finish:&nbsp;&nbsp;<input type='text' size='8' id='finishtime' placeholder='00:00:00'><br>");


    $("#delete-confirm").dialog({
        resizable: false,
        modal: true,
        title: "New Shift",
        height: 200,
        width: 300,
        buttons: {
            "Yes": function () {
                var starttime = document.getElementById("starttime").value;
                var finishtime = document.getElementById("finishtime").value;
                console.log(starttime);
                console.log(finishtime);
                console.log(date);
                $.ajax({
                    type: "POST",
                    url: "ajaxrequest.php",
                    data: { action: "newshift", 
                            eid: eid,
                            date: date,
                            starttime: starttime,
                            finishtime: finishtime,
                            week: week,
                            year: year
                          },
                    success: function(response) {
                        clearSchedule();
                        document.getElementById("editorpanel").innerHTML = response;
                        console.log(response);
                        $("#starttime").val('');
                        $("#finishtime").val('');

                                }

                });


                $(this).dialog('close');

            },
                "No": function () {
                $(this).dialog('close');
            }
        }
    });
}

我也尝试在$.ajax({ type: "POST", url: "ajaxrequest.php", data: { action: "newshift", eid: eid, date: date, starttime: $("#starttime").val(), finishtime: $("#finishtime").val(), week: week, year: year }, success: function(response) { clearSchedule(); document.getElementById("editorpanel").innerHTML = response; console.log(response); $("#starttime").val(''); $("#finishtime").val(''); } });的末尾使用$("#delete-confirm").html('');。

Answer 1

你的问题是：

var starttime = document.getElementById("starttime").value;
var finishtime = document.getElementById("finishtime").value;

这些变量将被评估一次，当＆＃34;是＆＃34;函数得到评估，因为jQuery为您构建对话框。然后它们成为ajax调用的闭包/范围的一部分，并且它是一个包装。在那一点上，它们变得一成不变。

为了解决这个问题，我会摆脱你的前三行＆＃34;是＆＃34;按钮处理程序函数并更改您的ajax调用，以便它以这种方式读取：

$.ajax({
                type: "POST",
                url: "ajaxrequest.php",
                data: { action: "newshift", 
                        eid: eid,
                        date: date,
                        starttime: $("#starttime").val(),
                        finishtime: $("#finishtime").val(),
                        week: week,
                        year: year
                      },
                success: function(response) {
                    clearSchedule();
                    document.getElementById("editorpanel").innerHTML = response;
                    console.log(response);
                    $("#starttime").val('');
                    $("#finishtime").val('');

                            }

            });

换句话说，在发送请求的确切时间获取输入的值;不要将它预先加载到一个变量中，该变量的范围/结束是你无法控制的（或者不知道如何）。

Answer 2

在我的模态的关闭事件之后添加第二行除了下面的建议之外还有其他功能。鉴于我对模态中的各种不同类型的内容使用相同的<div>，并在调用模态时定义innerhtml。

$(this).dialog('close');
$(this).remove(); //this line

编辑：第二个选项

$("#starttime").remove();
$("#finishtime").remove();

Jquery ajax - 无法在文本框中设置新值 - 模态

2 个答案: